What is a Title Tag?
A title tag is an HTML element that specifies the title of a web page. Title tags may be displayed on search engine results pages (SERPs) as the clickable headline for a given result.
They are essential for usability, SEO, and social sharing.
Title Tags should be located within the “Head” of the web page:
<!DOCTYPE html>
<html>
<head>
<title>HTML Title Element goes here.</title>
</head>
<body>
<p>The main content of your page goes here.</p>
</body>
</html>
How are Title Tags used?
Title tags are a significant factor in helping search engines understand your page’s topic.
They are also the first impression many people have of your page.
1. Search Engine Result Pages
Your title tag may be displayed in the Search Engine Results Pages (SERPs) as the main title link leading to your web page. As such, it is often your visitor’s first experience of your website. You will want to create a great title to entice visitors to your site.
You can see an example below:
![A screenshot showing the title element in the SERPs](jpg/title-tag-serps.jpg)
2. Influence your Google Rankings
The title tag is a Google Ranking Factor. In January 2016, Google’s John Mueller said in a Webmaster Office Hours Hangout:
Titles are important! They are important for SEO. They are used as a ranking factor. Of course, they are definitely used as a ranking factor, but it is not something where I’d say the time you spend on tweaking the title is really the best use of your time.
You can read more about how Title Tags affect your SEO rankings here.
3. Show in the Web Browser Title Bar
Your title tag will be displayed at the top of your web browser. It allows users to quickly identify the content of the pages when browsing using multiple tabs. As space is limited, you should ensure that the most critical keywords \ keyword phrase is at the beginning.
You can see an example below:
![A screenshot showing the title element in the Browser Bar](jpg/title-tag-browser-bar.jpg)
4. By external Websites & Social Media
While Facebook and Twitter use their own meta tags, such as Open Graph, many third-party websites will utilize information from the title when posting to social media.
You can see an example below:
![A screenshot showing the title element in Social Media](jpg/title-tag-social-media.jpg)
SEO Title Tag Length
In this section, I look at how the title length has changed over time. Keep reading until the end of this section, as the latest changes in September 2019 caused the average title length to be just 51 characters.
The number of characters you can use in your title tag can vary. Here is a list of some of the factors that can affect title tag length:
- Wider letters take up more space - Letters such as “i” take up less space than “w”.
- ALL CAPS take up more space - Words such as “AND” take up more space than “and”.
- Width varies depending on the search query - Because Google now boldens the search query, and bold letters take up more space, a longer search query would also take up more space.
- Truncation - When a Title is “cut off,” it is appended with “…”. This means truncated titles show even fewer characters.
Dr. Peter Meyers, at Moz, analyzed the title tag lengths after cutoff back in March 2014. The title lengths ranged from 42 to 68 characters. You can see the distribution of title cutoff lengths below:
![Distribution of title tag cutoff lengths.](jpg/title-tag-ranking-factor-length-cut-off.jpg)
In 2014, when Dr. Meyers carried out the analysis, the best practice was to keep it under 512 pixels in width, around 55 to 60 characters. However, Google continually tweaks the title lengths in its search.
Even though this information is outdated, the graph is still helpful in conceptualizing how the lengths of titles vary significantly.
Title Tags length changes - May 2016
On May 11, 2016, Jonathan Jones reported that Google increased the width of their organic search results. This had an immediate impact on the width of title tags.
The width of the titles in the SERPs changed from 500 pixels to 600 pixels. This equates to around 70 characters before Google will truncate the titles with ellipses.
Mobile Title Tag changes - May 2016
Around the same the changes were made on May 11, 2016, the Mobile Title tag length increased to about 78 characters.
How users will differentiate between mobile and desktop search title tags remains to be seen. The safe option is to go for a shorter length. For websites with the majority of their traffic on mobile, it does give the more extended title as a credible option.
Title Tags length changes - September 2019
In September 2019, Mordy Oberstein noticed that Google had dropped the character count of titles in its search results by 4-5 characters.
This means that the average title length in Google Search is now just 51 characters.
![Title Tags length changes - September 2019](jpg/rankranger-serp-title-lengths.jpg)
It should be stressed that this is just the average title length. Some titles will be longer, some shorter. At least, though, you can use it as a guide.
Title Tag Best Practices
1. Keep your title length within 60-65 characters.
While the average title length is now just 51 characters, I would not worry about going over that. Google may show more depending on the title’s relevance to the search query and the characters’ width.
Make sure your most important keywords are at the beginning of the title so that the critical information is visible if it is cut short.
I try to stick within 60-65 characters, with all the essential information within 50-55 characters.
2. Keep it short, descriptive, and relevant to the page content
Matt Cutts gave some advice in April 2014 about how to craft your title tag. He said that if you want your title to display as intended, then you should ensure that:
- It is relatively short.
- Is a good description of the content and, ideally, the website URL.
- And that it is relevant to the query.
If you don’t adhere to this, Google may use an alternate title. This may be from content on your page, anchor text pointing to your page, or the Open Directory Project. As this information is approaching two years old, it is unclear whether this is still the case.
You can view the full Matt Cutts video below:
3. Separate Words or Phrases with either a Hyphen “-” or a Pipe “|”
Many websites will have multiple parts in their titles. A typical example is adding the website name as a suffix, separated by a pipe or hyphen.
In a video dating back to September 2009, Matt Cutts confirmed that both Hyphens and Pipes are viewed as title tag separators.
You can view the whole video below:
The following are some suggested Title Element formats you may wish to consider:
- Primary Keyword - Secondary Keyword \ Category | Brand Name
- Primary Keyword - Click-through Optimization Phrase | Brand Name
- Primary Keyword - Current Month Current Year | Brand Name
Google’s SEO starter guide reinforces this approach:
The title for your homepage can list the name of your website/business and could include other bits of important information like the physical location of the business or maybe a few of its main focuses or offerings.
4. Avoid keyword stuffing
Besides looking unnatural and providing a bad user experience, keyword stuffing can cause an algorithmic penalty that can hinder your rankings.
Furthermore, Google has made significant strides over the past year or so in understanding the user query and associating words with a similar meaning to the query.
5. Don’t duplicate titles over multiple pages
Google tries to provide its search users with unique and valuable content. As such, you should try to give each page a unique title.
Google’s SEO starter guide says that you should “Create unique titles for each page”:
Each page on your site should ideally have a unique title, which helps Google know how the page is distinct from the others on your site. If your site uses separate mobile pages, remember to use good titles on the mobile versions too.
The guide says you should avoid “using a single title across all of your site’s pages or a large group of pages.”
Modern CMS, especially WordPress Yoast Plugin, allow titles to be create automatically using various template variables. This should allow you to automate the generation of titles at scale.
Some good examples of titles that can be created using variables are as follows:
- Primary Keyword - Secondary Keyword \ Category | Brand Name
- Primary Keyword - Click-through Optimization Phrase | Brand Name
- Primary Keyword - Current Month Current Year | Brand Name
When automating titles, pay particular attention to the title length and my next point about putting the important keywords first.
6. Put important keywords first
There are a couple of reasons to put the most important keywords at the beginning:
- Google gives greater weight to keywords placed at the start of the title tag.
- The space available in the title bar and tabs at the top of the browser window is limited.
- The most important words are less likely to be cut off if you exceed the 600-pixel width limit.
- A usability study carried out in 2009 indicated that the users might scan as little as just two words of a headline.
7. Maximize Your Click-Through-Rate
If you just wrote a bunch of keywords, you may end up with an uninspiring title. The result you are trying to achieve is to drive high-quality traffic to your website.
While keyword optimization is important for SEO, it wouldn’t mean much if they didn’t click through to your website.
Some good examples are as follows:
- 16-inch pizzas - Free Delivery in London | Pizza Palace
- Cheese Pizzas - Hungry? London Delivery within 20 min
As you can see in these examples, the keyword is at the start of the title tag, but we also try to provide something to entice the user to click through to the website.
A quick search for London Pizza Delivery, a highly competitive term, shows companies are putting this into practice:
![Maximize CTR rates with title tags.](jpg/maximise-ctr.jpg)
8. Leverage branding
Adding branding to the end of your title tag is a widely used technique that helps businesses reinforce branding to their potential customers. Branding also helps to attract repeat customers, so it helps if the brand is marked on the search results.
As we have previously mentioned, Google may rewrite weak titles. Often, Google will append your brand automatically to the end of your display title.
Why the search result title might differ from the page’s Title tag
Google uses many sources to represent the title of your page in the search results, such as your title tag, publicly available information, or schema markup.
While you cannot force Google to use your chosen title, it will help to follow the best practices I have outlined in this article.
You may also wish to consider the following:
Your title contains too many keywords (stuffing). If you try to stuff your title with keywords, Google may rewrite it.
Your title doesn’t match the user’s search query. If the user searches for a term not represented in your title, then Google may rewrite the title. It may, for example, choose to highlight some text from within the web page.
You have an alternate title. If you have an alternate title, heading, or meta, and if that better represents the searcher’s query, then Google may choose to use that instead.
You have an old DMOZ listing. Search engines may pull a title from DMOZ (Open Directory Project). You can prevent this by using the Robots NOODP tag:
<meta name="robots" content="noodp">