The B. Davis Schwartz Memorial Library

TEXT APPEARANCE

These are the physical style tags. You're not supposed to use them, but everyone does (including me) because they're easy to remember:

Instead, you should use logical style tags, but very few people do. Text-only browsers, in particular, are happier if you use these:

There are several other logical style tags, but they tend to duplicate what can be done with these - although they do have uses in specialized situations. Try some of the other websites if you really want to know.


Headers

The header tags: <H1> <H2> <H3> <H4> <H5> <H6> (not to be confused with the <HEAD> tag), are among the oldest HTML tags for controlling the appearance of text. Graphical browsers will display them in different sizes, while text browsers automatically assign different attributes to each like bold, underline, reverse text, etc. Their primary function is not to merely alter the text appearance but to mark off the titles of different sections of your page according to their importance. There are six levels of header that serve as kind of an outline structure for your page.

<H1>Use level 1 to mark off the major sections of a page</H1>

<H2>Level 2 marks off the major sub-sections of each level 1 header</H2>

<H3>Level 3 marks off the major sub-sections of each level 2 header (also known as a sub-sub-section of a level 1 header)</H3>

<H4>Level 4 marks off the major sub-sections of each level 3 header (also known as a sub-sub-section of a level 2 header or a sub-sub-sub-section of a level 1 header)</H4>

<H5>Level 5 marks off the major sub-sections of each level 4 header (also known as a sub-sub-section of a level 3 header or a sub-sub-sub-section of a level 2 header, and so on)</H5>
<H6>Level 6 marks off the major sub-sections of each level 5 header (also known as a sub-sub-section of a level 4 header or a sub-sub-sub-section of a level 3 header, and so on)</H6>

No other text can be on the same line as the header. Proper use of the header tags would look something like this:

Shakespeare's History Plays

Shakespeare wrote several plays that take place during historical periods and thus are called the history plays. Here is some text to fill out the rest of this space and make it look like there's real information here. Now is the winter of our discontent made glorious summer by this sun of York; and all the clouds that lour'd upon our house in the deep bosom of the ocean buried. Now are our brows bound with victorious wreaths; our bruised arms hung up for monuments; our stern alarums chang'd to merry meetings, our dreadful marches to delightful measures.

Richard III

Richard III says the following speech, although a misprint in my edition indicates that someone named Glos says it. It is very common for there to be textual differences between the various early quarto and folio editions of Shakespeare's plays, and scholars endlessly debate as to which version is the most authentic. My personal reading of the play is that the story makes much more sense if Richard, rather than this Glos person (who without explaination disappears about half way through, so he couldn't have been a very important character anyway) says it: Now is the winter of our discontent made glorious summer by this sun of York; and all the clouds that lour'd upon our house in the deep bosom of the ocean buried. Now are our brows bound with victorious wreaths; our bruised arms hung up for monuments; our stern alarums chang'd to merry meetings, our dreadful marches to delightful measures.

Henry V

This text has nothing to do with Henry V or any of the other plays listed here, but I don't feel like typing new text for each one. Now is the winter of our discontent made glorious summer by this sun of York; and all the clouds that lour'd upon our house in the deep bosom of the ocean buried. Now are our brows bound with victorious wreaths; our bruised arms hung up for monuments; our stern alarums chang'd to merry meetings, our dreadful marches to delightful measures.

The Battle of Agincourt

This is a historical battle (or, as the British would say, an historical battle) that is portrayed in Henry V. Now is the winter of our discontent made glorious summer by this sun of York; and all the clouds that lour'd upon our house in the deep bosom of the ocean buried. Now are our brows bound with victorious wreaths; our bruised arms hung up for monuments; our stern alarums chang'd to merry meetings, our dreadful marches to delightful measures.

Henry IV, Part 1

This play is very different from Henry V because it has a different number. It is extremely different from Richard III because it has both a different number and a different name. Now is the winter of our discontent made glorious summer by this sun of York; and all the clouds that lour'd upon our house in the deep bosom of the ocean buried. Now are our brows bound with victorious wreaths; our bruised arms hung up for monuments; our stern alarums chang'd to merry meetings, our dreadful marches to delightful measures.

Shakespeare's Tragedies

You're not still bothering to read this text are you? Now is the winter of our discontent made glorious summer by this sun of York; and all the clouds that lour'd upon our house in the deep bosom of the ocean buried. Now are our brows bound with victorious wreaths; our bruised arms hung up for monuments; our stern alarums chang'd to merry meetings, our dreadful marches to delightful measures.

King Lear

This play must have caused much debate among earlier scholars because it is a historical play that is not considered a history play and thus ended up classified with the tragedies. Now is the winter of our discontent made glorious summer by this sun of York; and all the clouds that lour'd upon our house in the deep bosom of the ocean buried. Now are our brows bound with victorious wreaths; our bruised arms hung up for monuments; our stern alarums chang'd to merry meetings, our dreadful marches to delightful measures.



The <FONT> Tag

The <FONT> tag allows for more detailed control of the text appearance, but it or some of its features are not supported by as many browsers.

Font Size

There are seven sizes for the text that can be selected with the size command. I like size 4 because it's easier on the eyes when trying to read large amounts of text, even though it doesn't look as nice on the screen as size 3 which is the most commonly used.

<FONT size=1>Now is the winter of our discontent</FONT>

<FONT size=2>Now is the winter of our discontent</FONT>

<FONT size=3>Now is the winter of our discontent</FONT>

<FONT size=4>Now is the winter of our discontent</FONT>

<FONT size=5>Now is the winter of our discontent</FONT>

<FONT size=6>Now is the winter of our</FONT>

<FONT size=7>Now is the winter of</FONT>

Size 3 is also the default size which will be used if no size is specified in your HTML. The actual size that size 3 will appear is determined by the font settings in the browser's options menu. In Netscape for Windows, the proportional font will usually be 12 point Times New Roman and the nonproportional (fixed) font will usually be 10 point Courier New. However, users can change these default settings to any font or size that they wish, and this can seriously alter the way that your page will appear on their browser.

For example, if I reset my default font to 10 point Times New Roman, size 3 will appear smaller - the equivalent of size 2 in the above example. Size 2 will appear like size 1, and size 1 will still appear as size 1 because no smaller size is allowed. Each of the larger sizes will also appear one step smaller. If your browser supports this command, and you don't see seven different sizes in the above example, your font settings may be different from mine.

Another way of controlling the text size, which partially deals with this situation, is to use the plus and minus signs. Size +1 means one step larger than the default. Size -1 means one step smaller than the default. And so on:

<FONT size=-2>Now is the winter of our discontent</FONT>

<FONT size=-1>Now is the winter of our discontent</FONT>

<FONT size=+0>Now is the winter of our discontent</FONT>

<FONT size=+1>Now is the winter of our discontent</FONT>

<FONT size=+2>Now is the winter of our discontent</FONT>

<FONT size=+3>Now is the winter of our</FONT>

<FONT size=+4>Now is the winter of</FONT>



Text Color

You can use the <BODY> tag to control the text color of the entire page. If you want to override the color in the <BODY> tag for a specific section of text, you can use the color command along with the hexidecimal number for the color you want:

<FONT color="#000000">Now is the winter of our discontent</FONT>

<FONT color="#FF0000">Now is the winter of our discontent</FONT>

<FONT color="#00FF00">Now is the winter of our discontent</FONT>

<FONT color="#0000FF">Now is the winter of our discontent</FONT>

<FONT color="#FFFF00">Now is the winter of our discontent</FONT>

<FONT color="#FF00FF">Now is the winter of our discontent</FONT>

<FONT color="#00FFFF">Now is the winter of our discontent</FONT>

<FONT color="#FFFFFF">Now is the winter of our discontent</FONT>

Make sure that you choose a color that can be easily read against the background color or graphic. Some of these examples would be very bad choices for this page. See the section on hexidecimal colors for information about creating additional colors.

As with other tags, you can combine commands:

<FONT color="#990000" size=5><B>Now is the winter</B></FONT>



Changing the Font

The FACE command lets you choose a different font:

<FONT face="arial">Now is the winter of our discontent</FONT>

<FONT face="script">Now is the winter of our discontent</FONT>

<FONT face="roman">Now is the winter of our discontent</FONT>

<FONT face="courier new">Now is the winter of our</FONT>

<FONT face="modern">Now is the winter of our discontent</FONT>

The problem with this command is that the browser does not create these fonts. It can make use of only those fonts that are already installed on the user's computer, and you have no way of knowing what fonts those are. If you select a font that the user doesn't have, the browser will select an alternate font which will result in a look very different from the one you intended. Arial is pretty common on Windows computers, but anything else is kind of iffy (I don't know the names of any Macintosh fonts). So far, I've avoided using this command.


Blinking Text

Placing the <BLINK> </BLINK> tags around text will cause it to blink in browsers that support this feature. It is very annoying to try to read a large block of blinking text, so please have mercy on your visitors by not overusing it.

A better example would be:

NOTE: Do not overuse the <BLINK> tag.




Previous Section
Table of Contents
Next Section



Return to the Library Home Page

HTML by Robert Delaney
rdelaney@liu.edu



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