As a web designer you’re encouraged to write valid code, but is it really important?
I’ve took a look at the reasons behind validation and checked out 25 of the web’s most popular websites to see if they bother validating their code.
What is validation?
Validation is a process of checking your documents against a formal Standard, such as those published by the World Wide Web Consortium (W3C) for HTML and XML-derived Web document types, or by the WapForum for WML, etc. It serves a similar purpose to spell checking...W3C
Why validate, what are the benefits?
1. Non uniform browser correction
Non valid pages rely on the browser to auto-correct your code, and each browser does this differently. So if you forget to close a tag, Firefox might ignore this but Safari doesn’t and you end up with a broken layout.
2. Rendering time
If your code is valid the browser has to do less thinking as it doesn’t have to correct any code, therefore the page will render faster.
3. Future proofing
You never know what’s around the corner in regards to technology but the chances are that if you have valid (X)HTML, you’re ensuring that your website will work with future technologies.
4. Google prefers valid code
Shaun Anderson conducted an interesting validation test; Does Google like valid code?.
This experiment included 4 pages with the same content but a mixture of valid and non-valid HTML and CSS. The result was that Google picked up the page that had valid HTML and valid CSS and indexed this page over the rest.
A valid site is more likely to be accessible to all types of browsers, platforms and screen readers.
6. Self satisfaction
If feels good when you run a validation check on your site and you see the green bar appear :)
What are the common validation errors and how to fix them?
This always catches me out. Ampersands must be written ‘&’ and not just ‘&’. This is true for writing urls too.
Element property values must be put within quotes.
c. Closing tags
All elements must be closed off, even image tags if you’re using a XHTML DTD.
<img src="image.jpg" alt="Image" />
Your page must have a valid Document Type Definition (DTD) at the top of the page, and take note that it is case sensitive.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
e. Nesting elements incorrectly
Elements must be opened and closed in order.
Do the web's biggest sites validate?
So do all the big and popular websites out there validate? Below I’ve put together a selection of some of the most popular websites and ordered them from best(valid) to worst.
What about the design community?
Looking at some of the biggest sites (and authors) in the design and technology community.
I think it’s worthwhile validating your websites and it’s good practice. From looking at the sites above however (which are all great sites and designs), it’s obvious that not having a validated website is not the end of the world.
If you’re like me though you’ll sleep better at night knowing your website validates.
Does your site validate?
It was very hard work trying to track down valid websites for this post so it would be great to see some examples. Use the W3C Validator to check your site then submit your link and comments below.
It would also be good to hear your points about validation and if you think it’s worthwhile.
Receive more design content like this to your inbox
I promise not to spam you. No more than one email per week.