Accessibility - Writing Semantic Mark-up
Posted: July 7th, 2009 | Author: Ryan | Filed under: SEO, XHTML | Tags: Better Coding, SEO | No Comments »In one of my previous posts “An Insight into What Search Engines like”, I discussed a point on having a clear information hierarchy.
Clear information hierarchies are obtained by writing mark-up semantically, if not written semantically when the search engine scans the content of a web page it cannot identify the most important aspects of the page and index appropriately.
Writing Semantic mark-up is a process of choosing the tags that communicate the hierarchy of information contained in the page and placing them in a logical order.
<h1> tag
The <h1> tag should only ever be used once on a page at a time. It signifies the top, most important piece of information in the document and is generally reserved for the name of the site / author or owner and their logo.
<h2> tag
The <h2> tag should be treated with the same respect as the <h1> tag and its usage be limited. <h2> are commonly used for page titles.
<h3> to <h6>
<h3> to <h6> are the lower heading tags and can be used multiple times within the page. They don’t have the same importance as their older siblings but gain more importance with search engines than regular paragraph copy. They can be used for navigation and headings within content replacing the <strong> tag.
A must for semantics is the need for the tags to be placed in order within the mark-up, a typical example could be.
<h1>The Semantic Mark-up Co.</h1>
<h2>How to create Semantic Mark-up</h2>
<ul>
<li id=”nav1″>
<h3><a href=”index.html” title=”The Semantic Mark-up Home page”>Semantic Mark-up Co</a></h3>
</li>
<li id=”nav2″>
<h3><a href=”tutorials.html” title=”Semantic Mark-up Tutorials”>Tutorial</a></h3>
</li>
</ul>
<h4>Step 1</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce varius, magna fermentum scelerisque faucibus, dui quam vehicula magna, ut semper neque libero eget purus</p>
<h4>Step 2</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce varius, magna fermentum scelerisque faucibus, dui quam vehicula magna, ut semper neque libero eget purus</p>