Roger Johansson writes over on, “why webstandards still matter“.

While some statements seem (intentionally) naive:

enough has been said about best practices

Web standards aren’t important anymore, because most Web developers are already using them

He gets the point across. Perhaps the most evident (at least given what I’ve seen in the past several months):

The clued-in are a small minority

From dealing with folks in my workplace(s), I see first-hand how so many out there consider themselves informed experts in the field but unfortunately that’s just not the case.

The question of the hour, why is it so easy to be ignorant? And, since when did we stop asking “the internet” questions about how to do (or how not to do) things right. That’s right, just like in perl, craps and even Yahtzee; there is always more than one way to do it. Some better, some worse… some easier, others more maintainable, and others better yet for SEO and Accessibility.

What is the right way?

So what is the right way? Well, to start off, semantics are important. Divitus and classitus are bad, just as bad as table-for-layouts.

Rule of thumb

Markup is for content, Stylesheets define style, and they should be pulled with proper semantic use of tags and classes. One way I like to look at it is, can I maintain the style of a website just by looking at the CSS? Better yet, could I effectively change style (not necessarily layout) of a website by applying any well written stylesheet to it?

If one can’t take your markup and get their style/layout working with very minimal markup changes then chances are you could use some improvements. Same goes for your CSS; if I can’t take just your CSS and effectively maintain the style of your website (not having to dig through your markup as well), there is a good chance you don’t fully get the whole stylesheet and semantics concept.

Some (obvious) examples of what not to do

Just a few examples I’ve seen this past week:

<div class=”spacer-1″><– –></div>

This markup is explicitly there for style, no content purpose whatsoever. That’s no good.

<td class=”width120″>&nbsp;</td>

Great!, a class that defines the width… it even tells us with it’s given name. The context I saw this in was to define widths of columns such as “Product Name”, “Start Date” and so on. The classes should then be defined exactly that: product-name and “start-date”. Seriously, someone is getting paid as “the HTML guy” at a workplace writing markup like that.

<div class=”boxshot-container”>
<a href=”#”><img class=”boxshot”></a>

Doesn’t this at all seem redundant?

Do us all a favour and do it right

Comments are closed.