SEO Fundamentals: Guide to Title Tags, Meta Data and Headers

SEO Fundamentals: Guide to Title Tags, Meta Data and Headers

In SEO, The Digital Marketing Blog by Kelvin5 Comments

*Last updated – 18/10/22

In this post you’ll learn about some of the fundamentals of SEO, including:

  • Title Tags
  • Meta Descriptions
  • Headers

You’ll learn why each of them is an important part of any SEO strategy, and some best practices for optimising each of them.

But first, some background…

When you put together a webpage, you mark up the text using HTML elements.

Some of these elements can be very important for search engines’ understanding of the content of a page or website.

For example, Title Tags, Meta Data and Headers are all used by search engines to understand the content on web pages.

As such, reflecting your keywords in these elements of a HTML document makes them more machine-readable and understandable to visitors.

Google uses its spiders to read this text and puts emphasis on the phrases within these elements. Its algorithm then determines if the page is relevant for a particular phrase and decides its ranking position.

While editing Title Tags, Meta Data and Headers on their own won’t achieve top rankings for a web page, including the keywords that visitors search for within the appropriate markup remains a vital part of SEO.

The Title Tag and description are the best-known elements to searchers, while headings indicate sub-topics and aid readability.

Well written titles and other metadata can help to influence click-through rates (the % of visitors who see a title in the search results and click to your webpage) and high click-through is correlated with accurate, well written and descriptive metadata.

When used well together, these elements can enhance a webpage in search results and clearly indicate to both Google and visitors what that page is about.

Most modern content management systems provide discrete opportunities to create and edit metadata on a page-by-page basis and this can be done by a trained CMS user in-house or by your web development team. In most cases, HTML coding knowledge is not required.

So, now that you’ve got a bit of background knowledge, let’s dive into what each element is, and how you can optimise them to help with your SEO.

Let’s get started!

Title Tags

What is a title tag?

A Title Tag is an HTML element on a web page that specifies the title of the document. Title Tags are seen in search engine results pages (SERPs) to display previews for a given page, and are important both for SEO and social sharing.

Below is an example of how your Title Tag appears in the SERPs:

Title Tags will also appear at the top of your web browser and when sharing your content in Social Media and so it is important to optimise them not only for SEO purposes, but also to attract your user’s attention and improve click-through rates.

Title Tag Code Sample

<head>

<title> Optimised Title | Brand Name </title>

</head>

How to optimise a Title Tag?

  • Make it relevant

The title element of a web page is meant to be an accurate and concise description of the page’s content. It’s critical to both user experience and search engine optimization to optimise your Title Tag in relation to the pages content.

  • Keep it short

Google typically displays the first 50-60 characters of a Title Tag, or as many characters as will fit into a 600-pixel display. If you keep your titles under 55 characters, you can expect at least 95% of your titles to display properly.

Note that there isn’t an exact Title Tag character limit as different characters can vary in width. For example, the use of a pipe (|) might make more sense, character-wise than using a dash (-).

If the character limit is exceeded Google will show an ellipsis (“…”) to indicate the point where the Title Tag has been cut off.

  • Use Keywords

Title Tags are critical, so conducting good keyword research and applying it to all webpages is essential for SEO. One or two keywords phrases are usually the limit, per page with the optimal format being:

Primary Keyword – Secondary Keyword | Brand Name

Keep in mind that search engines may choose to display a different title than the one you provide in your HTML if your title is stuffed with keywords, or the title doesn’t match the search query. As such, Titles should be written to match your brand and the user’s search query.

To help with this stage, why not check our keyword research whitepaper, Mastering Keyword Research for top tips on getting it right.

  • Use unique titles

Each page on your site should have a unique title. Duplication issues will harm your website’s performance in SERPs and will send confusing signals to search engines, so it’s important to avoid duplication of titles across the site.

In case of paginated pages, duplicate titles can be avoided by adding the page number at the end of the title, but if there is no way to avoid them remember to use rel=”next” and rel=”prev”.

  • Include your brand name

Whenever possible, include your brand name at the end of the title. This will improve your brand awareness and, in case you already have a strong brand name, this could also improve your Click Through Rates. Remember that in some instances Google will include your brand name at the end of the title regardless, so why not make their job easier?

If you aren’t sure if your title tag will fit or want to see what it’d look like in search results, you can use Moz’s tool here.

Meta Descriptions

What is a Meta Description?

Much like a summary, Meta Descriptions are used to describe the page content within search engines. Like Title Tags, Meta Descriptions must be unique to each page and should be included in the “head” of every webpage.

Meta Description tags, while not important for search engine rankings, are essential in gaining user click-through from SERPs. They are your opportunity to advertise your content to searchers and let them know that the given page contains the information they’re looking for. While Meta Descriptions won’t be displayed in your web page. This is how the Meta Description appears in the SERPs:

Meta Description Code Sample

<head>

<meta name=”description” content=”Here is the meta description”>

</head>

How to optimise a Meta Description?

When writing Meta Descriptions, it is important to consider the following:

  • Use keywords in your Meta Description

Ensure that the Meta Description includes keywords that will match the user’s intent. In many instances search engines will highlight the keywords used by the searcher which are appearing on your Meta Description, making it stand out even more.

  • Make your Meta Description relevant and compelling

Create a compelling description that a searcher will want to click. Make sure what’s described is what the searcher will see on the page.

  • Create unique descriptions for every webpage

Make sure that each Meta Description is unique for that page and that no descriptions are duplicated through your site.

  • Keep Meta Descriptions under 160 characters

Meta Description should optimally be between 150-160 characters, any longer and the result will end up being truncated (…)

  • Monitor click-through rates in Google Search Console

Find pages with reasonable volume but low click-through rates. Revisit these pages and optimise the Meta Descriptions and keep testing them.

  • Ensure all pages have a relevant Meta Description

If a meta description tag has not been included on a page, Google may pull through what it thinks is a relevant piece of text into the description. This results in a lack of control and sometimes can negatively impact click-through. Avoid this by following the guidelines above.

Heading Tags 

What are Heading Tags or H Tags?

HTML Headings are tags placed on a web page to indicate the headings that break down the content.

Heading tags aid search engines in discovering the relevant topics covered by a page and helps to break pages into logical chunks, making them easier to read or scan by visitors. Essentially they break out headings and subheadings on a page.

The HTML headings can be broken down into the H1 or main heading and then different subheadings (H2, H3, H4…)

Code Sample for heading tags

<h1>Page heading</h1>

<h2>Section heading</h2>

<h3>Section subheading level 1</h3>

H1 Tag best practice

H1 Tags, much like Title Tags, attempt to describe the purpose and content of any page to search engine spiders and users. Here you can find the best practice for H1 optimisation:

  • One H1 per page

There should only be one H1 tag per page.

It will typically be the page or post’s title and should make the content of that page clear whilst including the primary keyword. The H1 tag could include the same key phrase as the Title Tag and URL of that page.

  • The H1 tag should be unique

Not only should you have one H1 tag on each page, but this tag should also be unique when compared to all others on the site. Avoid duplicate H1s as it could send confusing signals about which page to rank for those keywords.

  • Include H1s on every page

You should ensure there are visible optimised HTML H1 tags on every page.

Not having H1s is a missed opportunity to let your readers and robots know the purpose of the page.

How to use the other H Tags

Following a H1, you should then use H2’s as the primary subheadings, with H3’s-H6’s forming the rest of the sub-headings.

H3’s etc. should be used to break content up into categories and sub-categories.

In this case it’s ok to have more than one H2 or H3 on your page. It actually helps to break down your content and your readers will appreciate it.

For example:

<h1>Example Headline</h1>

     <h2>Example heading</h2>

          <h3>Example sub-heading</h3>

     <h2>Example heading 2</h2>

          <h3>Example sub-heading 2</h3>

               <h4>Example 2nd sub-heading</h4>

H2s are used to break down your content in different sections. In this case you could use synonyms of your main keyword or simply keep it relevant with the rest of the content on the homepage. Remember that you are writing for humans, not robots. Having duplicate H2s, H3s… is not that big of a deal, so if it makes sense with the context of the page, go for it!

Although less important in terms of SEO, utilising heading tags as a way to visually separate and categorise on-site content is a great tactic when it comes to providing a high quality user experience and increasing conversions.

What about Meta Keywords?

Back in the 1990s webmasters used the keywords meta tag aggressively to rank for keywords. As a consequence, Google dropped it as a relevancy signal for ranking completely.

As such we recommend not using the keywords meta tag.

Increasingly good Title Tags, Meta Descriptions and titles are a given, but it still amazes me how many websites investing in SEO that haven’t reflected the search queries of their potential customers in these key HTML elements. So by getting it right you’re setting yourself up for a successful campaign.

If you’d like to speak to us about how we can help with your SEO or onsite optimisation, give us a call on 01273 733 433 or fill out the form below and we’ll get back to you as soon as possible: 

Contact Us

  • This field is for validation purposes and should be left unchanged.

Comments

  1. Thanks for the advice. Interesting to see you recommend using a vertical bar (|) before the brand name, as in Barbecues | John Lewis (though their example is slightly different to your advice). I have read elsewhere that it’s better to use a hyphen (-) as in Barbecues – John Lewis. From a usability point of view I think the – is easier to read. But would be interested to hear your thoughts?

  4. Author

    Habbit more than anything 😉 Think well if you’re essentially using a bit like a breadcrumb

  5. A very useful article to read.I feel that web development team also has a major role if you are doing the seo for a website. A professional and innovative web development team will certainly helps us to rank higher in the SERP. Thanks a lot for sharing this.

Leave a Comment