Semantic markup
A semantic markup to boost your SEO
The HTML language is, as its name says, a TAG language. It seems to me that it is essential to know the purpose of each tag, i.e. for what purpose they have been created and how they are defined in the standards.
Please note that I am here talking about semantic markup and not about semantics, which is a much larger topic that goes far beyond the web (and my skills).
Implementing a semantic markup is of multiple interests and among others for the accessibility, processing, analysis or display of a document. As part of this article, we will focus on the context of search engines. Indeed, the semantic markup brings obvious opportunities for your visibility.
The structure of your document and content
To be clear, let's take some concrete examples with many semantic tags:
- h1, h2, h3, h4, h5 and h6 tags: tags that frame the titles. H1 represent the most important title(s), h6, the less important one(s)
- P tag: tag framing a paragraph
- ol tag: orderly list
- blockquotetag: Quote
Depending on your content, it will therefore be necessary to use the appropriate tags
Table tag, div and semantic
An urban legend says that the use of the div tags is beneficial for the SEO of a website to the detriment of the table tag. It is just all wrong! It is, actually, all the contrary because the table tag seems to me to give more meaning to data than a div tag.
The connection between semantic markup and search engines
The search engines analyze the HTML code before generating their rankings. The aim is to understand the meaning of a document in order to properly rank and therefore propose relevant results to their users.
The tags of the HTML language are the allies of the engines in their quest for relevance. As we've seen it, when these tags are properly used, they make possible to analyse in a more subtle way the structure of a document, as well as easier weight the importance of an information.
Regarding the SEO optimization of your website, your pages will therefore have to:
- Talk about the topic you are targeting
- Contain the keywords you target and have them located at important places (semantically speaking) in your document. That means your keywords should be framed by tags that highlight them.
Example of semantic markup
Here is an example of judicious use of the h1, h2, h3 ,p ,ul , ol and li tags.
<h1>Forest elephants</h1>
<p>In this part, we look at the less-known subject about forest elephants.</p>T
<h2>The habitat</h2>
<p>Forest elephants do not live in the trees but in the middle of it.</p>
<h2>The feeding</h2>
<p>Forest elephant do not eat the same food at night and day.</p>
<h3>Night diet</h3>
<p>At night, forest elephants eat the following foodstuffs:</p>
<ul>
<li>Mouse</li>
<li>Snake</li>
<li>Spider</li>
</ul>
<h3>Day diet</h3>
<p>During the day, forest elephants eat other foods. Here is the list of foods in order of preference:</p>
<ol>
<li>Grass</li>
<li>Hay</li>
<li>Fern</li>
</ol>
CSS and semantic markup
The CSS language allows you to modify the display of the tags. Therefore, the choice to use one tag or another must be determined overall depending on the meaning of the tag rather than its default display in your browser.
Next : Web writing
Previous : META tag
