Building a standards compliant web site is a dirty deed these days. There are many things to consider when planning your site, but none as important as proper markup and styling. And there in lies the problem. Not all markup is created equal and many browsers play by their own rules. If you have weak or poorly structured XHTML, your site will suffer from bloat, bad links and lackluster search engine results. As for styling, your site might look fantastic in one browser but a mangled mess in another. So what in the world is a designer to do? Organizations such as the W3C and WaSP are looking to create more defined standards for cross-browser consistency, but the battle is still far from over. There are however some ways to get around the annoyances of standards-based design and I’ve outlined a few of them for you.

Firefox to the rescue

I’m sure many of you are aware of this wonderful utility for the Firefox browser but I couldn’t let it fall to the wayside. The Web Developer Extension for Mozilla and Firefox has been the most valuable web resource for me over the past few months. Not only is there a wealth of available information, but it’s perfect for testing your site in almost every posible user scenario. Download it now if you haven’t already, you won’t be sorry.

The good kind of Vista, I swear!

No, I’m not talking about the long overdue and much beguiled Windows Vista. I’m talking about CSSVista; probably one of the most useful tools for standards compliant coding since the Box Model Hack. CSSVista is “a free Windows application for web developers which lets you edit your CSS code live in both Internet Explorer and Firefox simultaneously“. For Windows testing, you can now see how your site looks in the comfort of one pane rather than switching back and forth between programs and cluttering up your screen. Not to mention the best part about this wonderful new tool is that you can have it for the low, low price of $FREE.99! I highly recommend you try this application for your cross-browser compatability needs. I prefer my Powerbook over my PC and with this application, I spend less time working on Windows browser testing than ever before. That’s a good thing!

Validated for your pleasure

After spending a good deal of time getting the site up and ready for the CSS Reboot, validation for XHTML and CSS was at the bottom of my seemingly endless list. However I spent some time tonight making sure that all of the pages validated in XHTML 1.0 Strict. It was important for me to do this not only because it’s a strong core for any site, but it’s also a search engine’s best friend. Well structured code is easily indexed and allows spiders to crawl through it with simplistic ease. As the traffic to this site grows, I want the updated content to be found quickly and easily by anyone looking for it, and that includes robots.* On a related note, my CSS does not validate because I have had to impliment some hacks so that users with Internet Explorer could see my site. Thanks Microsoft.

The motherload

I’ve mentioned this in a previous post, but it’s so good that it bears repeating. Motivated by a passion for web development, Vitaly Friedman has been working on a project that houses some of the best and most useful bookmarks on the internet for web professionals and enthusiasts. You have to see it to believe it. Well, what are you waiting for?

These are just a few of the resources that I use to enhance my web standards development. Whatever the project size, utilizing these tools will greatly enhance your finished product. If you have any other resources in your bag of web standards tricks, I’d love to hear about them and I’m sure others will find it useful as well.