WebHelperMagazine.com

Subscribe to the Blog (via RSS)

by Scott Frangos, Managing Editor – WebHelperMagazine.com

Microsoft and PayPal are loose about it. Yahoo is strict. Amazon doesn’t do it at all. What am I talking about (if you were in my college class.. you’d better know)?


I’m talking about how these sites use and conform to web standards (namely, the latest doc type declarations — DTD — as specified by the W3C.org). Hope you got that. I admit that declaring your document type is confusing in this transition time from HTML to XHTML to XML. Let’s try and make some sense of coding for web standards here.

“… XHTML adds the ability to define types of information on your web pages — not just the structure of that information. The benefit? Now, your webpages can behave as a sort of database which may be manipulated…”

Above are the DTD’s (you put them at the top of your web page documents) that come up when viewing the source for Microsoft and Yahoo’s home pages. Note that what is actually happening is that your browser is instructed to read the corresponding document over at the W3C.org… and BUILD the page structure accordingly.

First… what are Web Standards, and Why are they Important?

You really better not have been in my class if you are asking this question. But still, it is a good question. Why do we have HTML (note the DTD for Yahoo — strict HTML, not XHTML), XHTML, and XML? Which document type declaration (DTD) should be used and why (DTDs, when used, they are always inserted at the top of your web page documents)? We’ll dig into the answers to those questions as we chew on the concepts, and finally arrive at a preferred Doc Type Declaration below.

Have a look at our XHTML Comparison Chart

For practical purposes in web development, new and updated standards represent evolution, or if you will “upgrades” to the underlying building code of the web. In most cases, the W3C.org does a great job of leading development of coding standards with great new features and advantages for the web development community. The “X” in XHTML, for example stands for eXtensible — meaning new features can be added to the coding language, unlike straight HTML. XML — the coding standard that XHTML is moving us toward — adds the ability to define types of information on your web pages — not just the structure of that information. The benefit? Now, your webpages can behave as a sort of database which may be manipulated by developers in ways beyond — way beyond — HTML. One good current example of this is RSS. Future examples: MathML, GraphML, Scalable Vector Graphics, MusicXML (no time to detail them here… but you better look them up). Another benefit? New types of devices (mobile phones, etc.) will depend on XHTML/XML to add a host of features and power. You have to ride this wave.

Evolving standards are a good thing. These standards give you power. Standards help solidify evolution on the net. Got that? Now let’s look at two more concepts: the modular nature of a DTD, and why anyone would want to be “strict” about it.

DT Phone Home…

What function does your Document Type Declaration perform? Well, if you use it to refer to the W3C.org’s source Declaration file, then it defines the data types in your document. It references an external document (usually at W3C.org — but it could be anywhere), just like you can reference an external style sheet, or javascript. This means that the W3C can change the source document (adding new extensions, etc.), and your website — if it references that document in its DTD — will automatically be ready to take advantage of the new features. This is what we mean by “modular” programming — the document at the W3C is a separate module that contributes key processing elements to your webpage. Is that good? As long as the W3C makes solid and valuable evolutionary steps it is.

Can you instead reference your own DTD that you write yourself? Yes, Lone Ranger, you can do that. But why? (I can just see the comments, now — should be interesting.) If you use a W3C DTD, you will be able to use their Markup Validator to help you find and correct errors (read the W3C Validation FAQ — it is well written and will help you understand validation better). This makes it almost a no-brainer.

Strictly Speaking… Separate Style from Content.

The above headline says it all, that is, when you use a strict declaration, you will then have the advantage of separating Style from Content. Who cares? Well, for one — you. You might like the clean nature of your document. You might like the “modular” advantage of only making stylistic changes in one place. And, you could enjoy the best of XML database opportunities for your content. Remember, the web IS a content management system. If you don’t believe me — consider the source (source code and its evolution, that is).

Calling your Doc…

So which DTD should you use? Remember that Microsoft coded for a “loose” standard. Hey… those guys love playing fast and loose with standards — unless they force you to use their own. Yahoo, on the other hand, uses a strict definition. Advantage: Yahoo. Why? Well, their strict DTD means that they have already separated style coding from their pages into a separate CSS document leaving their content set up for access, cleanly, as database information. In a few years, Yahoo will not have to do any updating to take full advantage of XML. Microsoft will. Microsoft may have problems with how its pages render in future versions of the Mozilla browsers, like Firefox. Yahoo won’t. Microsoft still thinks it owns the browser market (and thus can set its own standards).

Why is this evil clown smiling? MicroCroft likes it when standards and Explorer don’t dance.

Yahoo doesn’t. Amazon, oddly enough, does not show a DTD at all when I looked at their home page source today — go figure. I’m really not sure what those guys are doing.

If this sounds like a case for the strict DTD — it is. What’s the case for the loose DTD (also called “transitional”)? According to the W3C, this loose DTD “allows some older elements and attributes that have been deprecated.” What does deprecated mean (that will be on the Quiz)? Well, generally, I tell students that it means “being phased out,” or “earmarked for removal.” But you know, sometimes it can be fun to go to Dictionary.com for the literal meanings of words. I did that. As usual, there was more than one meaning, beginning with “to express earnest disapproval of.” My favorite, however, was “to pray for deliverance from.” Ok. Why do I like that one? Who is it that ignores standards set by the W3C? Who is it that screams about Open Source values (I wonder why)? Who’s browser causes the biggest headaches for web designers? Who is it that tried to patent Style Sheets (yes they really did)? One Guess. Microsoft — you got it. Pray for deliverance, indeed.

Use this DTD for new documents:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Note: Keep your eye on the official DTD list page at W3C.org.

Let’s recap:

• XML is the future of the web… and handheld devices will depend on it. You could argue (and many do) that we’ll stay with the transition language, XHTML — that may be true. What is certain is that HTML is a dying language.
• XML gives a web developer much more features and power — watch for SVG, MathML, GraphML, and MusicXML applications
• XHTML is a stepping stone between HTML and XML, and so similar to XML that it is really the “best of both worlds” solution
• A “transitional” declaration allows for some styling within the document
• A “strict” declaration forces you to use external Styles for formatting, so that content is able to be manipulated in new ways — and, get this… that’s the future of the web!