Recently I decided for some reason to run my site (also, like the O’Reilly blogs, based on Moveable Type) through the W3C Validator to check to see if I was generating valid XHTML. If you’ve ever done this, you shouldn’t be surprised to find out that my site was anything but compliant. Why is this important? Well, it’s probably not going to break most modern browsers as they are quite tolerant of non-compliant code, but it’s bad coding - if your code is valid then you should be displayed well by any compliant browser or parser in use. Non-compliant code can also do bad stuff to dual use content, such as if where you’re using the web entries to provide RSS feeds for your site.
Some of the things that I wasn’t doing correctly included:
- Terminating break and image tags:
- <br> - Incorrect
- <br /> - Correct
- Handling Movable Type’s default “Convert Line Breaks” behaviour that sticks tags in lists where they aren’t welcome
- Including “alt” elements in my IMG tags
- Making all of my tags lower case. In XHTML, HREF and href are different - lower case is correct
- Encoding all ampersands (&), including ones in URLs
And, my number one problem - multl layer lists:
<ul> <li>This is incorrect</li> <ul> <li>This should be indented</li> </ul> </ul>
Which should actually be written like this:
<ul> <li>This is correct <ul> <li>This will be indented</li> </ul> </li> </ul>
I enlisted a few tools in my quest to get valid and stay valid. Foremost was the W3C Validator service, which I have integrated into my publishing routine using Brandon Fuller’s excellent MT-W3CValidator plugin, and the handy XHTML reference material at W3Schools. I am proudly displaying my XHTML valid status on each page (as verified by the W3CValidator plugin), so feel free to visit my site and click the icons on the bottom right hand column to verify the validity of my XHTML, Atom, and RSS 2.0 feeds.