XHTML 1.0 Strict is my new best friend. Designing pages using this doctype is the perfect new year’s resolution to ensure that my site is slim and trim.
So, we could get into the argument about whether HTML 4.01 Strict is better than XHTML 1.0 Transitional, but personally I think that argument is not worth having until you can tell me why you are not adopting the W3C standard of XHTML 1.0 Strict.
Here are the reasons I’m choosing XHTML 1.0 Strict:
- I want my web pages to be easily interpreted by any user agent whether it be a screenreader, a browser on a laptop or on a mobile phone. XHTML’s cleaner and more stringent syntax is a language based on all that we’ve learned over the past 10+ years of the web. It includes the power of XML to define date with the strength of HTML’s ability to display data. Any coder can quickly see the advantage of having all tags closed, properly nested and well formed.
- But XHTML 1.0 isn’t good enough for me without the Strict. What does Strict mean? Clean separation of content from presentation. This separation makes a web site modular and easier to maintain while drastically reducing page size.
I’m beginning to think of my XTHML 1.0 Strict New Year’s resolution as a diet for my web sites.
Only new trick I had to learn when moving from XHTML 1.0 Transitional to XHTML 1.0 Strict was how to get my forms to validate. I had made the “old-fashioned” mistake of wrapping a <div> around my <form>. I kept getting the following errors from the XHTML validator:
-
document type does not allow element “label” here; missing one of “p”, “h1″, “h2″, “h3″, “h4″, “h5″, “h6″, “div”, “pre”, “address”, “fieldset”, “ins”, “del” start-tag.
- document type does not allow element “input” here; missing one of “p”, “h1″, “h2″, “h3″, “h4″, “h5″, “h6″, “div”, “pre”, “address”, “fieldset”, “ins”, “del” start-tag.
Scratching head. Huh? What do you mean I can’t have a “label” and an “input” here? Did you know that in XHTML 1.0 Strict the <form> tag can only contain block level tags? This means that the <input> and <label> tags need to be wrapped in a block level tag within the <form> tag or you too will suffer the two errors listed above.
If you used to do this:
<div>
<form …>
<label…> … </label>
<input… />
…
</form>
</div>
To be XHTML 1.0 Strict you’ll need to do this:
<form …>
<div>
<label …> … </label>
<input … />
…
</div>
</form>
So, what is your new year’s resolution for your web site? Will your code be ready for bikini season?
