The B. Davis Schwartz Memorial Library

BEFORE YOU BEGIN

What are HTML Tags?

HTML stands for Hypertext Markup Language, and HTML tags are instructions placed within angle brackets < > that tell your computer how the text and graphics (pictures or images) on a web page should be displayed. In most cases, the tags come in pairs like this: <TAG> </TAG>. The first tag tells the computer to start doing something to the text, and the second tag (with a slash /) tells it to stop.

For example, to produce the boldface text around the word "start" in the above sentence, the HTML tags would look like this:

tells the computer to <B>start</B> doing something

In most cases, it does not matter if you use upper case or lower case letters in the tags, but there are a few important exceptions that will be discussed later.


What Are Browsers?

A browser is the software that you use to retrieve and view web pages. Currently, the two most widely used graphical browsers (browsers that can display pictures) are Netscape and Internet Explorer. But there also many others including Opera, Mosaic (the first graphical browser), and custom browsers created by various internet access companies for their customers. There are also non-graphical browsers such as Lynx which display text but not pictures. In addition, not everyone feels the need to upgrade their browser as soon as a new version of it is released, so many different versions of each of these are currently in use.

Why do I need to know this?

HTML is no longer as standardized as its original creators had intended. As a result, tags for some effects will work in some browsers but not others. And older versions of browsers usually support fewer of the tags than the newer versions, with new versions supporting new tags being released every few months. Also different browsers may interpret the same tags in slightly different ways. Finally, the Macintosh and PC versions of the same browser might display a page in different ways.

What should I do about this?

There are four ways of dealing with this:

The nice people at BrowserCaps have done a lot of testing to see which features will work in which browsers.


What Software Do I Need?

Browser
So you can see how your page looks. You may want to have more than one kind, so you can see how your page will look to different people. Or you can make a list of friends who have different browsers and computer systems and ask them look over your site.

Text Editor
HTML files are in a format called ASCII text (also called DOS text, MS-DOS text, Text file, Text only, and assorted similar names). Any software that allows you to type in text and save it as an ASCII file can be used to create web pages. This includes simple text editors like Notepad, WordPad, and DOS Edit to full word processors like WordPerfect and Microsoft Word. Just choose the proper format in the Save As dialog box, and name your file something like filename.htm or filename.html.

There are also many programs specifically for creating HTML files which will "protect" you from having to learn HTML, but I assume that you wouldn't be here if you didn't want to learn it.

Graphics
If you want to create your own pictures and images or alter pre-existing ones, you'll need some sort of graphics software. I started out just using Windows Paintbrush and a freeware program called LView and still use them for most things, but much fancier (and more expensive) software is available. See the section on Graphics for more details.


Are there characters I should not use? (Entities)

Ampersands, angle brackets, and quotation marks (& < > ") have special meanings in HTML, and using them in the text might confuse some browsers, causing them to display the page wrong. If you wish to use them, you should use their entities instead:

&amp;  -  &       &lt;  -  <       &gt;  -  >       &quot;  -  "

Entities can also be used to create special characters (© ½ £) and international characters (é ñ ö). Here's a nice list. Note that most entities must be in lower case letters while some use a combination of upper and lower case. This is one of the few places in HTML where case matters.


What Are Pixels?

Pixels (picture elements) are the small dots that make up the image on your computer screen. Currently, most PC monitors are set at a pixel resolution of 640x480 which means that the image across the entire screen is 640 pixels wide and 480 pixels high. People with larger monitors and more powerful computers may reset the resolution to 800x600, 1024x768, or even higher. If a graphic or table on your web page is is wider than 640 pixels, users with 640x480 screens will have to scroll back and forth to see all of it which can be really annoying when trying to read the text. (Actually you'll want them to be a little less than 640 because the scroll bar takes up some of that screen space). I think (but am not sure) that Mac monitors use slightly different numbers in their resolutions.


What Are Hexadecimal Colors?

In HTML, colors are represented as hexadecimal numbers.

What are hexadecimal numbers?

Normally, we count with a decimal number system which uses ten digits (0123456789) and progresses like this:

00, 01, 02, 03, 04, 05, 06, 07, 08, 09
10, 11, 12, 13, 14, 15, 16, 17, 18, 19
20, 21, 22, 23, 24, 25, 26, 27, 28, 29
etc.

A hexadecimal number system uses sixteen digits, with the letters ABCDEF representing the numbers after 9, and progresses like this:

00, 01, 02, 03, 04, 05, 06, 07, 08, 09, 0A, 0B, 0C, 0D, 0E, 0F
10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 1A, 1B, 1C, 1D, 1E, 1F
20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 2A, 2B, 2C, 2D, 2E, 2F
etc.
90, 91, 92, 93, 94, 95, 96, 97, 98, 99, 9A, 9B, 9C, 9D, 9E, 9F
A0, A1, A2, A3, A4, A5, A6, A7, A8, A9, AA, AB, AC, AD, AE, AF
B0, B1, B2, B3, B4, B5, B6, B7, B8, B9, BA, BB, BC, BD, BE, BF
etc.

Therefore, for our purposes here, the lowest number is 00, and the highest number is FF.

How does the number represent a color?

There are three primary colors - RED, GREEN, and BLUE (RGB)- that can be mixed together to make all the other colors. HTML uses two digits to represent each of these primary colors for a total of six digits (RRGGBB). The first two digits create red, the second two create green, and the third two create blue.

To create a bright red, set the red digits at the highest value (FF), and set the green and blue digits at the lowest value (00). The result is FF0000.

To create a bright green, set the green digits at the highest value (FF), and set the red and blue digits at the lowest value (00). The result is 00FF00.

To create a bright blue, set the blue digits at the highest value (FF), and set the green and red digits at the lowest value (00). The result is 0000FF.

Red and blue make purple (FF00FF); red and green make yellow (FFFF00); blue and green make aqua (00FFFF). By changing the number values and "mixing" these primary colors in different combinations, you can create any color you wish from black (000000) to white (FFFFFF), with several million shades in between.

Those of you who learned about mixing primary and secondary colors in an art class might be scratching your heads right now, but the statements above are correct in this context. It has something to do with the difference between the physics of light and the physics of color. I don't fully understand it myself.

Is there an easier way to find the color I want?

Actually, yes. I've created a color chart that shows which numbers make which colors (so don't say that I never do anything for you). Unfortunately, this chart is one of those instances where I could find no option other than to use a feature that works only in certain browsers (Netscape 3.0, Explorer 3.0, and higher).

Do text and font colors work the same as background colors?

They both use the same hexadecimal numbers, but, for some reason, the text will display in only a few shades of each color instead of the full range. The browser selects the nearest of these few shades to the number you selected. For example, the text you're reading now should be dark blue. Some browsers show it so dark that it's almost black, while others show it as a much brighter blue.

Anything else I should worry about?

Keep in mind that not all computers are capable of displaying the millions of different colors that hexadecimal numbers can create. People with older computers will have their color depth set at only 16 colors. People with slightly old (like mine) or lower-end new computers will be set up for 256 colors. Higher-end systems may be set for 65,000 or 16,700,000 colors (although the owners of these systems may choose to set them at a lower color depth so that the computer can devote more of its resources to doing real work rather than making pretty pictures).

This means that if your page uses dark red text on a light red background, it may look good on your screen, but a lower-color-depth screen may display it as plain red text on a plain red background, which will look like a blank red screen with no text. There's nothing you can do about photographs looking terrible on a 16 color screen, but you want the text, at least, to be readable.

Also keep in mind, that even with 16,700,000 colors, most people probably won't be able to see the difference between 0000FF and 0100FF, and that different computers will display the same shades in a slightly different manner.



Table of Contents
Next Section



Return to the Library Home Page

HTML by Robert Delaney
rdelaney@aurora.liunet.edu



     Return to Long Island University Home Page                        
                Return to  C.W. Post Campus Home Page