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

In SEO, The Digital Marketing Blog by Kelvin5 Comments

*Last updated – 25/04/2017

In this post you’ll learn about:

  • Title Tags, Meta Descriptions & Headers
  • Why they are important
  • Best practice for optimising each of them

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. Title Tags, Meta Data and Headers are used by search engines to understand the meaning of web pages and determine if they are relevant for a particular search query.

Reflecting keywords in these elements of a HTML document makes them more machine readable and understandable to visitors. Google uses its spiders to read text this text and puts emphasis on those phrases within these elements and then its algorithm determine if the page is relevant for a particular phrase and then 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 visitors search with in the appropriate markup remains a vital part of SEO. Well written titles and other meta data influence click through (the % of visitors who see a title in the search results and click to your webpage.) High click through is correlated with accurate, well written and descriptive meta data.

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.

Search engines place more relevance on elements your marked up HTML than others. The title tag and description are the best known elements to searchers while headings indicate sub-topics and aid readability. 

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

Most modern content management systems provides discrete opportunities to create and edit of meta data on a page by page basis. This can be done by trained CMS user in house or by you web development team. In most cases, HTML coding knowledge is not required.

Title Tags

In your HTML you title looks like the following

Code Sample


<title> Primary Keyword – Secondary Keyword | Brand Name </title>


Title tags define the title of a 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.

The title element of a web page is meant to be an accurate and concise description of a 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. It creates value in three specific areas: relevancy, browsing, and in the search engine results pages.

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 isnt 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 (-).

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.

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

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

Primary Keyword – Secondary Keyword | Brand Name

To help with this stage, why not check our keyword research whitepaper, Mastering Keyword Research for top tips on getting it right. Key points that need to be considered are:

  • Create unique title tags for every page based on keyword research
  • Target one or two phrases maximum per page
  • Write naturally for visitors and avoid keyword stuffing
  • Keep within character limits
  • Include brand name at the end of the title if there is space

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


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

Much like a summary, Meta descriptions are used to describe the page content within Google. Like title tags, meta descriptions must be unique to each page and should be included in the “head” of every webpage. 

Code Sample


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


Meta description tags, while not important for search engine rankings, are essential in gaining user click-through from SERPs. They’re your opportunity to advertise content to searchers and let them know that the given page contains the information they’re looking for.

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

  • Use keywords intelligently, but also 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
  • The description should optimally be between 150-160 characters, any longer and the result will end up being truncated (…)
  • Monitor click through rates in Google Webmaster Tools and find pages with reasonable volume but low click through rate. Revisit these pages and optimise them
  • 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

This is how the Meta Description appears in the SERPs


Heading Tags 

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

Code Sample

<h1>Page heading</h1>

<h2>Section heading</h2>

<h3>Section subheading level 1</h3>

H1 Tags, much like title tags, attempt to describe the purpose and content of any page to search engine spiders and users. There should only be one h1 tag per page and this tag should be unique when compared against all others on the site. It will typically be the title of the page or post 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.

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

Followign 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.

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>

H2’s should typically include synonyms of the primary keyword.

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.

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 onsite optimisation, fill out the form below and we’ll get back to you as soon as possible: 

Contact Us

Related Posts Plugin for WordPress, Blogger...


  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?

  2. Author

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

  3. 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