They’ve been around for decades and serve as a liaison between you, search engines, and users, ensuring that nothing gets in the way of your content distribution plan. Furthermore, they are a necessary piece of your SEO strategy, because without them, your content would be lost in the online abyss, never to be found by its intended audience.
However, with the internet growing more than ever and the number of web-building tools threatening to overwhelm website builders, it’s difficult to keep track of which components are worthwhile. Many designers approach coding without a clear strategy in mind, leading to wasted work on elements that do not add actual value to your page.
What Are Meta Tags?
Meta tags are basic search engine optimization elements which describe the content of a page. They are not visible on the page because they are concealed in the section.
Below are the five most used meta tags on today’s website. Let’s take a look at each one.
1. Title Tag
The title is displayed on the search engine results page. Each page on your site should have a distinct title that appropriately represents the page’s content and attracts users to visit it. Considering Google only shows the first 50-60 characters of a title, make sure the most descriptive terms are displayed first.
Title Tag example:
<title>This is a bold text</title>
2. Description Tag
In search engine results, the description is frequently displayed below the title. Each page on your site should have a 150-160 character description that is unique and accurate. It’s crucial to be precise because if automated search engine crawlers determine that the description doesn’t match the page content, it won’t be published on the search engine results page.
Description Tag example:
<meta name="description" content="This is meta description Sample.">
3. Alt Text Tag
Alternative text tags are important to include for any image on your page. Search engines can’t read images, so they need alt text to know what’s on your page.
When creating alt text tags, the aim of the game is to be concise and informative. Make sure your text is clear and informative of what the image is and avoids extraneous or overly subjective language (avoid adjectives if possible). Alt text tags should be no longer than 16 words, between 50 and 55 characters.
When it comes to the image itself, use the original where possible and try not to degrade the quality of the image. This will ensure your page loads faster and keeps search engines happy.
Alt Text Tag example:
<img src=” http://example.com/image-abc.jpg” alt=”abc” />
4. Robot Meta Tag
The meta tag is intended for web crawlers, which are bots that sift through thousands upon thousands of web pages in order to index them. Search engines use the most common types of web crawlers, so a robot meta tag is required if you want your page to appear in web searches.
The robot meta tag contains two key parts that tell web crawlers what to do. FOLLOW tells a crawler to follow all of the links on a given page, while INDEX tells it to index that page.
Robot tag example:
<head>
<meta name=”robots” content=”noindex, nofollow”>
<meta name=”robots” content=”index, follow”>
</head>
5. Canonical Tag
A canonical tag is an HTML link tag with the rel=canonical attribute.
It’s used to indicate that this webpage has multiple versions. Your website tells search engines that this URL is the primary page and that other pages should not be indexed by using the canonical tag in the code.
Canonical tag example:
<head>
<link rel=“canonical” href=“https://example.com/duplicate-page/” />
</head>
Wrap Up
Meta tags are and will likely always be crucial to any webpage. They are the foundation of HTML, and give insights to search engines about the content of your site.
Meta tags aren’t difficult to implement yourself – you don’t need to be a programmer, just some HTML knowledge. . If you need help implementing meta tags for your website, please contact me! You know I am always happy to help.
Ethan is a Full Stack Web Developer and SEO Specialist based in Pittsburgh, PA. In his free time, Ethan enjoys working on various projects involving Ruby, Vue and AWS applications.
Ethan graduated from The Firehose Project coding bootcamp in 2016 with a focus on Ruby on Rail and Computer Software engineering.