Popular Websites and XHTML Validation Errors

By  on  

During my confession session a while back, I mentioned that I wasn't high and mighty when it came to XHTML validation. The customer doesn't care, the website's budget doesn't care, and the Mustache probably doesn't care. I caught some crap for saying this so I've decided to check some popular websites from various genres to see how closely they stick to validation rules with their XHTML. The following is what I found for each homepage.

Numbers represent combined warnings and errors.

Social Networking & Bookmarking Sites

Facebook: 129
MySpace: 192
Reddit: 0
Digg: 48
DZone: 52

News Organizations

CNN: 0
MSNBC: 0
Fox News: 35
Drudge Report: 123
TIME: 0

Javascript Framework Websites

MooTools: 3
Prototype: 1
jQuery: 1
Script.aculo.us: 12
Dojo: 16

Development Blogs

David Walsh: 11
CSS-Tricks: 1
Eric Wendelin: 1
Snook: 1
Smashing Magazine: 10

Search Engines

Google: 46
Yahoo: 308
Live: 30
Ask: 70

So what do these numbers mean? Nothing. Why? Regardless of the number of warnings, the websites work great and are as popular as ever. Functionality means much more than validation.

Recent Features

  • By
    Page Visibility API

    One event that's always been lacking within the document is a signal for when the user is looking at a given tab, or another tab. When does the user switch off our site to look at something else? When do they come back?

  • By
    CSS Filters

    CSS filter support recently landed within WebKit nightlies. CSS filters provide a method for modifying the rendering of a basic DOM element, image, or video. CSS filters allow for blurring, warping, and modifying the color intensity of elements. Let's have...

Incredible Demos

  • By
    jQuery Comment Preview

    I released a MooTools comment preview script yesterday and got numerous requests for a jQuery version. Ask and you shall receive! I'll use the exact same CSS and HTML as yesterday. The XHTML The CSS The jQuery JavaScript On the keypress and blur events, we validate and...

  • By
    Create Twitter-Style Dropdowns Using jQuery

    Twitter does some great stuff with JavaScript. What I really appreciate about what they do is that there aren't any epic JS functionalities -- they're all simple touches. One of those simple touches is the "Login" dropdown on their homepage. I've taken...

Discussion

  1. The situation is much worse, I assume that you only validated the home page of those sites. What about all of the other pages?
    I wrote a nice tool to validate a whole site (using the sitemap). The validation is done through the W3C validation SOAP service.
    Check it out (it is open source)- http://www.dev102.com/2008/05/20/validate-your-entire-web-site-with-this-free-open-source-wpf-xhtml-validation-tool/

  2. Hello!
    And what about your blog? Your blog not valid now =)

  3. Dimitry,

    I know that, it is written in the post…
    But that is not the point here, right?

  4. ShaharY, im sorry, but my coomet not to you, but to David =)

  5. *coomet == comment*

  6. Adrian

    Ethically speaking: just by saying that other, more successful businesses make mistakes, doesn’t make them right. The websites you use as examples, are great not because of their mistakes, but despite them. I am a web developer and I can tell you this: it’s all about being professional. And being professional means doing things the right way. It’s the satisfaction and the peace of mind of doing things as close to perfection as possible. What you do, is basically cheating on your clients, because they don’t know about W3C standards. There’s no middle way to do your profession – it’s either right or wrong.

    Professionally speaking, I wouldn’t hire you if you would tell me that some UI you made is not valid.

    Pragmatically speaking: during the last years, all the decision makers have turned their attention to standards – even Micro$oft. That is, first there was chaos but experience showed that people need standards. By using standards you can be sure that your code will be supported in future releases of the browsers. What if parsers (browsers) will not account for rendering off standard scenarios? Because standards means strict XML rules (XHTML is XML). And the schema defines both the tags and their relations. What then?

    Oh, and one more thing: the tab order of your comment form is wrong. So you see – it’s about getting used to doing things right and paying attention to all the details.

  7. @Adrian: “What you do, is basically cheating on your clients, because they don’t know about W3C standards.” They don’t know about standards but the truth is that they don’t give a damn. I’d rather give them more features than spend their budget making sure every “t” is crossed.

    That said, we all do our best to follow standards but at the end of the day, not self-closing a “br” tag isn’t a huge deal. Money? That is a big deal.

  8. @David, @Adrian, let’s say that “truth” is somewhere in the middle. It would be nice to follow the standars all the time, but it is not always possible. And, I agree on that, not always necessary.

    But on the other hand, since clients often don’t know what standars are, it would be nice to get them informed about it and let them decide what they really want. It’s their money, after all, isn’t it?

  9. I never get the people that lash out about other peoples sites not being valid. I think validation is mainly a tool for the front-end guy to use while developing the site. You soon realize that most of the time that you spend to get your templates perfectly valid it will only be torn apart when the engineers get to it or the clients start using whatever WYSIWYG editor for the CMS. the whole Nazi Validation camp is getting played out and this is someone who will always make sure my sites are valid before handing off.

  10. @Janko: In a perfect world, it would be great to explain standards to them. The problem is that my customer will ask “how will standards increase my sales?” I say “it wont.” They say “so why should I care?”

    @Dan: Agreed 100%. If I create a CMS for a customer that features a WYSIWYG editor, validation surrenders.

  11. @Dimitry: You’re right. As I mentioned in my article, my site has validation errors. The navigation even looks different in IE7. At the moment, writing articles is more important to me than Mickey Mouse validation warnings.

  12. It’s hard to imagine how I might deliver features that rely on javascript if I had the same ID on multiple elements… for example, a form with an autocompletion feature on an input element: input#search. Clean separation between features and standards is an illusion. All features rely on standards. Or is the web just a collection of Flash players, Internet Explorers, and RealPlayer streams?

    Nazis? really…

    Validation is a tool. We use our judgment to decide which errors are significant and which ones are not. But cheese and crackers man, if you’re going to put a XHTML doctype, at least close all your tags.

  13. It is true that many companies are ignoring web standards. In fact, I recently performed a survey of the Fortune 500 home pages and 46% of them render in quirks mode! ( http://www.aggiorno.com/blog/post/Benchmarking-DOCTYPE-validation-in-Fortune-500s-Web-sites.aspx ) Nice charts and statistics included…
    I also agree that validation for validation sake is certainly not a business goal. But validation, and web standards in general, are a first step towards many important business priorities.
    For example, did you know that the google bot can get confused when indexing a page that does not conform to standards? This gets immediately reflected on $$$ for your customer if a page is not indexed appropriately.
    Additionally, one of the most commons validation errors is the lack of alternate description for an image. Did you know that this standard is at the heart of web accessibility? And that web accessibility is “the law”?
    On a more basic scenario, if a page is standards compliant its rendering time is less because the browser does not have to “guess” your intentions it justs follows the rules of the page source code.
    In general clean (standards compliant) code has many properties that are more than desirable (we can go on and on on this topic) and should be taken into account when programming web sites.
    Now, I agree that complying with standards should not be a super time consuming activity as it is today. And here is where tools like (advertising ahead…) Aggiorno http://www.aggiorno.com come into play. Standards compliance should really be just a matter of a few clicks and a few minutes of your time…

  14. Federico (accessibility) and Adrian (comment for tabbing) have great points. Validation is not an end all, be all for a site to be considered good.

    But if I were a blind web user and I tried to comment here, I’d be screwed now wouldn’t I? Because tabbing through the fields skips the message box. I don’t even know if validation would catch that, but it is a tool for evaluating your work, and all work should be evaluated and fixed if possible.

    Secondly, You have no idea where, when, and on what device someone will be experiencing your site. If my broken code prevents someone on a mobile device from properly viewing my content, I’m going to lose those eyeballs. I can take steps to prevent that by providing valid, semantic source code.

    I’ll usually take a site as the sum of its parts. If the source HTML seems well thought out and semantic, then it seems reasonable that it should validate. Often in the case of CMSs or client-entered code, keeping a site valid is nearly impossible. But if you never really checked or considered it worth your time in the beginning, your not providing a client with full value for their money. They may not care, but that doesn’t mean you shouldn’t.

  15. http://mezzoblue.com/css/cribsheet/

    “When in doubt, validate.
    When debugging, you may save yourself a lot of headache by simply validating your code first. Improperly-formed XHTML/CSS will cause many a layout glitch.”

    That’s the reason to validate your markup and styling. It saves time – lots of time. Whenever something renders really different, validate.

    Google for example isn’t really representative. They are fully aware that it isn’t valid and they won’t change that soon. The reason for that is that they need to be compatible with pretty much *every* browser out there. And they also have the resources to make that happen.

    A more usual website is entirely different. The resources are very limited and only a few browsers need attention. E.g. the latest Firefox, the latest Opera, maybe the latest Konqueror, the current version of IE and the previous one. And if you’re unlucky even the IE version before that. But that’s it.

    If it works fine on these browsers it’s good enough. All other browsers aren’t popular enough to make a difference, because 1% of your visitors aren’t enough visitors to be worth it.

    But even if it’s worth it (i.e. if you get *insane* amounts of traffic), you’ll start with a valid version there.

    Ignoring validation because there are so many invalid sites out there would be foolish.

  16. Adrian Salceanu

    @ David – first of all, please don’t take my words personally. I didn’t wanna imply that you personally are, in a way, cheating – but only that skipping parts of what could make the job as good as possible, just because the client doesn’t know about it, could qualify as such. I tend to get very passionate about what I’m saying / doing and sometimes I can be a bit harsh.

    Think about this: it would be the same as if a plumber would do bad plumbing just because the pipe is behind the wall – if the wall looks good and the water flows when he takes the money and runs out of the house then I guess all is fine. Well, it’s not if soon everything blows.

    But i can tell you this – I’ve also read your “confessions” – if I remember correctly, you said that you’re 24 and not sure about doing this job in the future. Well, I’m 29, I’m doing web development for 8 years and I know it’s The Thing for me. And maybe there will come a time for you, like it is now for me, when you will feel that you’re in stage of consolidation. You’ve learned enough and now it’s time to stand up – when you will want your work and your name to really mean something. And in that moment, you’ll realize that you only wanna go to the top – top work, top clients, top money. Because you will know it’s in your power and you won’t settle for less.

    And when you’ll be good enough to get to those clients, you’ll see that they will gladly pay more to get the real deal. Even more, you will refuse the clients that force you to compromise your work because you will know that through compromise, you’ll never entry the top league. And then, words like standards, accessibility, semantics, usability, performance will mean a lot.

    Same as the plumber – doing good work will improve your image and get you to those skyscraper jobs, doing pipes for the rich and famous. And the reverse is true for not-so-good-work: it will disqualify you in time.

  17. @Rob, Jos, and Adrian: I agree with you in that standards are important. If you’ve ever read my blog before, you’ll know I do a ton with MooTools so validation is something I take seriously.

    That said, I create CMS’ for my customers which do not always generate valid code. Do I have nightmares about that? No.

    I think people are getting the wrong impression. I do everything I can to follow standards for my customers’ websites. This blog doesn’t validate but I’m not willing to hack my WordPress (again) to make it 100%. I’d rather focus on articles.

    As far as the commenting/tabs, that’s clearly an oversight on my part.

  18. Hugo

    I agree with David on paying more attention on making a site function versus wasting time trying to make something valid. However, I always strive in the end, time permitting, to make a site valid. I use FCKeditor and that puppy has some serious issues. It’s not as bad as TinyMCE though. I’ve modified the FCKeditor code so that it spits out code that is valid. I don’t know much about Javascript so for those elements or tags that won’t validate via FCK I use PHP (regex) to pick up the slack and format/modify the submitted code so everything becomes valid. More work? Yes. But I do it for my clients and because I am thinking down the road: “It wouldn’t hurt to give a client a site that will hopefully hold up rather well for at least three years because of the compliance.” David, keep up the great work! For those that can validate…do it! For those that don’t care or don’t understand the point I hope your future with Micro$oft is a long and fruitful one. :P

  19. Nice information, I really appreciate the way you presented.Thanks for sharing..

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!