Meta titles
A "meta title," also known as a title tag, is an HTML element that defines the title of a webpage and is displayed in search engine results pages (SERPs) and browser tabs, helping users and search engines understand the page's content.
SEO experts place great importance over the meta title as it is included in Google’s algorithm as a ranking factor as well as being displayed on the search engine results page.
They are also essential for screen reader users as the meta title is the first thing read by a screen reader, which allows a screen reader user to quickly validate that they are on the correct page.
So, a carefully crafted meta title goes a long way.
Does my meta title need to match the page title?
No. They don't need to be identical, but they should be consistent and accurately reflect the page's content.
The meta title affords you the opportunity to expand on the page title which you may want to keep more succinct.
A few when crafting a meta title
- Keep your title tag concise between the ideal 50 to 60 characters
- Include the most important information at the beginning as, the search engine results might only show the first 120 charactersUse descriptive language in your title tags helps readers and search engines better understand the context of the webpage
- Use symbols like “&” instead of “and” to save space
- Do not use capital letters as it makes the title harder to read
- Start with a verb if possible, for example ‘Find out’, ‘Read’ or ‘Get’
- Only include your brand name if it is necessary
Should I include the site name?
On that last point, it use to be common practise to include the site/brand name to the title tag — usually separated with a | pipe character.
As Google now included the site name separated on its own line, this practise it deemed unnecessary. It also uses up important character space which could be used for a more descriptive title.
If you feel you must included it then place it at the end of the title to avoid a screen reader announcing the brand name first on every visited page. As the brand owner you may think this is good, but you wouldn’t say that if you used a screen reader.
Single Page Applications (SPAs)
Where various distinct pages/views are all served from the same URI and the content of the page is changed dynamically, the title of the page should also be changed dynamically to reflect the content or topic of the current view.
Paginated listing pages
One area you do want to include additional information to the title tag is on paginated pages. For example, a news listing page that the user navigates between multiple pages to view the next set of listed entries.
The meta title for these pages should be crafted to include the page number, but omit it on the first page. For example
You may consider placing the page numbering at the beginning of the title; however, you also need to consider that this will potentially be displayed on SERPs so this may be less desirable.