Meta Data for SEO

How to Formulate the Meta Title and Meta Description for Your Website – SEO D.I.Y. Tutorial #2

If you want your website to show up on top of Google’s search results it is crucial that the right keywords show up exactly in the right place. In the D.I.Y.-SEO-Tutorial on Keyword Research you have learned how to identify the most important keywords of your industry and how to evaluate the average search volume. This new tutorial now explains how to place those keywords in the metadata and other invisible elements of your website.

Hire an SEO-Expert

Content overview

What is Metadata?

Metadata refers to mostly invisible elements in the source code of your website which contain important information for search engines. This includes the Meta Title (the title of the landing page) and the Meta Description (a description of its content), requirements for bots (so called robots that Google and other search engines use to monitor your site), as well as information on the website’s language and character set.

To view a website’s meta data, you can simply click the right mouse button in your browser and choose “view source code” from the context menu. The meta data can be found at the beginning of the source code.

This, for example, is the current meta data of my website’s frontpage:

Meta Title & Description
The meta data of

This tutorial mostly focuses on the elements meta title (<title>Your Title</title>) and meta description (<meta name=“description“ content=“…“>) because they are most important for SEO. Most of the remaining meta data will usually be generated automatically by the content management system.

SEO tip: To be able to set the meta title and meta description in WordPress, I recommend installing the Yoast SEO plugin.

What is the Meta Title and Meta Description?

The meta title and description are usually displayed as the preview-text when your website shows up in the search results:

A search result...
Meta Data in the Google search results

The meta title is the blue link-text in the search results. The meta description is – sometimes! – the preview below. Google generates the text-preview dynamically according to the search phrase. Hence it is possible that the preview-text differs from the meta description that you have set for your landing page.

In the metadata we communicate the keywords to Google and other search engines for which we want the website to rank. The aim is to squeeze all important keywords into the meta title and description, and to formulate them in a way that encourages people to click on the search result.

Step #1: Choosing the right Keywords for Your Meta Data

The evaluation and semantic map that we have created in the last D.I.Y.-tutorial is the basis for selecting the keywords for a landing page. The two most important factors are relevancy in regard to the search intention as well as the search volume. The deciding factor for your website’s Google rank is how much time visitors spend on your site – that is to say, whether they encounter what they have been looking for. In case of doubt, I advice to choose the more relevant keyword over the keyword with the highest search volume.

There’s hardly ever a perfect solution for keyword selection. I recommend to continuously monitor your SEO success with Google Analytics and the Google Search Console, and adjust the selection and emphasis of certain keywords when necessary.

Step #2: Formulating Meta Data

Once you have decided which keyword you want to optimize a certain landing page for, you can get started on formulating your meta data. The target is to find catchy formulations that don’t exceed a certain limit of characters or pixels.

You will find vastly different ideas about the character limit for the meta title and meta description. None of them are reliable. Actually, the perfect length of the meta title and description depends on pixels on the end device – for example, an H requires many more pixels than an I. The best way to assure your meta title and meta description are within the pixel-limit, is to use this tool:

The meta title should be displayed with a blue or yellow background. Then it is within the pixel limit. A red background means that the title is too long. The meta description should be displayed either white or yellow. The Yoast SEO plugin contains a similar function as the SERP simulator.

When you formulate your meta data the order of keywords is also important. Keywords at the start of your title/description receive more attention from Google than keywords towards the end. Hence the meta title should ideally start with the most important search phrase.

I recommend to always include a call-to-action in your meta description – e.g. “buy now”, “discover…”, “find out…” …

Moreover, it is recommendable to include the branding of your website / company either in the meta title or meta description.

Using special character in your title may help to stand out from your competitors. However, you have to be careful with such characters, because they will not always be displayed correctly in the search results. A prominent separator that always works is the • bullet point •

OG Data: Previews for Facebook and other Social Media

Today the meta data of many websites (including mine) also includes OG data. The OG data is used to set the preview-text and preview-image for Facebook and Twitter. Keywords are not that important in the OG data as they are in the meta title and description. The main aim of the OG title and OG description is to create as much interaction as possible whenever the link to your landing page is shared on social media. That being said: the OG data provides a good opportunity to push second-tier keywords.

In WordPress you can also set your OG data with the Yoast SEO plugin. If you don’t set the OG data, Facebook will automatically use the meta data for the preview.

Headlines, Link Titles, and other Elements

Other elements of a website that should include the most important keywords for SEO are the headlines (H1, H2, H3…) and the body text.

If you want to optimize your website in detail, you should also set the link title element. In WordPress, you have to use the HTML-editor to do that. Simply extent the <a href=“…“>-link element with the attribute “title=”your link title””. The text you but in place of “your link title” will be the preview-text that is displayed when someone hoovers the curser over the link on a desktop computer.

For <img>-tags you can also use the title attribute, and moreover the alt-attribute, which sets the alternative text that is displayed while the image is loading (or if it fails to load at all). All those invisible elements can be employed to boost certain keywords.

Besides the meta data and other invisible elements, the content and usability of your website is crucial for SEO success. You will find out more about that in the upcoming do-it-yourself SEO tutorial!

SEO for Small Businesses

Photo credit header picture: Kelly Sikkema (edited by J.C. Zeller)

Leave a Comment

Your email address will not be published. Required fields are marked *