Later you will be introduced to the more structural and canonical methods of controlling the appearance of text under XHTML. But for now, here are the methods that most designers used throughout the '90s to apply style, emphasis and imply structure in standard HTML.
The basic HTML text-frmatting tags:
<b>Bold</b>
<i>Italic</i>
<u>Underline</u>
<tt>Typwriter</tt>
<h1>Headline 1</h1>
<h2>Headline 2</h2>
<h3>Headline 3</h3>
<h4>Headline 4</h4>
<h5>Headline 5</h5>
<h6>Headline 6</h6>
In addition to the style-altering tags above, newer browsers also support font tags which allow you to specify size, color and font face for html text. This '90s-style tag has been subsequently abandoned for the more structured CSS method, but you need to see how it's done to be able to read the source of old websites:
<font size="4">Font size tags range from 1 to 7:</font>
1 2 3 4 5 6 7
<font size="1"> 1 </font>
<font size="2"> 2 </font>
<font size="3"> 3 </font>
<font size="4"> 4 </font>
<font size="5"> 5 </font>
<font size="6"> 6 </font>
<font size="7"> 7 </font>
Font size can also be specified using plus and minus signs, as relative to the default size specified by the user (not supported uniformly amongs all browsers):
<font size="+3"> 3 </font>
<font size="+2"> 2 </font>
<font size="+1"> 1 </font>
<font size="-1"> -1 </font>
<font size="-2"> -2 </font>
<font face="Helvetica,Arial">
The newest browsers support the font face tag but specifying a font face not installed on your visitor's system results in a font being substituted. It may not be what you expected.
To ensure that your page looks like what you want it ot on the largest nnumber of browsers and platforms, specify a series of fonts similar in appearance from which the browser can choose a match. The follow are generally available on both Macintosh and Windows systems:
font face="Verdana,Geneva,sans-serif"
font face="Georgia,New York,serif"
font face="Arial,Helvetica,sans-serif"
font face="Comic Sans MS,sans-serif"
Also keep in mind, that some fonts are designed to be viewed on a computer screen and others in printed documents. Screen fonts such as Verdana, Georgia, Geneva and New York are generally more readable on web pages than are print fonts such as Times, Times Roman, Helvetica, Arial, etc., which have equivalent fonts installed in modern printers.
Verdana
Remember that the font you specify must be installed on your visitor's system or what they see may not be what you intended.Helvetica
Remember that the font you specify must be installed on your visitor's system or what they see may not be what you intended.Arial
Remember that the font you specify must be installed on your visitor's system or what they see may not be what you intended.New York
Remember that the font you specify must be installed on your visitor's system or what they see may not be what you intended.Times
Remember that the font you specify must be installed on your visitor's system or what they see may not be what you intended.Times New Roman
Remember that the font you specify must be installed on your visitor's system or what they see may not be what you intended.Georgia
Remember that the font you specify must be installed on your visitor's system or what they see may not be what you intended.Geneva
Remember that the font you specify must be installed on your visitor's system or what they see may not be what you intended.sans serif
Sans-serif is the default headline font set to default in the visitor's browser (usually Helvetica or Arial.)serif
Serif is the default text font set to default in the visitor's browser (usually Times or Times New Roman.)
One of the most difficult and time-consuming aspects of web work for experienced designers is the considerable variation in display between Mozilla (Gecko-based rendering engine) and Internet Explorer and between Macintosh and Windows computers.
It is tempting for PC designers to think, "90% of all computes use Windows, therefore I'm going to ignore the others and use fonts, features and scripts that only work on Internet Explorer (MSIE) and Windows." It is equally tempting for Mac designers to think, "If people want to see print the way it should be seen, let them buy Macs." Both forms of compu-centric thinking are foolish and completely counter to the idea of the web, which from the beginning was intended to be a unifying cross-platform medium.
It is OK to prefer Macs or Windows PCs.
It is not OK to make web pages that do.
Since MSIE 5, type has rendered the same size on both Macs and PCs. Now, thanks to the formation of the World Wide Web Consortium (W3C), a standards development group, browsers on all platforms have been forced to come closer and closer to rendering web pages identically. Internet Explorer 6 (and the recently-released version 7) and Mozilla Firefox are both very nearly fully W3C standards-compliant. For the first time, finally now, in the 21st century, designing to W3C standards make your pages look nearly identical on Macs as well as PCs with Windows.
The fact remains, though, that there are still differences due in larg part to a desire on the part of MSIE designers to support older propietary Microsoft browser code, and you must test your designs on both major platforms to ensure presentation is what you expected. In many cases, there are workarounds that still comply with W3C standards, or can be tricked into it. I would ignore MSIE 4, 5 and older versions of Netscape Navigator; Thankfully, if it looks good on MSIE 6/Windows XP, and on Firefox/Mac, you've pretty much covered 99% of the world's platforms.
<< Background Images | Index | Colors >>