Word Count Total ~   ___1506___

How article actually appeared in Net4TV Voice
Vox Populi, Vox Dei - Vol 2, Issue 2 (#28) - April 11, 1999

ADH-HH Tips & Tools

BBS (Backgrounds, Breaks & Spaces)

One tip became heart-breakingly apparent while editing this issue's article. Unlike a lot of computer based text editors / word processors, WebTV & web page providers do not have an automatic periodic save function. You will save yourself much frustration if you make it a habit to save your editing every 15 minutes or so at least. With the relative ease at which you can accidentally hit the "back" key, for example, & lose some major editing, the time it takes to wait for it to save, etc., is a minimal price to pay. If you have similar (or even more complex) tips that could help others, please use this form to submit your idea. Here are some other tips to consider when creating or editing your web page.

Basic Tip : Horizontal Spacing
   ~~~  submitted by:  V  [ email ]  ~~~
"...If you need to have a horizontal space on your web page putting in..."     "...will give you a space"

Background Info   Often browsers may not recognize a series of spaces in a row. To create the desired spacing you would have to either use the "hard-space" (control-space on a computer keyboard; alt-space on WTV keyboard) or a special character code. The alt-space method sometimes works but results in extra weird characters if you try to validate that page. [NOTE: This is especially true when it comes to "bouncing" e-mail.] Instead, you need to tell the browser just what character you want by using character codes. The   is a code for a non-breaking space.

All characters you can enter from the keyboard have a corresponding code that will allow you to instruct what character you want without actually entering the character itself. These characters are part of the International Organizations of Standard's ISO 8859-1 Character Set, used by HTML. The Web Design Group offers this info: "...The HTML specifications state that HTML uses the ISO 8859-1 (Latin 1) character set for the encoding of documents. If you want to send out an HTML document and ensure everyone will be able to read it as you intended, it must be in this character set." HTML uses this character set. That's why most people with conforming browsers can read our web pages, etc. Further info can be found @ the SGML/XML Web Page.

A few resources for ISO 8859-1 Character Set tables:

To enter characters by their ISO code you would either use a hex code (see tables hyper-linked above) or, for our example, an entity name code. One much used example of entity codes in practice can be found on many Help Site pages & in most of our articles here. Since this article is written in HTML, we cannot simply press the < key to produce a less-than sign that will be visible to the reader since HTML will interpret that as the beginning of a code. So, how do we denote the viewable less-than sign? We use the ISO entity code "&lt;" (without the quotes). It should be noted that although HTML can be entered in either lower or upper case lettering, the ISO entity names are case-sensitive.

Additional Info   The &nbsp; is an ISO entity name for a non-breaking space. You can use as many of the &nbsp; codes as you need to space the text to the point you need. However, if you want to use it for other than indenting the first line of a paragraph or small space differentials, this could be tedious. Another spacing code, ideal for larger spaces, is the <spacer> tag. It's format is <spacer type="horizontal" size="55">. This tag will result in a space 55 pixels in length like thus, . You can fiddle with the size to achieve the desired space needed. As you may deduce, you can also do vertical spacing using this tag. Just replace the type="horizontal" with type="vertical." This method is especially valuable in instances where the browser will not recognize a series or string of paragraph <p> &/or line break <br> tags. Sometimes the browser will ignore the string of tags & treat it as maybe only one or two such tags, regardless of how many you use.

The spacer tag is a bit versatile. In the instance where you want a large area of "white-space", you can use the block attribute. It's format is <spacer type="block" width="195" height="45">. This is the spacer tag we just used here. Well, actually, we modified it a bit by adding the attribute alignment="right." Like image tags, the alignment attribute can be used with the block spacer tag. The "alignment" should be either LEFT, RIGHT, TOP, TEXTTOP, MIDDLE, ABSMIDDLE, BASELINE, BOTTOM, or ABSBOTTOM. If you place a <br> tag before & after the spacer tag, you get the following effect.

Note that the height & width attributes are required for the block spacer tag. The alignment attribute is only used with the block spacer tag. The size attribute is used only with the horizontal or vertical spacer tag. Spacing your page for dramatic effect, to draw your readers' attention to a certain point, or just to make the page look less crowded goes a long way in helping your page appearance & appeal.

Intermediate Tip : Paragraph & Line Breaks
   ~~~  submitted by:  Sue46  [ email ]  ~~~
Paragraphs & line breaks   "Web browsers do not respect the way you have formatted your text. They ignore carriage returns and line feeds. Unless given specific instruction, your text will be fitted to the line length of the browser. Inserting a <br> tag will cause the current line to end and a new one to start. Inserting a <p> tag will cause the current line to end, a blank line to be inserted, and a new line to start."

Preformatted text   "There are times when you want your text to appear just the way you have typed it. You can do this by placing a <PRE> tag at the beginning of the passage, and a </PRE> tag at the end. Your text will appear in a fixed-pitch (typewriter) font and retain any tabs, line feeds, multiple spaces, etc. that you may have included. For example:

     <pre>There was a young man from Boston 
              who bought himself a new Austin. 
                  He had room for his lass 
                     and a gallon of gas
                         but his tie
                            hung out and he 
                              lost 'em.</pre>"

Intermediate Tip : Selecting Backgrounds
   ~~~  submitted by:  Ted  [ email ]  ~~~
"To me, when building a home page and you plan on having a lot of pages, or it grows to have a lot of pages, I think your web site looks better to people when all your backgrounds are the same. It makes the site more appealing and easy to view than every page having a different background with different colors and graphics on the bgrounds."

Having the same background for each page will also aid in easing the load time. If the browser has already loaded the background once, then it will still be in the cache when the next page loads & it will not have to reload it from scratch. Although this will be especially evident with complex graphic-intensive backgrounds, the same holds true for any graphic background.

   ~~~  submitted by:  rasberri  [ email ]  ~~~
"Have you ever clicked on a web site who's backgrounds keep vanishing and reappearing as you navigate through the site? I have found this to be true of pages that are built using WebTV. In fact my pages have vanished into thin air from time to time. The problem: the background gif or jpg is too big. If it's over 800x then it will not stay put. To rectify the problem simply check the size of the background by taking it to ImageMagick / MogrifyMagick and typing it's URL in the http:// box. Once you hit view the size of the background appears. If it is over 800x you can resize the picture by hitting RESIZE and making the larger number (the one on your right) 800x or smaller. Doing this should keep your backgrounds in place."  

Unless they are specifically generated-to-fit backgrounds, most graphic backgrounds are "generated" by the browser taking an image & tiling or repeating the image until it fills the alloted background space. If your image is larger than 800 pixels in width, the effects above are prone to occur. If the graphic chosen for the background is overly complex, besides slowing down load time, the above effects may be prone to occur also.

About Alt.Discuss.Homepage-Homepage Helpers

The alt.discuss.homepage newsgroup is a great source of help if you are just beginning or run into a snag when creating your home page. Each issue, we will focus on one or more tips that will help your home page design. You can visit our home page at http://members.tripod.com/adhhh/ & request more one-on-one assistance. Our Help Teams include: Tutor Team; Construction Crew, if you have a particularly complex design problem; & Image Researhers.