POSH - Plain Old Semantic HTML

Tuesday, November 6, 2007

For years I’ve been advocating the use of valid, semantic, accessible, well-structured HTML. It’s a bit of a mouthful to say, but thanks to an acronym being coined on the Microformats IRC channel almost seven months ago, I can now shorten that to POSH instead.

POSH, in case you haven’t heard of it already, is short for “Plain Old Semantic HTML”, and is obviously much quicker and easier to say than “valid, semantic, accessible, well-structured HTML”. Unfortunately POSH - semantic markup - is also something most people building websites or creating content for the Web have yet to discover. Perhaps a fancy acronym will help speed up adoption.

To start writing semantic markup, you need to:

Validate your HTMLStop using tables for layoutUse semantic elements and attributes for their intended purposeUse semantic class names and id valuesUse as little HTML as will get the job doneIt would sure be nice to see widespread use of semantic HTML sooner rather than later. So get out there and make sure all the websites you design or program use semantic HTML. Teach all your colleagues and clients about semantic HTML. Use it, talk about it, blog about it. If you don’t already, start Explaining Semantic Mark-Up.

The more people use the semantics of HTML correctly, the more reason for various user agents to improve their support for it.

A few practical semantic HTML tips:

Use heading elements (h1 - h6) for headings, and make sure they create a logical outline of the document.

Use tables to mark up tabular data, and use the full set of features (caption, th, scope, headers etc.) provided by HTML 4.01 to make sure that the tables are accessible. Learn more about that in Bring on the tables.When marking up a quote, use q or blockquote. There are some tips on using them in Quotations and citations: quoting text. And don’t forget to Use only block-level elements in blockquotes.