Bourn Creative

Transforming Businesses into Extraordinary Brands

  • Services
  • Portfolio
  • About
  • Praise
  • Start Your Project
Writing An Effective HTML Page Title
standard icon

Writing an Effective HTML Page Title

July 3, 2014 Jennifer Bourn

Yesterday I shared with you the importance of your page titles and meta descriptions and showed you some of the ways they are used. Today we’re going to focus on page titles and get into the nitty-gritty that makes them so powerful.

Creating powerful, client-attracting titles for each of your pages and posts is a low effort, high-impact search engine optimization strategy — as long as you use them the right way — and not a spammy way.

Understanding The Difference Between a Page Title And a Page Headline

A page title is NOT seen on your actual web page. It is an special HTML tag that can be seen in the code of your web page, in search engine results page (SERP) lists, in open browser tabs, and in browser bookmarks lists that is defined in the SEO settings for the page or post. A page title is a short, clear, compelling description of a web page or blog post that helps people and search engines figure out what the page is about.

A page headline is found in the content of your web page. It is the headline your visitor sees when they visit your web page and it is usually defined in HTML with the H1 (Heading 1) tag. The headline is defined in the content editor for the page.

What You Need To Know About HTML Page Titles

  • No two pages or posts should use the same title tag. Each HTML title tag should be accurate, relevant, descriptive, and concise, reflecting the focus and content of the single page it is written for. Otherwise search engines, visitors, and potential visitors could get confused.
  • Because it is often used for the link text in search results listing, the HTML page title is meant to give users and search engines quick insights into the content of the page. It is often the first piece of information seen by a prospective visitor when reviewing their search results and helps users determine which link they should click on.
  • The keywords included in your page title will appear bolded on the search engine results pages if they match the same keywords the user searched for. This makes it easier for users to determine if your web page is a good match for what they are looking for.
  • The title tag is an HTML tag that gets inserted into the HTML header of a web page or blog post

Optimal Title Tag Length

Previously, HTML title tags could be as long at 70 characters in length, with best practices saying you should keep it to about 60 characters. But with Google’s redesign things have changed. While the content width of the search results hasn’t changed, the font size for page titles has increased and it is using Arial, a proportionally-spaced typeface.

So what does that mean for you?

Proportionately-spaced means that every letter doesn’t use the same amount of horizontal space — so an “i” takes up less space than an “m”. Also capital letters take up more space than lowercase letters, and bold letters take up more space than non-bold letters. This means the character count isn’t consistent for every page title shown in the search results.

SEO Moz wrote a great post about this, stating that the new optimal page title length for search engines is about 55 characters. If you stick to this average character count, about 95% of your page titles will be displayed in full, with only 5% (1 in 20) of them getting truncated.

SEO Moz also reminds us that a cut-off page title isn’t the kiss of death — Google still processes keywords beyond the cut-off (including for ranking purposes). Plus, other formats, like vertical results and Google+, may still display your full titles.

HTML Title Tag Copywriting Tips

In my last post, explaining what titles and meta descriptions are, I showed you several examples of how they are used. Now it’s time to understand how to write a great title for your web pages and blog posts.

Here are a few tips:

  • The title should include your main/focus keyword
  • Use geographic or niche specific keywords in your titles whenever possible as long as they make sense
  • Your title should be interesting. Make potential visitors want to click your link when they come across your site listed on a search engine results page
  • Make sure it is relevant to the content on the page
  • Often sites automatically include their brand name at the beginning or end of their page titles, separated from the actual page title with a delimiter like a hyphen, colon, or pipe. If you are going to do this, we recommend putting your brand name at the end of your titles, this way important words aren’t the ones getting cut off. Just remember that your page title now just grew by that many characters in length!

If you’re writing an HTML title tag for a new web page or blog post and want to test the length in a search results simulator, SEO Moz provides you a handy title tag preview tool.

Things To Avoid When Creating HTML Page Titles

  • Don’t stuff keywords into your titles or use a list of keywords in your title — it’s spammy
  • Don’t write titles that are irrelevant to the content on the page
  • Don’t write really long titles just to fit more keywords in the title tag — again, spammy
  • Don’t use the same title on more than one page or post (This is a big no-no)

To quickly check and see if you’re using the same HTML page title on multiple pages or posts on your website, type site:yourwebsite.com into the search field of your web browser and hit enter. This will produce a list of all pages or posts on your website that are indexed with the search engines, and show you the page titles and meta descriptions of each.

How To Add An HTML Page Title To Your Web Page or Blog Post

By default, the Genesis Framework has SEO features built-in, but we highly recommend using the WordPress SEO plugin by Yoast. When installed on a Genesis WordPress site, the WordPress SEO panel simply replaces the Genesis SEO panel.

Below is a screenshot of the WordPress SEO panel and a sample title tag:

Screenshot of Yoast WordPress SEO plugin panel

Now What About You?

Did you know how important and effective HTML page titles are to your SEO efforts? Did you learn anything new you’re going to implement on your own website? Do you have any tips or insights to add that I may have missed? I’d love to hear your feedback in the comments below!

Related Posts

  • What Is Organic Search Engine Optimization / SEO
  • How to Optimize Website Content For Search Engines And People
  • How to Optimize Images For SEO
  • How to Optimize Links For Improved SEO
  • What Is An HTML Page Title And Meta Description?
  • Writing an Effective Meta Description
  • Why Keywords Still Matter In SEO
  • How to Optimize Blog Posts For Maximum Results And Visibility
Share on TwitterShare on FacebookShare on LinkedIn

Category: Search Engine Optimization Tags: SEO, WordPress, WordPress SEO

Subscribe To Our Blog & Never Miss A Thing

Sign up to get new our latest posts and announcements delivered straight to your inbox. Seriously, at this point, what’s one more email?

About Jennifer Bourn

Creative Director · Digital Strategist · WordPress Evangelist

As founder of Bourn Creative, Jennifer is an award-winning designer who has been working in the branding and design trenches since 1997. Today she consults on brand development, website strategy, and content strategy, works closely with clients on graphic design and web design projects with WordPress as her platform of choice.

When not immersed in client projects, Jennifer manages the Bourn Creative brand and our internal systems and processes. She speaks often on podcasts, summits, and at live events, and writes not only for our blog, but for several other websites, sharing her expertise on freelancing, client services, agency growth, blogging, marketing, and branding. Jennifer also co-organizes the Sacramento WordPress Meetup and is lead organizer for WordCamp Sacramento.

Discover What We Can Do For You

Have a project you think we'll like? Click the button below and tell us about it.

We love working with enthusiastic clients who are as passionate about their business as we are about strategy, design, and development. If that sounds like you, we should talk.

Start Your Project

Bourn Creative

  • Follow Us On Twitter
  • Like Us On Facebook

Copyright © 2023 Bourn Creative, LLC. All Rights Reserved.

Privacy | Disclaimer