Is Your Website W3C Validated? If not, Why?
Brilliant Design: Provide An Amazing ExperienceI’m proud today to announce to the world that Site Sketch 101 has been validated by the World Wide Web Consortium as valid XHTML 1.0 Strict.
When I first stopped by W3C’s validator, I was faced with over 180 major errors on home page. Yet after about 3 hours of carefully digging through the suggestions that it provided, I was able to receive the hearty approval of W3C.
I actually started out to earn the gold star for XHTML 1.0 Transitional which I’ve learned is a bit easier to obtain than the XHTML 1.0 Strict. After accomplishing that first task, I then stepped it up and went after the Strict validation and the CSS validation. I’m proud to say that I now what both.
I’m sure that some of you are sitting back and wondering what I’m talking about. I know that if I would have read the beginning of this article about 2 years ago, I wouldn’t have a clue what I was reading. Stick with me. Let me teach you what you need to know to get going.
What is W3C Validation?
The World Wide Web Consortium (W3C) is an international organization that develops the standards on which web pages are built. It develops rules for coding and development that the online community agrees to use in order to create a consistent online experience across browsers and across operating systems.
In other words, they are the organization that brings Internet Explorer, Mozilla Firefox, and Safari web browsers into agreement to deliver the same browsing experience to people on each browser.
If a website is coded according to the standards setup by W3C then it should appear the same in all browsers. If you’re a website designer then you’ve probably experienced the headache that is trying to get a web page to appear the same across multiple internet browsers. Validating your site’s code according to the W3C standards is the first step to simplifying that sometimes daunting task.
Most of the variations in display that we see across browsers are simply the result of various browsers attempting to make their best guess at how to display broken or invalid code. If your source code has unclosed tags or elements that aren’t universally accepted then they can display it however they want to. If the code is valid, however, then it should appear the same in all browsers.
Why is W3C Validation Important?
There are, in fact, several reasons that you should take the time to validate your website to the standards of the World Wide Web Consortium.
- Validation creates consistency across multiple internet browsers.
- Validation supports better search engine listings.
- Validation is a sign of professionalism.
There’s really no wrong reason to get your site’s code to be W3C validated.
How do I Get Started With W3C Validation?
If you know anything about the basics of html then getting started won’t be difficult. Simply click through to the W3C Validator, type in the name of your website, and then follow the instructions that it provides you for resolving each issue.
If you have questions simply drop them in the comments section below or you can do like I did and ask your followers on Twitter. I was very pleasantly surprised at how helpful some of my friends were.
I believe that one of the three fundamental principles for building a successful blog is to develop a brilliant design. I understand that as bloggers many of you know very little about coding html, xhtml and css so I’ve decided that I’m going to work to provide you with one article each week where I’ll work to educate you on the basics of code.
Learning how to edit or write this code can be incredibly complex so I’ll be sure to make it as easy as possible to understand. I promise that you’ll be able to pick it up.
Group Reflection
Has your site been validated by the World Wide Web Consortium? Why not?
How can I help you as you work toward creating a website with valid code? What errors is the validator presenting you with?


Eric B. said:
Currently, my site is using valid HTML 5 code. I decided to choose this because I wanted to test out the new HTML 5 doctype (but still be usable in older browsers).
I’ve written about the importance of HTML/CSS validation before, and I decided that HTML validation has some importance, but not so much for CSS.
HTML validation is more important because HTML controls the structure of the document, and if there are some errors, for example elements not properly nested, it could possible cause a browser to mess it up, and make your site unusable.
CSS validation, however, is less important because it only focuses on the presentation, and not the structure and content itself. It’s okay to get away with invalid CSS for using features in CSS3, etc. However, I think it’s not okay to have invalid CSS because of poor coding.
My Latest Blog Post: 7 Ways to Boost Your Development Productivity
Nicholas Cardot said:
There is literally only 1 thing that is currently holding me back from my HTML 5 validation and that is whitespace in the URLs of the social bookmarks that I’ve coded into the bottom of each post. I use WordPress’s tag the_title_attribute(); and when it generates the title in the URL it doesn’t use the html version of white space (%20). If I can find a way to filter it then I’ll be good to go.
Eric B. said:
I believe that PHP can escape URLs for you, with something like this:
echo 'http://example.com/' . urlencode('part of url with spaces');That would return:
Nicholas Cardot said:
Here’s what I’m currently using to create the social buttons. The class attribute is used to generate the icon and set the width and height. I’m not using the because I want the overall page to load faster. Each of the buttons basically looks similar to this one. It’s the_title_attribute(); that is creating the spaces. How would you rewrite this particular line of code? Also, as you can tell, this chunk of code is not inside any php like in an echo or anything. Only those tags are. What would you advise?
a class=”sbdelicious” href=”http://delicious.com/post?url=< ?php the_permalink() ?>&title=< ?php the_title_attribute(); ?>
Ignore the extra spaces and the lack of a < at the beginning. I couldn’t get the code to display on here and this was the only way to share it in the comments without it showing off the button instead of the code for the button.
Eric B. said:
According to the codex, the_title_attribute can accept a few parameters, including whether to echo or to return. It echos it by default.
So to apply urlencode to the_title_attribute:
<?php echo urlencode(the_title_attribute('echo=0')); ?>Nicholas Cardot said:
It worked. Thank you. A million thank yous. Now I’m going to spend the next few minutes incorporating that into the rest of the site (home page and single page). Thanks so much.
Now that it conforms properly as both XHTML 1.1 Strict and HTML5 Experimental, which is better? Would I be better off waiting until more browsers support HTML5 before switching the DOCTYPE information?
Eric B. said:
It doesn’t really matter. If a web browser supports XHTML 1.0 Strict, it’ll support HTML 5. You just can’t use some HTML 5-specific features like
<header>,<aside>, etc.Nicholas Cardot said:
Oh. Okay. Do you know when HTML5 will no longer be experimental?
Eric B. said:
Probably when everybody stops using Internet Explorer. I actually don’t know exactly when, but it seems like IE is the only browser that does not support at least part of HTML 5.
So my site could pretty much be XHTML 1.0 Strict valid if I removed the target=”_blank” attributes, but the way the HTML 5 doctype is structured, it will at least put non-supporting browsers into standards-compliance mode.
My Latest Blog Post: FWebDe Is Now Hosted at WPWebHost
Nicholas Cardot said:
That is only another reason why I dislike Internet Explorer. How worthless.
Ron Leyba said:
My blog is still not yet validated by the W3C, its just like, if I fix the recent errors, new errors will come up. It was like I’m on a continuous loop.
My Latest Blog Post: Sikat Ang Pinoy
Eric B. said:
Looking at your site, it seems that your only error is an extra
ulending tag. I’ve had this problem in WordPress before, caused by an empty widged area. Perhaps that’s the problem? (Sorry, didn’t check the actual location of the error)My Latest Blog Post: 7 Ways to Boost Your Development Productivity
Nicholas Cardot said:
I checked the source code and he actually has an empty set of ul tags with nothing it in. It just needs removed and the site would be completely valid.
Eric B. said:
Yeah, it looks like lists have to have at least one item to validate properly.
The comments around it say that it is part of a section called “bottom widebar”, which according to the site for the theme, is a widget area.
So, to fix that, you could either put a widget in there, or you could just remove the widget area. If you have some basic knowledge of PHP, you could also set it up to check if there are widgets in that area, and if there aren’t, display some default stuff (like an empty
li)My Latest Blog Post: 7 Ways to Boost Your Development Productivity
Nicholas Cardot said:
I didn’t know that before but it’s good to use the validator because we can learn and improve our site development skills.
Gordie said:
I’ve never even heard of this. I’m crap at code. I’m more of a content person.
I will try it. Looking forward to your lessons on code. I want to have some basics. Thanks in advance.
My Latest Blog Post: Beyond Blogging.
Nicholas Cardot said:
If you’re into developing online content then a few basics are very good to know. It will really help you in the long run especially as you work to customize your website and add new features.
Gordie said:
Thanks, Nicholas.
My Latest Blog Post: Look, Mom! My Blog’s Sprouting Pubes!
Nicholas Cardot said:
You’re welcome.
Ryhen Satch said:
After a year of trying out all sorts of ridiculous things on my blog, I somehow learned the basics of HTML. I don’t think I could go any more beyond that, but I appreciate being informed about things like this. W3C… yeah, sounds cool. Does it come with fries and a softdrink?
Thanks for sharing, Nick. Oh, and Happy New Year!!
My Latest Blog Post: Suffering & Pipe Dreams Of A Virtual Bodhisattva
Nicholas Cardot said:
I’m not sure if fries and a softdrink are included. You might have to get the W3C extra value meal to get those. Happy New Year to you also!
Senthil Ramesh said:
Hey Nick, most of the themes now is W3C validated. Does this mean wordpress users having W3C validated theme doesn’t have to check it again or often?
My Latest Blog Post: 5 Ways to get more followers on Twitter
Nicholas Cardot said:
Most premium themes are valid, yes but many free themes are just thrown together by people working to create bait to get people to visit their websites and are often filled with coding horrors. It’s always good to check it out after upgrading. It’s also important to check after installing new plugins. Many of the errors on my site were actually caused by poorly written plugins. I actually opened the plugin files and modified the xhtml that was being output by it.
Vikas| vikas-gupta.in said:
Congratulations!
I have many errors on my blog (some theme errors) but have no time or tech knowledge to correct them. I will surely work on this later. You must have a lot of tech knowledge because you did it in just 3 hours!
BTW you can now show a ‘W3C validated logo’ on your blog!
BTW, even the official Google blog has errors! On 14 June 2009 it had 412 errors and 109 warnings LOL!
Ok now a suggestion. Please publish a post (tutorial) on how to make a custom page for comment subscription manager. I really like it whenever I come here to unsubscribe to comments (the default WP GUI sucks!). Thanks.
My Latest Blog Post: My Nokia 1100 phone has completed four successful years
Nicholas Cardot said:
I spent hours customizing that subscription page. I essentially had to wrap the entire plugin in a custom template page. It wasn’t very easy and it’s completely different for every single theme being used.
Glen said:
My site passed the XHTML Transitional test. Haven’t checked the Strict yet.
The CSS test showed a number of areas for improvement.
Nice article on an often forgotten topic.
Thanks.
My Latest Blog Post: Make Your New Year’s Resolutions Count
Nicholas Cardot said:
You’re welcome. It’s good to know that your site is valid for XHTML Transitional. Great work.
Keith said:
I have validated and I have a couple of issues from 3rd party widgets, but they are minor and I just haven’t had time to search my code for them to fix.
My Latest Blog Post: Do you Use Disqus Or Other Comment Sign In App?
Nicholas Cardot said:
Time is a valuable asset that a lot of people seem to find themselves having a shortage of. I completely understand if you don’t have the time right now to sort it out.
Eric said:
I just checked my blog and the validator says there’s 17 errors and 1 warning for XHTML 1.0 Transitional.
I know quite a bit HTML and some CSS and a bit of XHTML enough to get me by but not enough to build a great website or anything of that sort.
Am looking forward to the course on coding you’re going to be sharing with us here.
Nicholas Cardot said:
Well be sure to stop back by here and let me know what issues you are struggling with. I’ll be glad to help you work out your 17 errors.
sernan said:
nice find.. tested my site and found 30 errors! My goodness!
I’d better start now, fixing those errors before the new year ends… Thanks and Happy New Year Nick!
My Latest Blog Post: What type of worst "Boss" are you?
Nicholas Cardot said:
So how’s it coming? Are you getting them fixed up?
Tony said:
Good thing we have something called, “New Year’s Resolutions.”
My Latest Blog Post: 4 Ways to Maximize Your WordPress.com Blog
Nicholas Cardot said:
That’s true.
Tony said:
Just checked my site. The results weren’t pretty. Sigh.
My Latest Blog Post: 4 Ways to Maximize Your WordPress.com Blog
Davor Gasparevic @ Cheap internet marketing ebooks blog said:
Uhhhhhhhh,
399 Errors, 138 warning(s)
my site sux big time…
My Latest Blog Post: 2009 annual inventory: 6 most useful and valuable ebooks on this blog
Tony said:
Darn! You surpassed my Guiness World Record for most errors and warnings. SMH.
My Latest Blog Post: 4 Ways to Maximize Your WordPress.com Blog
Nicholas Cardot said:
Ha ha. This is funny.
Davor Gasparevic @ Cheap internet marketing ebooks blog said:
No wonder, these numbers are epic…
My Latest Blog Post: 2010 plans for Cheap Internet Marketing Ebooks Blog!
Tisha C said:
I am finally back in action and trying to catch up…my comp was down for 3 weeks. I am currently taking a web design class and we use the WC3 Validator religiously!!! I have to say that my instructor swears by it. It has saved me alot of head aches. It is a very good tool to use. In learning xhtml code with out using this tool I would have a whole lot of mistakes floating around out there!!!
T
Nicholas Cardot said:
It’s a good habit to get into. It’s good that you use it a lot. It will save you a lot of hassle down the road. Do you have any websites up yet that you’ve made?
chandan said:
My blog is on blogger and I think my blog is by default w3 validated. is not it Nick?
My Latest Blog Post: Wish you all happy 2010
Nicholas Cardot said:
No. It’s not. It’s based on the template that you use and the plugins and modifications to it. I just checked your site and it has 334 errors and 186 warnings.
chandan said:
Yes I have also got such error when I checked my blog, so is it one major problem?
My Latest Blog Post: My favorite website promotion firm
Nicholas Cardot said:
I don’t think that it’s just one error. I think that it’s several. You would have to dig through the code and find them all.
Tisha C said:
I do have a church website that I created but it is way outdated and I am in the process of revamping the whole site. It is alot of fun to see the finished product.
Nicholas Cardot said:
What the address to your church website? I’d love to see it? Also, be sure to stop by and let me know when it’s finished.
Web Design Company said:
Hi,
I had recently validated my website and that has successfully passed. But, I really didnt thought for the blog which is installed in a sub directory apart from the web pages.
I just tested it and it has 52 errors and 19 warnings…poor me
I am to fix them as soon as possible.
- J.
My Latest Blog Post: 8 Don’ts For htaccess
Nicholas Cardot said:
With a name like Web Design Company you should definitely have a valid website. LOL. Take care of those errors and then keep up the great work.
Web Design Company said:
So, I validated my blog too
Its completely valid XHTML 1.0 Transitional.
Anymore recommendations?
My Latest Blog Post: 8 Don’ts For htaccess
Nicholas Cardot said:
Web Design Company » Yeah…go for strict. I started with XHTML 1.0 transitional and like you I announced it…only on Twitter and a friend challenged me to go for strict. So I did. You should consider doing the same.
Web Design Company said:
I am thinking for Strict, but having too much work load these days. Might be I convert it sooner because at the moment I need to make good changes to get it Strict. Though, the presentation is separate from content via CSS but still there are several elements and attributes coming from older HTML.
Thanks for motivating me for Strict Type.
- J.
My Latest Blog Post: 10 SEO Tips for Web Designers
Web Design Company said:
Yes,
That’s poor how I could make such a mistake, but true human make mistakes
Almost all fixed. Need a little more to check and than I to upload.
These errors brought up after the theme update which I did not care, my previous theme was fully W3C compliant as of my website.
My Latest Blog Post: 8 Don’ts For htaccess
Nicholas Cardot said:
Web Design Company, it’s not poor. We’re all learning and growing together.
Don Gilbert said:
W3C Validation is a must – there are so many poorly coded WordPress and Joomla and other templates out there that I spend a lot of my time fixing the validation – but oh – it is a sweet feeling going to 200+ validation errors to that nice, slick green bar.
Woot!
My Latest Blog Post: Why Your Small Business Can’t Ignore Social Media Any Longer
Anthony Feint said:
“If the code is valid, however, then it should appear the same in all browsers.” This isn’t true – My developers, have to create separate code for different browsers (which doesn’t validate) to ensure it works. Browsers don’t actually stick to these standards!
Google.com doesn’t even validate.
When we push a new version of our app, we need to test it in 20 browser versions and we take around 2 weeks doing code tweaks to ensure it works in all browsers
My Latest Blog Post: How to Capture Every Mention of Your Name
Nicholas Cardot said:
Anthony Feint » Although you are right, validation is one of the first steps to helping accomplish equal display of your website in all browsers. Ideally that’s what it was designed for. The differences that do show up are things that aren’t defined by W3. The code that is verified by them will be very similar in most browsers.
Mikkel 'DaneBlogger' Juhl said:
Well yeah… But does it really helps the SEO?
And I’m skeptical about the professionalism, only if you are a freelancer, who works with websites.
I don’t think people, W3 validates your site to see if you’re “professional enough”
My Latest Blog Post: How to Guest Post the Tactical Way
Ellen said:
Does the validator check the whole site-all pages? Or do you have to go page by page?
I know some code, but am sooo rusty!