W3C Validation & Why You Should Use It

Whenever you're designing a website, one of your primary goals, besides communicating the mission of the organization for whom the website is being made, should be to make the website accessible to all visitors, no matter what kind of computer or browser they have, and no matter what kind of disabilities they have (whether it be blindness, deafness, or other problems).

Luckily for you, there's a free and easy-to-use tool on the web that lets you check how well your website conforms to coding standards:

W3C Markup Validation Service Banner

The W3C generously provides this service to further their mission of having an open, accessible and free web. The tool is dead simple to use: just type in your website's URL, and click Validate. Errors will then show up, and you can go back to your source code and fix the little mistakes you've made. But there's a lot more about Validation that needs to be said!

Importance of Validation

A lot of web developers think having a 100% valid website is the holy grail of web development. But I beg to differ, somewhat. In my view, a website should be as valid as possible, but the aesthetics and functionality of the website should come first. Take, for instance, this website (www.jeffgeerling.com). The home page (as of 1/17/09) had one error on it, due to the Twitter functionality in the sidebar:

Validation Output Error on Midwestern Mac's Website

This error only makes the website display improperly if a user doesn't have JavaScript enabled; and since only 1% of the website visitors (and of those, most are robots and web crawlers) don't have JavaScript enabled, I don't really care. Even if the visitor has JavaScript turned off, the only thing missing will be the Twitter updates. If they don't have JavaScript on, they probably don't really care about Twitter anyways!

A good web designer will know which validation errors he should pay attention to, and which ones can be ignored. Leaving off 'alt' tags on photos is a big no-no, because of accessibility and Search Engine Optimization. Leaving a trailing slash ( /> ) off of a tag here or there in an XHTML document is not quite as important, but this error should still be fixed. An error due to JavaScript being turned off is not typically worth fixing, unless your content's display depends on JavaScript being turned on (a practice which should be avoided!).

So, How Do I Stack Up?

In researching my own sites' validations, I compared my errors and warnings with a few of the most-visited websites in the United States, and, as of 1/17/09, here's what I found:

Apple Microsoft YouTube Google Yahoo Validation Error W3C Charts Comparison

What does this tell you? For one, the last four sites in this chart are heavy on scripting, so many of the errors are due to scripts that weren't run to fill in the rest of the page's code. However, there were a lot of little bugs in the code that should be quite easy to fix. For instance, on Microsoft.com, there's are many image tags that don't end with the closing tag />, even though they should (since the page is defined as 'XHTML 1.0 Transitional'). These are simple validation errors that don't usually cause problems, but can make it harder for some browsers to render things the same way as others.

<aside> (This also tells me that Microsoft doesn't seem to care so much about web coding standards... which is also evidenced by the fact that Internet Explorer has always been, and continues to be, one of the worst web browsers for standards-support and accessibility!). </aside>

Anyways... as a web developer with an eye for the future, I always work to keep my websites' coding up to standard. This way, as the Internet continues to evolve, my websites will be more adaptable to future coding conventions and changes. I would encourage you to at least run your website through the validator, to see what bugs do exist, even if you have no intention of fixing them. Then you should try browsing your website on as many websites as you possibly can, to see how these errors can sometimes negatively impact visitors' experiences.

If you don't have multiple computers on which to test, I would recommend you try using BrowserShots.org to get screen captures of your site's front page across a wide variety of test browsers and operating systems.

What do you think about validation? Is it the holy grail of website design, or should it play second fiddle to functionality and aesthetic appeal? Let me know in the comments!

Comments

Excellent post and most informative. You already know what a fan of IE I am. NOT!

@ Evann - lol <joking> it seems you are IE's biggest fan! </joking>

Internet Explorer 7 was two steps forward, but now IE 8 seems like a step backward (in my use of it so far). We'll see how things go when it's out of the beta stage!

Pretty interesting article indeed. It's calming me to look through someone's errors. So I did a little further research. I've made some list of errors for websites that were mentioned.
google - '>', '&'
yahoo, youtube - '"', '/', '>', '=', some symbols like 's' in 'css', and 't' in 'type', and numbers
As I can see it has similarities and periodicity, and could be fixed very quickly if the error was noticed in the beginning.
By the way even so I looked through it but I couldn't find microsoft's 206 errors.

Jim Hendrikson from Web Application Development