Home | All Questions | alt.html FAQ > Web Design

What is structured HTML markup versus presentational HTML?

"standards are a useful tool to ensure that web sites can be built and viewed widely." -- Eric Jarvis

In the context of HTML, "markup" refers basically to tagging the contents to show their structural nature, such as "this is a paragraph" or "that is a second-level heading" or even "this is a form which the user can submit".

None of this pre-supposes any particular presentational arrangement on a page or screen: the marked-up content could be just as meaningful to an indexing robot, or to a speaking machine used by a blind reader or telephone caller.

Visual browsers have some (boring, conservative) default assumptions about how to render the structural markup into a visual form, but the idea is that you'd make better suggestions via a stylesheet.

Beyond applying some kind of attributes to your markup (class="navbar" or whatever) the idea of Strict is that you keep out of your markup anything that's aimed at achieving a particular visual presentation, and delegate this to the stylesheet. Of course, there could be several stylesheets, aimed at different browsing sitations, any of which could be applied to the same markup depending on circumstances.

Using the strengths of the Web medium

The best artists have always known how to apply the techical merits of their chosen medium. Why should the WWW be any different? A well-made page can, and should be, both attractive and technically competent.

You don't make good art by fighting the medium. You have no choice but build sites that operate under a huge range of browsing situations. You can make it rigid so that stepping outside a limited range screws the whole thing up. Or you can make it liquid so that it bends rather than breaks - either way you can't get total control of what is seen.

Myth: Same look in different browsers

The end users want to access your content, using the browsers that they use. How many end users do you know who deliberately display your pages on several different browsers and award points for getting similar visual appearance? What they care about is that the page works in their choice of browsing situation - in which, rememeber, the choice of OS and browser version are only some of the factors. Then there's window size, screen dpi, colour depth etc. etc., and that's even assuming that they have a graphical display, which some of them haven't.

Those who want an online simulation of DTP would probably be better off with PDF. At least that aims to preserve the specified appearance, whereas the design aims of HTML lie elsewhere, while CSS is best regarded as a highly desirable suggestion which nevertheless can and must be disregarded when it's getting in the way for some reason (unsuitable display situation, user's special needs...).

The failing of WYSIWYG tools

What is important is to understand what a web page actually is. A WYSIWYG editor is purposely designed to separate you from the actual web page, and to present it as if it were DTP - that's the problem. It teaches you bad habits at a very fundamental level. It teaches you to make web sites that are fundamentally flawed from conception

The extra bloated markup introduced by WYSIWYG tools is a symptom of the problem, not the problem itself. The fundamental insoluble problem of WYSIWYG editors is that the web is NOT a purely visual medium so approaching design from a purely visual standpoint fails to make the most of the possibilities.

The whole aproach of the WYSIWYG editor is based around the idea that software can be used to automatically mark up a document on an entirely visual basis, but mark up isn't visual, its conceptual; and marking up a document in html is a series of conceptual decisions - exactly the sort of thing that a human being does well and computers can't handle

Recommended Resources

Discussion

Related Questions