Whether you realize it or not, semantic markup and search engine optimization (SEO) go hand in hand. The purpose of clean, meaningful markup is organize you data so that it is identified more clearly to humans and software alike. The purpose of SEO is to increase the readability of your markup to search engines. Those two aren't far removed from each other because search engine optimization is simply correcting for non-semantic markup after the fact. Consider that when trying to pitch it to a client.

I have summarized a few simple markup practices that will dramatically 'optimize' your information for search engine consumption, and guess what-- More people will actually understand and receive it too! Before you peruse the items and decide it will impede your design options or flexibility, allow me to correct your misconception.

Use lists - group things meaningfully, not just visually

Using the unordered list (

) is a perfect way of grouping related items, be they navigation links or gallery thumbnails. If the numbering is important use the ordered list (

). There are other lists available in XHTML 2, such as the super-cool and rather anticipated navigation list (), which is for, you guessed it, navigation! Even though the
was not designed specifically for it, the W3C currently recommends the practice of using it to group menu items. If you think it can't look slick or some common menu style isn't possible with the
, try browsing these CSS
menu examples

Use those header tags properly!

This is a simple yet ridiculously misused method of organizing your content. The header tags should be used to guide and label the flow of content on your site. Don't take my word for it; the W3 clears this up quite nicely, explaining the fundamental use for header tags in the validator results when 'Show Outline' is selected:

Below is an outline for this document, automatically generated from the heading tags (

through

).
. . .
If this does not look like a real outline, it is likely that the heading tags are not being used properly. (Headings should reflect the logical structure of the document; they should not be used simply to add emphasis, or to change the font size.)

The outline option is a very useful tool that I recommend to everyone.

Use and tags

As outlined in a previous article, these two tags semantically associate abbreviations and acronyms with their full descriptions or terms. Not only do visual users have a reminder if they are uncertain of a term, but screen readers can skip situations where acronyms like NATO might be spoken to the user as a string of letters.

Use metadata tags for links, images etc

Using title and alt attributes is considered by many to be staple optimization. However, when using proper semantic markup, it should happen regardless of your efforts to optimize as it is the last resort for many situations including elements improperly loading, plug-ins not available, styling or client-side scripting disabled, or text and non-visual browsing.

Semantic Markup: Optimizing for Now and the Future

While the additions of hidden links or keywords may be a cute trick today, search engines are becoming smarter all the time, and hacks that worked yesterday may not work today. In fact, it may hurt your standing if it is widely considered an underhanded practice! Google puts it best when they recommend that you ask yourself Does this help my users? Would I do this if search engines didn't exist? Sticking to semantic markup means your sites will be optimized for now and in 5 years with no further effort on your part. It may just be me, but that seems like the only way to go.