DC's Page :web design/ALTernatively/sidebar

“Killer” web sites?

Whether or not David Siegel actually did create the “single-pixel GIF” hack or not — and there have been a few postings to Usenet by pissed-off people who were using single-pixel transparent GIFs, or something very similar (e.g. a transparent 10-pixel GIF), before Siegel came along — he is indelibly associated with it and a very particular approach to web design.

It’s possible Web newbies haven’t heard of Siegel, which is hardly surprising since he seems to have given up on web design — more about that later. His background is in design for printed media, and when he started designing web sites he brought all the attitudes and expectations of design for printed media to the Web. Siegel has been one of the most vocal proponents of the presentational school of web design.

In his defence it does have to be said that he first put forward his ideas of web design when all that was available was HTML. CSS was only pie in the sky (to those who had even heard of it). However, the approach he advocated of producing rigid, print-mimicking designs has led to scores of terrible sites, with major usability problems and code laden with <font> tags, lacking any logical structure.

Look at his CKWS site and everywhere you are struck by his longing for absolute control over what the user “sees” — witness his advocacy of the use of PDF files on the Web (dear gods, NO!) and his recommendations to use ‘procedural’ (i.e. presentational) rather than structural markup:

Currently, HTML is a very poor graphic design language. What works in one browser often won’t in another. Until the situation improves (and it will), designers must learn to anticipate and work around browser variations.

Well, HTML is a very poor graphic design language. As it isn’t any sort of graphic design language at all, that’s hardly surprising. Attempting to use it as one results in pages which work in some, but not all, graphical browsers — but which would certainly cause problems for some users.

Specifically he recommends not using header tags (<h1> etc.) but instead using <font> and <b> to get the desired effect; not separating paragraphs structurally but using <br> and spacer GIFs to get the desired effect.

(Just think for a moment what not using the header elements will mean to a blind user. The text which is supposed to be a heading will simply form part of an unbroken stream of words.)

Now, it is fair to point out that a lot of the stuff I have quoted is not exactly new. That’s obvious from many of the comments on his sites, such as this one:

It is impossible to design visually for all browsers, but if you accommodate Netscape Navigator 2.0 and Microsoft Internet Explorer 2.0, for MacOS and Windows, you'll look good to better than 90% of the Web…

…As soon as CSS becomes available to a wide audience — perhaps by the end of 1997 when Internet Explorer 4.0 for MacOS is released — we will recommend adopting it and structural tags in favor of [sic] procedural markup.

It is also fair to point out that some of his more recent pages work slightly better in text-only browsers than the above example. They still don’t have ALT text for all their images, though.

But: 1997 is five years ago and these pages are still there, recommending the use of HTML to lay out a page rather than mark up the structure. His book, Creating Killer Web Sites (2nd. edition, 1997) is still on sale for about £45, pushing this approach to web authoring. Given that CSS is manifestly here, if not yet perfectly implemented (but the quality of the implementation is improving all the time), it’s a pity he hasn’t put at least one page on his CKWS site saying, “This is all out of date, start using structural markup.”

Maybe you are thinking he’s sold a lot of books, he must know something — who am I to have a go at him?

Well, he does know something. Quite a lot, in fact, about designing for printed documents. Who am I? First and foremost, I’m a Web user — and his approach to Web design, his insistance that it should be no different from design for print, has serious problems for users.

Structure versus Presentation

If you haven’t read anything else about web design and haven’t looked at anything else in this site, maybe the whole structure/presentation argument is new to you. The core of the structuralist argument is the simple fact that graphical browsers aren’t the only way to surf the Web. The W3C rarely talks about browsers, preferring the term ‘user agent’ for just that reason. (Siegel has talked about the User Agent (also known as a browser), but he’s wrong: the terms are not synonymous.)

What user agents are there which aren’t browsers? One example would be screen readers which take a web page and read it aloud. There are also Braille user agents. Most people don’t have access to these, but you can get a good idea how well web pages will function in various non-graphical user agents by looking at them in the text-only browser Lynx.

The whole point to using structural markup is that documents will work — that is, be usable — in as many different situations as possible without writing markup specifically to allow for all the possible user environments (which is not in any case a realistic proposition). Structural markup identifies different parts of a document according to its part in the logical structure: so a page’s main heading will be <h1>, with subheadings indicated by <h2> or <h3> as appropriate. Paragraphs start with <p> and end with </p>. Quoted material is marked up using <q> or <blockquote>. And so on.

This is somewhat idealised at the moment, because not even the most standards-compliant browsers are absolutely 100% compliant — and there are still plenty of users with browsers much less compliant than those. Still, the ideal would see no presentational code in the markup — that would all be handled by CSS, including stuff like the height and width of an image.

The power of this approach is that the presentation is separated from the content, and a different set of presentational rules can be applied for different contexts using style sheets for the computer screen, the printed page, the screen reader, and so on — not forgetting that the user can define a style sheet, too. Thus the page which looks good on a graphical browser would also work perfectly adequately on other user agents without any re-jigging of the HTML.

The problem with Siegel’s approach is that the presentation is heavily tied to the HTML. There is no logical structure: he’s happy with making text look big and bold in IE/NS, he doesn’t care that this means that users of Lynx, etc., get a page with no headings at all. He wants to get have one paragraph follow the next without an extra line between them, and with an indent on the second paragraph, so he doesn’t use the paragraph element properly, he breaks one “paragraph” using <br> and uses a single-pixel GIF to get the indent. In his browser, that gives a result that looks the same as it would had he used CSS, which can now produce this type of layout in modern browsers, but look at what happens to this page in a text browser:

[Image: screenshot of dsiegel.com in Lynx showing a solid block of text with [INLINE] dotted frequently through it.]

Yep, if he put ALT="" in his <img> tags, all those [INLINE] markers where <img> occurs wouldn’t show up. But he doesn’t care about how it looks in a text browser or how it sounds to a screen reader:

Some people say I’ve ruined the Web, and to them it’s true. Web pages can’t be seen as easily by search engines and those with low-end machines have a hard time getting much out of my site. On my personal site, I don’t even put ALT tags [sic] just to send a message to those surfing without images. My life is visual. I love museums. How would you like to visit the Louvre with images turned off?

OK, some of his web sites look quite attractive — but they’re hardly the Net equivalent of the Louvre. So he doesn’t put the ALT attribute in his <img> tags because he wands to send a message? What message is [INLINE] sending other than “I’m an arrogant arse who doesn’t give a toss if you can’t get what’s here — it’s your fault you can’t see the images!” (I don’t think that’s the message he intended to send, but it’s the one I received…)

A while ago, either on a mailing list or Usenet, I can’t remember which, a guy in India was asking where he could get a text-only browser because his Internet connection was so slow it would take him at best ten minutes to download one small image. There was nothing he could do to improve his connection, but a text browser would at least let him access the Web without waiting forever for each page to load.

Except, that is, for the people who build sites according Mr. Siegel’s rules — but, hey, that was Mr. Patel’s problem for wanting to visit the Louvre with images turned off, wasn’t it?

Self-important bullshit like “My life is visual” isn’t any sort of excuse. The visual element is important to me, too; I think in very visual terms, I like museums, the cinema, paintings, photography — but that doesn’t give me any right to make web sites which aren’t accessible to as many people as possible. Using the ALT attribute does a lot to make sites more accessible — it would certainly help CKWS. Provided, of course, it was used sensibly. It’s all very well having a GIF of a fish as the link to the next page, but users who can’t see the image get:

Buy Creating Killer Web Sites from Amazon.com
Follow the Fish!
Core | Top | Feedback
[INLINE]

Surreal, isn’t it? (The first time I saw this, I wanted to yell, “No! the gourd shows us the way!”) If I hadn’t ever seen his site with graphics in place I would have had no idea what that bizarre statement meant.

“Purists”

If you read the article that quote about Siegel’s Louvre-sur-Web comes from, you find the first part of it is a rant against “the purists” — a group who don’t actually exist, at least not in the unbalanced, fascist way Siegel paints them.

Let’s take another example. A few sentences earlier, I wrote “they would not be part of the document” in italics. Remember that? Did I mean italics? Or did I really mean emphasis! … Oh, yeah, that’s what I meant, but I’m used to hitting the <I> key, not the <EM> key. Wow. Are they that extreme, those HTML extremists er, I mean, purists? Yes, they are that extreme. They can’t believe everyone is using <I> for italics when they really mean <EM>, for emphasis.

This is, of course, a caricature: the point the W3C and others have made is that the use of structural tags (<em> and <strong>) to indicate different degrees of emphasis is preferable to using presentational tags (<i> and <b>) because <em>, for example, has meaning to, say, a speech reader that <i> doesn’t (how should italics sound?).

Of course, he is assuming that <i> is being used for emphasis, but italics have other uses which do not involve emphasis at all. For example, the correct way to present the taxonomic name of a species in print is in italics (it’s underlined if writing longhand): Mycobacterium tuberculosis, Homo sapiens, and so on; nor is that the only circumstance in which words are italicised without emphasis being applied to them. At the moment <i> is still a part of the XHTML spec, but I suppose it is possible we shall at some point have to use a class style definition or a new element (<taxon>, perhaps?) to handle such uses. It wouldn’t be much of a hardship. (There are certain elements already which are commonly rendered as italic text, but not emphasised text: cite, for example.)

Anyway, that’s beside the point. If you read Siegel’s little rant you would imagine that he was on the side of design and beauty and the “HTML purists” wanted ugly grey pages of text and nothing else.

Crap.

The real-life “HTML purists” say basically one thing: HTML is for describing a page’s structure, it’s up to the user agent to present it as best it can. There is plenty of scope there for attractive pages using graphics as much as bandwidth allows.

They would even, I think, accept that certain sites are not going to be completely accessible to people who can’t see graphics — I’m talking about the real Net equivalents (to an extent) of the Louvre, where the only point is to look at pictures. Some ALT text will still be helpful, but people who can’t see the images are not going to get as much from the site as those who can.

The whole approach of Siegel when he was designing sites was to try to deny the fact that the Web is not a static medium, it is not a medium where the designer has total control over what the user sees. But that’s exactly what Siegel wants, to be able to force readers to see pages my way, not the way they thought they wanted to see them. This is always a losing game on the Web — as he seems to have learned.

Siegel doesn’t really do web design any more, having learned that a lot of the sites he approved of were not liked by users:

But Siegel accepted one final reason why the beautiful sites he pointed to in 1995 and 1996 never gained ground. Consumers didn’t like them. Take Discovery Channel Online, which once boasted one of the Web’s most elegant opening pages. By 1998, the site had returned to a more conventional and less exciting scrollable table of contents. Most lovers of Web design deplored the change. But as Siegel noted, Discovery carefully tested all elements of its site with its users — and the less beautiful site tested much better.

I’m not convinced that his disillusionment with the state of Web design does amount to him “joining the Nielsen camp” as that article suggests. It sounds more that he couldn’t accept that usability matters more to users than the conceits of designers.

©2001 DC.

S I D E B A R