When we build a website, we all want that it is recognized and well-placed in search engines and there are several ways to make it happen. Today we will talk about how to take advantage of HTML tags for SEO.

SEO stands for Search Engine Optimization, and if we have good SEO, our website will appear in a better position in our search results.

HTML tags are parts of our page’s code, invisible to the user: he only sees them if he looks for the page’s source-code or “inspects” the page. These tags’ purpose is to give information to the search engine about our page’s content.

Now the question is, how do these two relate? How do HTML tags influence SEO?

Besides giving information to the search engines about our page’s content, they also make our SERPs more appealing and informative (Search Engine Results Page are, basically, each one of the results that appear in the search results’ page, as you can see in the image below). This ends up resulting in better user experience, since the results presented to them are closer to what they really want.


So, let’s make a journey through the most relevant tags and, one by one, understand their importance.

An extra note, for those who aren’t friends with HTML: pages are, always, divided into two sections: Header and Body. The Header section is where we put all the page’s main information, and in the Body section, we put the content.

As you can see, HTML is like a house that’s built from the roof, aka, from the Head.


Title Tag

The title tag is, usually, the first thing the user sees in SERPs and on the browser’s windows, which results in it being one of the most important HTML tags for SEO.

Betting on a good title for our page is crucial, as well as including a keyword to strengthener our chances against the competition.

<title>Email marketing: why use it? | Diamond By BOLD</title>

Tips for title tags:

One way to optimize our titles is by minding the number of characters, that shouldn’t be more than 60. To reduce this number you can use symbols like “&” or “/” to substitute some words.

Big titles are not necessarily bad titles, but it is better that the search engine doesn’t cut our title. Anyways, we should always try to put the most important information in the beginning and also avoid using only upper case letters.

Our titles should be unique, otherwise, Google will think that our page has duplicated content from another page and penalize us.

And the most important thing of all: write for the user, always!


Meta Description Tag

This tag is one of the most important HTML tags for SEO, almost as much as the title tag. It helps the search engines and the user to understand what is the page’s subject.

In search engines, when our page is shown in the search results, the meta description appears in the SERP’s snippet, right after the page’s title and URL. Another place where our meta description also appears is in social media shares under the title.

The meta description, when well written, can increase our click-through rate. But pay attention! It should match the page’s content, otherwise, there’s a great possibility of the bounce rate also increasing and that is not good!

<meta name="description" content="Why should email marketing be used in company-client comunication? Does it still work? What are its main advantages? Find out here!"/>

Tips for meta description tags:

Just like the title, the meta description also has a character limit that has increased over the last years up to 375 characters, but our advice is to point your meta descriptions to 160 characters.

We can’t forget that the majority of internet accesses are done via mobile devices and their screen is much smaller (especially if it is a smartphone).

To be safe always put the most important information in the beginning!

The keywords that the user searches for, appears highlighted in bold, so we should optimize our description for the keywords we choose.

The meta description should also be unique and focused on the user, otherwise, Google will assume that our page has duplicated content, which is not cool.

Finally, and we have already written an article regarding this, the Schema.Org. Using this tool, we can make our snippets more appealing to the user, you can take a look!


Open Graphs Tags

Open Graphs are used to modify the way shared content appears to the user.

For example: social media shares, show the title and meta description just like in SERPs. We use OG tags to make our title and meta description more appealing to social media because each medium has its own specifics and what works for a user to click on a link on the search engine results’ page, may not work on social media.

And what is the final result? The click rate rising and also, ideally, the number of conversions.

This is the structure of an OG tag:

Title: Its length should be between 60 and 90 characters, it will replace the title tag;

Type: Here, we specify the type of content we’re sharing: if it is a video, an image, an article, or even a website;

Description: This will take the meta description’s place in social media shares and it shouldn’t overtake 200 characters. Here, there’s no need to optimize for a specific keyword, as this description doesn’t appear on SERPs. This way, we have more freedom to make it interesting to the user;

Image: It isn’t new to anyone that images make everything more appealing to the user and the chance that they click on a link with an image is much higher. We should bet on a striking image, and it can even have some text in it, but in a place that doesn’t take the risk of being cut out when shown in a miniature;

Twitter cards: Twitter cards are OG tags, specifically designed for Twitter. They work as an extension to the allowed characters for this social media network, which allows us to stand out from other posts.

<meta property="og:type" content="article" />
<meta property="og:title" content="Email marketing: why use it? | Diamond By BOLD" />
<meta property="og:description" content="Why should email marketing be used in company-client comunication? Does it still work? What are its main advantages? Find out here!" />
<meta property="og:image" content="https://www.diamondbybold.com/wp-content/uploads/2019/01/E-mail-marketing-porque-utilizar.jpg"" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:description" content="Why should email marketing be used in company-client comunication? Does it still work? What are its main advantages? Find out here!" />
<meta name="twitter:title" content="Email marketing: why use it? | Diamond By BOLD" />
<meta name="twitter:site" content="@diamondbybold" />
<meta name="twitter:image" content="https://www.diamondbybold.com/wp-content/uploads/2019/01/E-mail-marketing-porque-utilizar.jpg" />
<meta name="twitter:creator" content="@diamondbybold" />


Robots Tag

The Robots tag’s purpose is to inform the search engines about pages we don’t want to index, which means they are not shown in the search results’ pages. Now you think “Ah! But if they aren’t indexed, we don’t have visits in those pages and that’s not good for SEO!”. Well, you’re wrong.

This tag is used in case we have a page with “less interesting” content and we don’t want it to be indexed. But this doesn’t mean we will be harmed by this: Hopefully, if i’s a page with non-relevant information to the majority of users, like the “Terms and Conditions”, there won’t be searches for it.

Good examples of pages to de-index are private pages: pages with duplicated content, spam pages auto-generated by the website (community profile pages, for example). Even a thank-you page, that should only be found after the user does a specific action.

That said, this is not one of the HTML tags for SEO that promotes the rising of your classification, but it prevents it from going lower. Content is king, and if the user enters a page with irrelevant content, he will probably abandon the page, which raises our bounce rate and makes our classification worse.

A final note: if, for a chance, there are searches related to the content of a page we were planning on de-indexing, maybe these could be a good opportunity to optimize that page instead.

Types of robots tags:

Noindex – prevents the page’s indexation;

Nofollow – prevents the tracking of our page’s links;

Noarchive – this is used when we don’t want a copy in cache of our page to appear in the search results’ page;

Nosnippet – if we don’t want our page’s description to appear, this is the tag we must use;

None – this one joins “noindex” and “nofollow” together.

Be aware, there’s always the possibility of the search engine to ignore our robots tags and that is something we can’t control in any way.

<meta name=“robots" content=“noindex" />
<meta name=“robots" content=“nofollow" />
<meta name=“robots" content=“noarchive" />
<meta name=“robots" content=“nosnippet" />
<meta name=“robots" content=“none" />


Canonical Tag

Yes, we’ve said that we shouldn’t have duplicated content. But, sometimes, it is impossible not to have two pages with identical content. There iss where the canonical tag takes action. This tag’s function is to inform the search engine about which page is more important.

This action is SEO friendly, mainly because it shows that the pages are similar and not completely equal, so, we are not harmed. And most important, to avoid that a page with less importance be valued instead of another with more relevance.

<link rel="canonical" href="https://www.diamondbybold.com/en/email-marketing-use/" />

Tips for canonical tags:

Evaluate which page do you want to put this tag in. You should take into consideration: search volume, page’s relevance and, in case there’s already enough data, choose as the main page the one with the best rating.


Heading Tag

Heading tags are micro titles on our page. They have 6 levels and should be used regarding the importance of the subject from each part of our page’s content.

These micro titles promote that pages have easier readability to the user and also to the search engines.

<h1>Email marketing: why use it?</h1>
<h3>It conquers by its efficiency</h3>

Tips for heading tags:

Despite what many people say, it’s not mandatory to use only one level 1 tag (h1). Nonetheless, we shouldn’t exaggerate on their use.

We should also optimize our micro titles to the keyword we chose to optimize, especially the h1 micro titles.


Alternative Text Attribute

This is not an HTML tag for SEO, it’s an attribute, since it goes inside the image tag. The alternative text attribute is used to describe our page’s images. This tag is important for the search engine to understand what is the content of our images.

This way, it reads the alternative text and knows already what the image is about. It can be so simple as “woman drinking coffee from a cup with flowers” or “infographic about bread consume in Europe”.

The browser may not load our images and that is one of the reasons we use the “alt-text”. By adding alt-texts to our images, the user can know what would be in that space, if the image was correctly loaded.

The alternative text has an important role in image optimization. It makes our images as accessible to search engines (informing them what a specific image is) as to people (showing an alternative text in case some image is not loaded).

<img width="300" height="199" src="https://www.diamondbybold.com/wp-content/uploads/2019/01/E-mail-marketing-porque-utilizar-300x206.jpg" class="attachment-diamond-post size-diamond-post wp-post-image" alt="E-mail marketing" />

Tips for alternative text attributes:

Again, the characters. These descriptions shouldn’t overtake 125 characters, otherwise, they will be cut out.

Never leave an image description empty. That is one of the most common mistakes and it influences our ranking.

Use keywords in the descriptions. The images that add value to the text on our page should be optimized.