Dougal Campbell's geek ramblings

WordPress, web development, and world domination.

Real World CSS

For anyone who is still mired in the HTML Tag Soup of old-style web page design, the question, “Why should I switch to using CSS” often arises. Here’s an excelent real world example. [via scottandrew.com]

It’s true that busting your butt to make a webpage fully XHTML (or even HTML 4.0) compliant might not be “necessary” for your application. And I don’t necessarily agree with those who cry “tables are evil!”. Those of us working in the real world know that sometimes you have to compromise. You try to do the Right Thing whenever possible, but there are times that you have to just do the Working Thing, instead. Heck, this page doesn’t validate. But if you have the patience to check, you’ll see that most of the errors are pretty minor — mostly it’s internal URLs that don’t properly handle “&” characters. If I was worried about trying to parse the page as XML, I’d have to fix it. But I’m not, so it’s not a priority for me.

On the other hand, if you view the page source, you’ll see that I rely heavily on CSS and structural markup. I try to use HTML markup elements as they are intended to be used. I don’t use <blockquote> tags just to indent something — I use it when I’m actually quoting something. If I want something indented, I’ll create a CSS class and just style a regular paragraph with it. This makes the underline code and page stucture much easier to understand, both for humans and for machines. If someone wanted to screen-scrape info off of this page with HTML::TreeBuilder, for instance, it would be a fairly simple task, because the page elements are used in a logical and consistent manner. Of course, there’s not much reason to screen-scape, because I provide an RSS feed.

About Dougal Campbell

Dougal is a web developer, and a "Developer Emeritus" for the WordPress platform. When he's not coding PHP, Perl, CSS, JavaScript, or whatnot, he spends time with his wife, three children, a dog, and a cat in their Atlanta area home.
This entry was posted in Web Design and tagged , , , . Bookmark the permalink.

Leave a Reply