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:
What Software Do I Need?
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.
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:
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
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
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
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.
HTML by Robert Delaney