Chapter 11 contained some advanced material, so don't feel alone if you're feeling a little brain-frazzled at this point. Fortunately, the hard stuff is mostly over and relief is in sight. If you liked Chapter 9, "A Guided Tour of HTML,"
you're going to like this chapter too. Because Chapter 9 was geared as an introduction for first-time Web page designers, it intentionally omitted some of the most recent advances in HTML. That's where this chapter fits in. Here, we talk about several of
the hottest new things happening on the Web.
As you may have heard, Netscape Communications has frequently been a leader of new developments in HTML. Although HTML 2.0 has not been officially adopted at the time of this writing, it is almost entirely based on HTML 1.0 and the Netscape extensions.
In other words, Netscape is trying to set the standard, and so far the Web community has looked favorably upon their suggestions.
The IETF (Internet Engineering Task Force) is responsible for writing the formal HTML specifications. Actually, the IETF (which is responsible for many other standards, such as RFCs) gives projects like this to a working groupin this case the W3C
(World Wide Web Consortium). First W3C, and then the IETF, go through a very careful process to ensure that new HTML standards meet the needs of the Web community and are backward-compatible (as much as possible) with existing Web documents. With HTML 2.0
now nearing the end of that process, you can look for it to be adopted sometime in early 1996.
In the meantime, Netscape isn't standing still. Their extensions have also contributed to the design of HTML 3.0, which was originally referred to as HTML +. The unofficial HTML 3.0 is already supported by several Web browsers, including Netscape
Navigator (of course), and a public domain browser that the IETF is building called Arena. If you decide to take advantage of either the Netscape extensions or HTML 3.0 in your Web pagesand you are about to see that there are many advantages
to doing soyou can at least count on the fact that a good percentage of clients who visit your site will be able to see your Web pages rendered as you intended. This is true simply because of the wide popularity of Netscape. Using these extensions,
however, might cause your pages to look odd on other Web browsers until HTML 2.0 and HTML 3.0 are more widely adopted.
There is a confusing aspect of this with regard to version numbers. Perhaps the map of HTML versions in Figure 12.1 will help to clear this up. Although the Netscape extensions don't really have a formal version number, people on the Net talk about them
in terms of the latest version of Netscape Navigator that is available. For example, Netscape Navigator 1.2N implements the 1.2 Netscape extensions. As Netscape continues to include other HTML 3.0 ideas in Navigator, the HTML 2.0 and 3.0 drafts also evolve
to include many of the Netscape ideas.
Figure 12.1. The map of HTML versions.
The Netscape extensions to HTML consist of new tags and attributes. These have been built on top of the broadly adopted HTML 1.0 specification in a manner that is intended to be backward-compatible with existing WWW browsers. This way, if an older
browser retrieves a page with a new tag it doesn't understand, it will just ignore it. The hope is that the page will still be displayed in readable fashion, even if not exactly as intended.
This section explains some of the major Netscape extensions. Some of these are already in the HTML 2.0 specification; a few others are in HTML 3.0.
To the <ISINDEX> tag, Netscape has added the PROMPT attribute. <ISINDEX> indicates that a document is a searchable index. PROMPT has been added so the document author can specify what message is to appear before the text input field of the
index. Without a custom prompt, the default is that the standard message you may have come across before: This is a searchable index. Enter search keywords:
Netscape added four new attributes to the <HR> tag to enable the document's author to describe how the horizontal rule should look:
Netscape added a TYPE attribute to the <UL> tag so no matter what your indent level is, you can specify whether you want a TYPE=disc, TYPE=circle, or TYPE=square as your bullet.
Netscape added the TYPE and START attributes to the <OL> tag as follows:
Netscape added the TYPE attribute to the <LI> tag as well. It takes the same values as either <UL> or <OL>, depending on the type of list you are in, and it changes the list type for that item and all subsequent items. For ordered
lists, they have added the VALUE attribute so you can change the count for that list item and all subsequent items.
The additions to the ALIGN options need a lot of explanation. Images with the alignment values left and right are an entirely new floating image type. An image specified as ALIGN=left will float down and over to the left margin (into the
next available space there), and subsequent text will wrap around the right side of that image. Likewise, for ALIGN=right, the image aligns with the right margin and the text wraps around the left. For example
<IMG ALIGN=left|right|top|texttop|middle|absmiddle|baseline|bottom|absbottom>
ALIGN=top aligns itself with the top of the tallest item in the line.
ALIGN=texttop aligns itself with the top of the tallest text in the line.
ALIGN=middle aligns the baseline of the current line with the middle of the image.
ALIGN=absmiddle aligns the middle of the current line with the middle of the image.
ALIGN=baseline aligns the bottom of the image with the baseline of the current line.
ALIGN=bottom is identical to ALIGN=baseline.
ALIGN=absbottom aligns the bottom of the image with the bottom of the current line.
The WIDTH and HEIGHT attributes were added to <IMG> mainly to speed up display of the document. If the author specifies these, the viewer of the document won't have to wait for the image to be loaded over the network and its size calculated.
Normal <BR> just inserts a line break. Netscape added a CLEAR attribute to <BR>, so CLEAR=left will break the line and move vertically down until you have a clear left margin. CLEAR=right does the same for the right margin, and CLEAR=all
moves down until both margins are clear of images.
The <NOBR> tag, which stands for no break, means all the text between the start and end of the <NOBR> tags cannot have line breaks inserted between them.
The <WBR> tag stands for word break. This is used in the rare cases in which you have a <NOBR> section and you know exactly where you want the text to break. The <WBR> tag will not force a line break.
<FONT SIZE> enables you to change the font size. Valid values are from 1 to 7. The default font size is 3. The value given to SIZE can optionally have a + or - character in front of it to specify that it is relative to the base font of the
document. The default base font is 3 and can be changed with the <BASEFONT> tag.
This changes the size of the base font. The value of the SIZE attribute defaults to 3 and has a valid range from 1 to 7.
This is one of the most-used Netscape extensions. All lines of text between the beginning and end of <CENTER> are centered between the current left and right margins.
This tag emphasizes sections your documents by causing the enclosed text to blink (no surprise). Be careful not to overuse this affect, because many people consider it an eye-sore.
Finally, the following two new named entities come in handy on business pages:
®the Registered Trademark symbol was previously only available as ®
©the Copyright symbol; this entity works just like ©, but now you don't have to look up the magic number anymore.
Netscape Navigator currently supports HTML 3.0. Much of 3.0 is documented and in use on the Web today, but it is a moving target. A couple of the important additions in Netscape Navigator 1.1 that aren't in HTML 3.0 are backgrounds and dynamic updating
to documents. And the Netscape support of tables goes beyond the proposed design for tables in the current draft of HTML 3.0.
Many people confuse the Netscape extensions to HTML to be HTML 3.0, but this is not the case. The IETF and Netscape cooperate, but they each play their own tunes. Although many of the Netscape extensions have made their way into HTML 3.0, there are also
several that aren't in the current Internet draft. Currently, there isn't any public specification for the Netscape extensions except the information at their Web site, mentioned previously.
Even though the Netscape browser is widely used (Beverly Hills Software Web site at http://www.bhs.com reports that 87% of all user agent requests are from Netscape clients), care must be taken when using Netscape extensions. A common practice is to
include a comment on your home page saying something like "This page uses the Netscape extensions and is best viewed using a Netscape compatible browser." Even when you use a statement such as this, it is a good idea to examine your own HTML
documents with several browsers during the design stage. By doing this comparison, you will find you can reach a happy compromise that allows for Netscape-enhanced pages that don't look terrible under other browsers. We like to compare the rendering of our
HTML code between Netscape, Mosaic, and the Microsoft Internet Explorer. Considering Internet Explorer is now in the hands of 20 million potential Web users, Mosaic is popular on UNIX and the Mac, and Netscape is, well, Netscape, this trio should cover the
vast majority of the Web. If all of these browsers display your document the way you want, you know your HTML is pretty safe for the whole Web.
HTML 3.0 has several important new features. To name a few: tables; figures (<fig>) as a substitute for the image tag(<img>); support for mathematical formulae; banners; divisions; footnotes; and style sheets. You will find a complete
encyclopedia of HTML in Appendix H, which shows tags that are specific to HTML 3.0 and to HTML 2.0. Here is a quick look at the major changes in 3.0.
Tables were the most requested feature for HTML 3.0. The IETF decided to stick to a powerful but simple model for creating nice looking tables. See Figure 12.2 for an example of a table created in HTML 3.0 as it appears in Netscape Navigator.
Figure 12.2. A simple HTML 3.0 table shown in Netscape Navigator 2.0 beta.
This table was created by the following short HTML code:
<HTML> <HEAD> <!-- Created: 9/26/95 9:22:11 PM --> <TITLE>Sample table</TITLE> </HEAD> <BODY> <H1>Sample Table</H1> <TABLE BORDER> <TR> <TD>apples</TD> <TD>25</TD> </TR> <TR> <TD>oranges</TD> <TD>10</TD> </TR> </TABLE> <HR> Last Updated: Tuesday, September 26, 1995 </BODY> </HTML>
The <TABLE BORDER> tag begins the table. Each <TR> tag defines a table row. The <TD> tags define table data elements, as you read across the table.
One of the most talked-about features that Netscape added to Navigator 2.0 is Frames. Netscape Frames are yet another addition to HTML 3.0. A framed Web page is much like a Web page within a Web page. Here is the basic structure of a framed page:
<HTML>
<HEAD>
</HEAD>
<FRAMESET>
</FRAMESET>
</HTML>
Notice that the <BODY> tag is replaced by the <FRAMESET> tag in a framed Web page.
Figure 12.3 is an example of HTML frames. It demonstrates how the YourCo home page (which we will be discussing in detail in the next chapter) can be modified to display four HTML pages in one. Each frame can be sized separately by dragging the border
between them. Indeed, each frame can even behave as a separate browser. There are many practical uses for frames. Once again, it is only up to your imagination what you can do with this new capability.
Figure 12.3. The YourCo sample site demonstrating HTML frames in Navigator 2.0.
The full source code for this example of frames is available on the CD-ROM. (Just check the Appendix for the location of the files.) Please see this URL for all the details and the syntax for creating HTML frames:
http://home.mcom.com/assist/net_sites/frame_syntax.html.
HTML is intended for document content markup on the server side. By design, it is not intended to provide direct control over the exact appearance of the document in the browser on the client side. One reason is portability. There is no way of
controlling which browser and which font every client will have available. This state of affairs can be frustrating to graphic artists. Style sheets are intended to give page designers, or even the user of the browser, the opportunity to govern how the
page is displayed in terms of fonts, colors, and other elements.
The IETF is still considering exactly how to implement style sheets into HTML 3.0. For the latest information, please see the URLs mentioned previously.
Most of us probably haven't missed being able to write the calculus integral symbol into our HTML code. However, considering the Web got started in a physics lab, it's only natural that these features would eventually find their way into HTML.
Unfortunately, these 3.0 features are just as much a moving target as style sheets. To learn more, please see Appendix H, "HTML Encyclopedia," for an introduction, and/or visit the HTML 3.0 specification at
http://www.ietf.cnri.reston.va.us/ids.by.wg/html.html.
Style and style sheets are similar, but not the same. Although style sheets provide some degree of control over the appearance of Web documents, the subject of style is more a topic of what to do and what not to do in Web page design (whether style
sheets are used or not).
Web purists make remarks such as, "It's the content, not the presentation." That philosophy notwithstanding, Web designers obviously do have a great deal of control over many appearance factors, such as when to use a hyperlink, a bullet list,
or a heading level 2. You might be tempted to think that some choices are arbitrary, but be careful. If your pages demonstrate disregard for certain accepted Web standards or are hard to read, you might not get any repeat visitors. There is a lot to be
said for having good style.
Here are a few resources concerning HTML style:
Now that you know everything cool about HTML, it's time to get busy. The next chapter shows you how to put together a complete Web site based on several HTML files. The files include hyperlinks, graphics, CGI, e-mail, and download capability.