Semantic Markup – Why Should You Use It?

Your markup should have meaning. Markup your content appropriately (e.g. put your address and phone number in the address element) and it becomes much more readable to search engines and other software used for data extraction. Using only div and span elements leaves much to be desired, semantically speaking. These elements are certainly indispensable, however, there are some cases where there are more meaningful elements to use. For example:

  • Use h1 as your page title; use h2 and on appropriately as sub-headings on the page. This provides an outline of your document.
  • Use lists (dl, ol, ul) instead of manually placing numbers or bullets.
  • Use address for any contact information on your page, including physical address, email address, phone numbers, and whatever else you would consider to be contact info.
  • Use table on data best represented in rows and columns. Use thead and th to markup the column headings and tbody for the data itself.

Check the HTML spec for additional meaningful elements and get to work! :)

You can use the W3’s handy Semantic Data Extractor tool to test your new semantic web site to give you an idea of how it would be seen by software.

That does it for now. See you next time! Until then, read SEO and Validation.

Tags: , , , , ,



2 Responses to “Semantic Markup – Why Should You Use It?”

  1. btard says:

    glad your markup stands the test of it’s doctype :)

  2. Alan Vickery says:

    Thank you for highlighting the importance of semantic markup. As the web continues to evolve, semantic markup and validation will become an even more important factor in setting your site apart from the sea of meaningless, invalid garbage. Keep up the great blog posts!