Semantic content markup

From: "Updating your site with standards-compliant HTML"

Author: Pad Gallagher

Now that we’ve shifted the appearance of page elements out of the HTML page and into the CSS, the tags have semantic value—they actually describe what’s contained within them. Semantic content markup offers tremendous benefits in accessibility alone. For example, because the formatting and appearance of a standards-compliant web page are handled by the CSS, instead of by inline formatting, visually impaired users no longer have to sit through the screen reader’s tedious and time-consuming itemization of every table element and transparent GIF used in the non-compliant page’s layout tables.

Another great benefit to semantic content markup is that it can significantly improve search engine optimization. Standards-compliant web pages contain a bare minimum of markup, so when a search engine crawls your site, it encounters a much higher content-to-markup ratio, resulting in more accurate search engine results and higher page ranking.

One final note about semantic markup: <i> and <b>and tags are considered display tags; they change only the appearance of the enclosed content. Use style definitions in your CSS for elements such as code examples or UI text that should be displayed in italics or bold.

In cases where your intent is to change the meaning of an element, use the standards-compliant <em> (meaning “emphasis”) and <strong> tags instead. Though these tags also correctly apply the desired formatting, their purpose is to provide semantic value, which helps screen readers and other accessibility tools correctly interpret and present content enclosed in these tags.