SEO title tags: What are they and how to write them

SEO title tags: What are they and how to write them

Title tags are an important part of your on-page SEO, and when crafted thoughtfully, they can connect more people to your content.

SEO title tags: What are they and how to write them

Title tags are an important part of your on-page SEO, and when crafted thoughtfully, they can connect more people to your content.

No items found.
Written by
Webflow Team

The best way to think about search engine optimization (SEO) is by picturing your team collaborating with search engines to try to connect people to the right content.

To connect to the right people, you need to match your keywords to their search intent. To help search engines identify the right content for them, you need to make sure your technical SEO is accurate and complete.

One often overlooked element that combines both of these functions is title tags. However small and insignificant it may seem, a title tag is an important part of your on-page SEO. Your title tag will be the first thing that tempts a person to visit your page, so you should craft it thoughtfully.

What are title tags?

The title tag is the title for a page that is indicated in the HTML. It looks like this: <title>SEO title tags: What are they and how to write them</title>

A title tag is part of what is referred to as on-page SEO, along with the meta-description and URL. The title tag isn’t necessarily the same thing as the H1 title on your page. It needs to be shorter and more specific.

The title tag will be visible to users in a few different places. The title tag will show up as the clickable link on the search engine results pages (SERP). It will also be displayed on a reader’s browser tab, so they can tell what pages they have open. The title tag is also often used as anchor text when other websites link to your page and on social media links.

Why are title tags important to SEO?

Your title tag tells Google what the topic of the page is so it can show up in relevant search results. It is the first thing that shows up on the search engine results pages. The text of your title tag also forms the link users can click if they decide your page is what they are looking for.

Your title tags will tell both your target audience and search algorithms what your page content is about. When search engines understand what your page is about, your page will turn up on more and more relevant search engine results pages. When you show up in more relevant search results, your page will receive more traffic. When searchers accurately understand what your page is about, you will connect to more relevant audiences, increasing your brand awareness and potentially your number of conversions.

Title tags (along with meta-descriptions and alt text) are important for accessibility reasons. For people using screen readers (usually those with vision impairments), the title tag is the first thing the screen reader will read aloud. And not only is accessibility a good standard practice for any company, but it’s also another Google ranking factor.

How do you set title tags for a page?

If you are building a website from scratch, a title tag is set by simply indicating <title> </title> within your HTML for each new page. The title tag should go within the opening and closing <head> </head> tags at the top of your webpage.

When working with any sort of content management system (CMS) or website builder, you will need to familiarize yourself with where and how that system sets title tags. It may automatically set a tag when you create a page, but make sure to write your own tags for each page so they are optimized.

A snippet of the Webflow CMS, displaying the SEO settings, Title Tag text box, Meta Description text box, and a preview of the search result rendering.
In Webflow, you can set title tags in the SEO settings.

How do you write effective SEO title tags?

A good title tag needs to communicate the content of your page to both search engines and people. Your title tag should also match the search intent of the person who would be looking for your page. Make sure each word in your title tag conveys the most important and accurate information about what searchers will find on your page.

The title tag may be the same as your H1 heading on your page, but it will often be different. It may be shorter, more direct, or include your website, company, or brand name. What’s key is that it displays accurate and succinct information about your page, unlike an H1 title, which may be written more for emotional or creative impact.

To meet both the technical requirements and the needs of searchers, your title tag should have the following qualities.

Include a title tag

The first step is to make sure you actually set a title tag. It may seem obvious, but it is a surprisingly common issue. Similarly, don’t just go with default title tags; make sure to set an appropriate one for each page. If your title tag is missing entirely, Google will create a tag for your page using context clues, but one you craft with the searcher’s intent in mind will always be better.

Craft unique title tags for each page

Title tags shouldn’t be duplicated anywhere on your site. This will confuse search crawlers, negatively impacting your ranking, as well as confuse visitors. If you find that you have written duplicate title tags, it’s a good indicator that you need to be more specific with your tags so different pages can be identified from one another.

Make your title tags an appropriate length

The length of your title tag will significantly impact the searcher’s experience, though there is debate over exactly how much it impacts search engine results. Length is mostly important because Google only visibly displays the first 60 to 70 characters of a title tag on the search engine results pages.

Ideally, you should keep your title tag below 60 characters so people browsing can see the entire tag. Anything exceeding Google’s display length will appear truncated with ellipses, which is not as readable or appealing. Google may even rewrite title tags, especially if it’s too long.

You also don’t want your tag to be too short. A title tag that is just a few words long may not give enough context to the search engine or to searchers. It needs to give the context of your page in order to rank, not just indicate the general topic.

  • Too long: How to get great SEO results by understanding the SEO relevance and how to write excellent title tags.” This title would show up on the search engine results pages as “How to get great SEO results by understanding the SEO releva....” This title tag is far too long and will get cut off before anyone can read the keyword.
  • Too short: “Title tags.” This title tag, however, would be too short for this article. What is the page saying about title tags? It could be a how-to on writing title tags, a discussion of SEO, or just a simple definition.

Include your target keyword

Your target keyword should always be in the title tag. The keyword is what indicates the main topic of your page. Your primary keyword should be appropriate for the content of your page and should match the search intent of the person you want to connect to that page.

  • For example: If this article’s title tag was “What they are and how to write them” or even “Writing good SEO in HTML,” the key context of title tags won’t come across to search engines or readers.

Use framing words

Framing words give context on what information your page is providing about that content. Great framing words for a title tag are often questions or superlatives. These words might include:

  • How
  • What
  • Why
  • Best
  • Ultimate
  • Guide
  • Review
  • Roundup

Each of those words gives you a little more context about the type of information or article you might find in a link.

Include a brand name when content is brand-specific

A brand name is important to include in the title tag for home pages, landing pages, and product pages. It’s especially essential because people may be searching for your company specifically.

For blog posts and other types of content, your brand name might not be relevant and can be kept out of the title tag.

There isn’t a standard way to include a brand or company name in a title tag, but you should make it consistent throughout your site. It can come at the beginning or end of your title tag, separated by punctuation.

  • For example: “Webflow - How to write title tags” or “SEO title tags: what they are and how to write them | Webflow Blog” could both work.
SEO and Webflow: the essential guide

Get 13 need-to know tips on website SEO — whether or not you use Webflow.

Get SEO smart
SEO and Webflow: the essential guide

Get 13 need-to know tips on website SEO — whether or not you use Webflow.

Get SEO smart
Get SEO smart

Anatomy of a blog post page

It can be helpful to look at what title tags look like in practice to readers on your site and on search engine results pages. Let’s look at one of Webflow’s own blog posts as an example. In this case, the article is titled “22 inspiring web design trends for 2022.” Here’s how the article looks in a web browser:

A snippet of the top of a Webflow blog post titled "22 inspiring web design trends for 2022" in a Google Chrome browser tab.

In this case, we can see four important types of indicating text for the article: the URL slug, the title tag, the H1 on-page title, and an explanatory subheading.

  • Slug: web-design-trends-2022
  • Title Tag: 22 inspiring web design trends for 2022 | Webflow Blog
  • H1: 22 inspiring web design trends for 2022
  • Subheading: These 22 web design trends for 2022 will help inform and inspire what people build for the web. Dive on in.

Each of these is a “title” of sorts — they each give visitors and search engines information on what the article is about. Each element appears in a different place within the web browser, helping the user orient themselves or find your page within tabs. You can see that the title tag is mostly the same as the H1 title, but that doesn’t necessarily have to be the case.

If you right-click on the webpage and click “view source,” you can see the title tag in the HTML of the page. In this case:

HTML text written as <title> 22 inspiring web design trends for 2022 | Webflow Blog </title>

The other place the title tag appears is on Google search engine results pages. This article is actually the featured snippet for the keyword “Web design trends 2022,” so we’re able to see a little more information. Let’s look at how this page appears to searchers:

Screenshot of the featured snippet for "2022 web design trends" on the Google search results page, listing a blog post from Webflow called "22 inspiring web trends for 2022" and eight bullet points extracted from the headers in the article.

At the top is the search keyword, followed by the snippet. In this case, the snippet consists of the headers from the main article because the article is structured as a list.

Below the snippet is the search result where you can see that the slug and the title tag are the main things visible to the searcher. Together, they tell the person conducting a search exactly where they will go if they click on the link, and the link itself is the title tag.

Start generating site traffic with well-crafted title tags

By putting yourself in the end-user’s shoes, you can pack the right amount of information in the slug and title tag of your article or page that will draw people to click on a link from a search engine. And by taking the time to craft strong title tags, you’ll start generating more organic traffic, getting more people in front of your content.

Last Updated
June 13, 2022