If you are a Web Designer or Developer you must have once heard about semantic. Even if you haven’t done it on purpose you might have also followed some semantic rules during your work without knowing it.

To be honest semantic is an other buzzword we use today to sale something as old as html.

The shorter definition I can come up with is “Use the right markup for the right purpose”. I will talk about semantic more deeply later but for know just try to grasp the concept.

For example:

<p><a href="page1.html">My blog</a></p>
<p><a href="page2.html">Page 2</a></p>

and

<ul>
<li><a href="page1.html">My blog</a></li>
<li><a href="page2.html">Page 2</a></li>
</ul>


both display links in your menu. But if you look at the markup used, the first menu wraps links between <p> tags and the second in a unordered list.

<p> tags in html are meant to contain paragraph of text. …Hum, doesn’t seems to describe very well our menu.

Unordered list are, like their name, use to display list of element. Sounds more accurate for a menu to be displayed as a list of link don’t you think?

That what this is all about, using the tags that best describe your content. Their is plenty of markup available in html to describe all the content you will have to put on a website so get started now and use all the tools you have to build a well structured web page.

Coding things the right way may seems time consuming but you wont regret it.