Three Parameters of HTML Style

Many decisions about how to treat details of markup can be grouped as decisions about how to deal with three questions:

1. How much do you want to control--or try to control--the layout and look of your page on the viewer's machine?
2. How evident do you want the structure of the page to be?
3. What and how much magic do you want to use?

1. Control

It is often said that you can influence what the viewer sees but not absolutely control it. For example, it is difficult to put fonts on her machine that are not installed there, and downloading your fonts can be blocked by the viewer. Similarly, the size of the font and the browser window cannot be controlled. (We still see pages asking the viewer to set a certain screen resolution and browser window width.) Fixing a font size is especially difficult across different platforms: Unix (XWindow) fonts are smaller than MS Windows (and not just because of different default displays). Various platform-sensing scripts are available to help adjust the look of the page to the machine and its probable resources, but a counter-philosophy has emerged, which assumes that viewers have set all those things at comfortable values on their machines and they know best how they want to browse. This school favors using relative proportions and dimensions--percentages and "ems"--to adjust to what the viewer has set, and it says "if you want to really nail down the page layout, fonts, etc., use Acrobat .pdf files."

2. Overt/covert structure

Some (e.g. Jakob Nielson) say that your markup should not only be explicit and consistent, but standard as well. Hypertext anchor links should be underlined, preferably blue. We could continue: frames should have borders and look like windows, tables should have borders, images should have borders that are blue if the image anchors a hypertext link. That way everybody knows what they are looking at. And similarly, each site should have a consistent, explicit navigational system. This is prime "User Interface Engineering/Design" doctrine and is appropriate for certain purposes, even if the proponents favor strong, sweeping statements approaching bullying.

Most of these things, however, are design clunkers--that is, they make all pages look the same (and the underline makes them look cluttered), and they hark back to a time when HTML was strange and new and browsers had no "history" apparatus or back button. Nowadays many HTML editors assign a default value of "border=0" to images and other elements and hypertext links are variously indicated, ranging from "text-decoration:none" and/or small link-icon triggers like , which is used to indicate when a link takes you off-site or off-document. Sometimes the minimal indication of the cursor's change to pointing finger is the only visual clue. That behavior too can be altered under CSS2 and it is possible to send the status window a message which will block out the normal indication of the URL of a link. As here, for example. On the other hand, that same message could give some further information about the link, as can the "title" attribute that newer browser support in A anchors which pop up little "tool tip" boxes if hovered over.

3. Magic

Magic is behavior of the page on the screen that is unlike that of a printed page. Behavior here means "changes"—printed pages don't change as you read them. Javascript has offered more and more of these changes, usually triggered by mouse movements and events (though loading/unloading of pages can do things too--like open and close windows). If you want scripted events, you have on the one hand the very simple http-refresh timed reloading of the window with another page and on the other hand, you have Macromedia Director and Flash, which are arguably not HTML at all. With Javascript we can change the style attributes of elements, making things appear and disappear, change color, and font, and even location on the page. We can swap images with the famous rollovers and can even paint the page by making images visible that were hidden (Isabelle Hayeux.) We can even cause the page to scroll. There really isn't much point in learning HTML if you don't want to do a little magic, but if magic is the main thing on the page, it will just get a muttered "kewl." Not to belabor the obvious, but illusion and magic generally depend on covert structure.

The magic of hypertext triggered changes in HTML is almost always of the Shazam! variety--abrupt and as fast as the browser can deliver, rather than the slow tranforming of a page or image, although such effects are possible with DHTML Javascript. We associate slow changes on the Web with struggling, over-burdened technology. It is possible to do various wipes with Javascript, and you can do fades-in and out in MSIE (only); otherwise, you have to use a Java applet or (shudder) Flash.