Yes, “divitis” and “classitis” are the two latest words that I have added to my CSS vocabulary. But unlike normal language words, these two are added to make sure that I never use them, or atleast minimize their use.
So, what do they mean? Divitis is when someone uses unnecessry <div> tags in their markups. For example:
<div id="menu">
<ul>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ul>
</div>
The above example has unnecessary div element. Instead, it could have been easily done as:
<ul id="menu">
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ul>
Likewise, classitis is the over use of the class attribute. For example:
<p class="address">
Ahsanul Bari<br />
House-17, Road-3/A, Sector-5<br />
Uttara, Dhaka-1230<br />
</p>
In the above example, we could easily use the <address> tag instead of using the class=”address” like:
<address>
Ahsanul Bari<br />
House-17, Road-3/A, Sector-5, <br />
Uttara, Dhaka-1230<br />
</address>
The above two examples are really simple, but I hope you got the point. Avoiding divitis and classitis helps to write mark-ups, that are more semantically correct.
The address tag is about to become irrelevant when html 5 and/or xhtml 2 arrive though. i think you would be better off using the hCard microformat instead. A lot of div’s but an accepted standard by now.
I love it and its so true, if you look at “objects” created by Backbase their DOM structure is 100% divs with very specific classes. Like Tijs said you’d be better off using a microformat, but why not distinguish elements by their tagname rather than an attribute.
I know your using a wordpress template, but it pays to look at the markup on a site that your writing articles like this on. People may not take you seriously if they read this, then look at your code.
LOL, Michael has a point!