On the 24th of April, 1998, the World Wide Web Consortium (w3c) released a revised recommendation of the HTML 4 specification. With this latest release, HTML 4 now supports frames, style sheets, expanded accessibility for the disabled, and enhanced tables and forms. In this article, I will discuss some of the new features in HTML 4, Cascading Style Sheets, and how they will effect OS/2.
HTML 4 is the latest recommendation of the w3c's HTML language specification. One of the main enhancements has been in the area of accessibility. HTML 4 can make the web much easier to surf for the disabled, especially the visually impaired.
The new elements, ABBR and ACRONYM, can assist speech synthesizers in recognizing abbreviations and acronyms. If web developers provide the optional "title" and "lang" attributes, they can specify what the abbreviation or acronym stands for, and the language, such as French or German.
There have also been some additions in HTML 4 that not only help accessibility for the vision impaired, but also for those who use text browsers. The "alt" attribute is now required for <IMG> tags, as well as the <AREA> tag used for Client Side Image Maps. The "title" attribute mentioned above can also be used with images, sound clips, and even horizontal rules, to provide short descriptions of these elements.
Tables have also been updated in HTML 4 for better accessibility, grouping of columns, and they can now be displayed incrementally. It appears, however, that the W3C would like Style Sheets to take over much of the layout
HTML 4 now officially incorporates some elements that have been around for a long time. Most notably are Frames. Netscape introduced the world to frames with its initial release of Navigator 2.0. For those who don't know, frames allow web developers to create sites with multiple views, or frames, within the Netscape window. For example, within the Netscape window, you could have a small frame at the top with a banner ad, a frame on the left with navigational links for the entire site, then a main frame with the content of that page.
Although this can make navigation of large Web Site easier, very often the implementation is done poorly, causing problems. The most common mistake done by Web designers is when they link to URLs outside of their web site. In the example I mentioned above, if you had a standard http link in the main frame to the OS/2 Supersite that looked something like this, <A HREF="http://www.os2ss.com">OS/2 Supersite</A>, when the viewer clicked on that link, the Supersite would load into that frame, but the banner at the top, and the navigation links on the left would still be present in the Navigator window. This could cause confusion since the Title Bar would still list your sites title, and the location box would still list your URL. This could be considered misrepresentation since it appears that the Supersite is part of your Web Site.
A simple way to prevent this is to add the "TARGET=_top" property into the link like so: <A HREF="http://www.os2ss.com" TARGET=_top">OS/2 Supersite</A>. This would ensure that the Supersite would load into the entire Netscape window. More developers are doing frames properly, but there are still too many Web Sites that have this problem.
Another important design option frequently left out of sites using frames, is the NOFRAME content. With the use of the <NOFRAME> tag, developers can provide the same information for browsers that do not support frames. Often, you will only find a brief messages stating that you are using an older browser and should upgrade. For personal Web sites this is tolerable, but for any commercial site, this is inexcusable.
I also like to provide for those whose browser can render frames, the ability to turn off those frames if they so desire. This way you won't alienate anyone from your Web Site.
Style Sheets give Web designers the ability to separate the presentation and layout of a Web Page from the actual HTML codes. Cascading Style Sheets (CSS) are the W3C's official recommendation for using Style Sheets. On May 12th, 1998, the W3C released its recommendation for Cascading Style Sheets level 2 (CSS2).
Cascading Style Sheets let you define the appearance of the elements on the Web page, as well as the position. You can define the style of elements, such as emphasis <EM>, for all occurrences on the Web Page by using Cascading Style Sheets to give them the same color and font type, for example Red and Times New Roman.
CSS styles can be applied to HTML elements in three ways. They can be specified within the HTML document at the location of the tag, or in the documents HEAD section, or in an external file that can be used with multiple HTML documents.
Example 1 shows how to define a style in the Documents HEAD section.
Example 1:
<HTML>
<HEAD>
<TITLE>Style Sheet Example</TITLE>
<STYLE type="text/css">
EM { color: red;
font-family: "Times New Roman", serif }
</STYLE>
</HEAD>
<BODY>
<H1>Example of Cascading Style Sheets</H1>
<P>
This example will show everything within the <EM>emphasis</EM> tag as red.
</BODY>
</HTML>
All occurrences of the emphasis tag will appear as blue and as Times New Roman in the HTML Document. It is always good to provide a Generic font family, such as the "serif" in the example. This will provide a fallback mechanism if the client is unable to display the named font.
To accomplish the same style using an external file, first create the external CSS file, named generic.css, as in Example 2a. Then link that file to the HTML document as shown in Example 2b.
Example 2a:
EM { color: red;
font-family: "Times New Roman", serif }
Example 2b:
<HTML>
<HEAD>
<TITLE>Style Sheet Example</TITLE>
<LINK rel="stylesheet" href="generic.css" type="text/css">
</HEAD>
<BODY>
<H1>Example of Cascading Style Sheets</H1>
<P>
This example will show everything within the <EM>emphasis</EM> tag as red.
</BODY>
</HTML>
If you wanted to override the style of a particular occurrence of an element within the HTML document, you could provide a definition at the location of the element, as in example 3.
Example 3:
... <P> This will override the <EM STYLE="color: orange; font-family: Courier">emphasis</EM> style defined in the Documents HEAD section. ...
You can also import an external style sheet into the STYLE definition in the HEAD section by using the @import rule in the <STYLE> tag. This lets you bring multiple external style sheets into the document, since you can only have one LINK defined for the HTML document. The @import rule must precede any other style definitions. Example 4 shows the @import rule.
Example 4:
...
<HEAD>
<STYLE type="text/css">
@import url("generis.css")
</STYLE>
</HEAD>
...
Cascading Style Sheets are a vast and powerful tool for Web Designers. What I have shown you barely scratches the surface of what can be accomplished with the latest recommendation from the W3C.
Of course, the most important thing on OS/2 users' minds when discussing the latest specifications for Web Design is, will we be able to take advantage of them?
As you know, the original browser for OS/2, Web Explorer, has been discontinued by IBM in favor of Netscape Navigator. However, the version of Navigator currently available for OS/2 is a hybrid 2.02 / 3.0 version, which does not support style sheets, or the latest HTML specifications.
The original release of Netscape Communicator 4.0 for other platforms had some support for Style Sheets, but not HTML 4.0. When IBM delivers Communicator for OS/2, it's possible that they will add support for HTML and Style Sheets beyond what is available in the current 4.04 version of Navigator.
When Netscape released the source code for Navigator version 5, termed Mozilla, in January of this year, that gave developers outside of IBM the opportunity to create a native version. Currently, the only active port is the Warpzilla project, which currently has the back end finished and work on the front end interface has begun. The layout for all Mozilla releases will be handled by the NGLayout engine which has been released under the same license agreement as Navigator version 5. This will eventually have support for HTML 4.0 and CSS2.
What may be the most promising solution for enjoying HTML 4.0 and Style Sheets on OS/2 is the Opera Software's Project Magic OS/2 port. According to Opera, the OS/2 version will have all the features of the Windows version. Currently, they have support for CSS2 in version 3.3, and are working on adding support for HTML 4.0.
HTML 4.0 and Cascading Style Sheets: http://www.w3c.org.
Warpzilla: http://people.netscape.com/law/warpzilla/.
NGLayout: http://www.mozilla.org/newlayout/
Opera Software's Project Magic: http://www.operasoftware.com/alt_os.html