That Standards Guy



Search

About

That Standards Guy is the online persona of Karl Dawson, a web developer living and working in Ipswich, England.

I'm a member of the Guild of Accessible Web Designers and the Web Standards Group and team member at Accessites—an awards site to recognise accessible and usable websites.

I specialise as a front-end developer and worry about the minutae of semantic (X)HTML and CSS, accessibility, microformats, typographic rhythm and grid design. I also care about the user experience and remind myself constantly of visitor site goals when working with clients and their aims.

That Standards Guy is proudly powered by WordPress using my own “StrictlyTSG v3.0” theme. Site Policies.

Stay up to date via the RSS feed. What’s RSS?

From the Top: The Title Element

Every web page must have a title element in the head section. In this, the fifth article in my series “From the Top” we start to describe a web document via elements between the head tags. This article is not a discussion on Search Engine Optimisation (SEO) techniques although the guidelines offered may help (and ethically so) in that regard.

The Title Element

Every web page must have a title element and it may contain two attributes, namely lang and dir. Titles may contain character entities for accented or special characters but not markup or comments. The text appears in the window title of the user agent.

Writing an Accessible Title

Whereas many people don’t read the window title, titles play an important role in bookmarking and finding the website in search engines. When a user bookmarks your website, the window title is used as the default bookmark name. Similarly, search engines will return the window title in search results and use it to determine relevancy with the search term. In order to be effective and useful (both for search engines and people), window titles should convey as much information as possible using the least amount of words.

  1. Begin with the information-carrying word. Don’t start with useless words like “Welcome” or articles such as “a” or “the”. I don’t want all my bookmarks starting with the word “The”. Their inclusion makes search results and bookmark collections less scannable.
  2. Begin with the subject of the page. This makes it easier to scan multiple windows, tabs or bookmarks and thus present the most important information first.
  3. Include the website or company name. Not only is this important for branding or qualifying the subject matter, distinction can be made between different websites talking about the same subject.
  4. Don’t include the top-level domain name. Unless this is part of a company name, such as “Amazon.com” it is an unnecessary word to include and creates an artificial distinction between a company’s presence on and off the web.
  5. Don’t separate the subject from the company or website name using odd characters that cause screen readers to say out-of-context things. Make sure you read (and listen) to Peter Krantz’ article: The sound of the accessible title tag separator. So long as you haven’t already used the character in the title, In the past I’ve recommended a dash, colon or vertical bar ( | ) as a separator as they seem either to have the least impact or have a widespread understanding or acceptance of their use.
  6. Ensure that there is white space on both sides of the separator.
  7. Try to keep the length down to seven or eight words and fewer than 64 total characters to ensure they remain scannable and display adequately in user agents. At least get the subject displayed in full.

Conclusion

Use of the title element is required. Start the title with the subject followed by a sensible separator surrounded by white space and then the name of your company or website (minus the top-level domain name). Never leave it as “Untitled document”…

Further Reading

Next in “From the Top”

A double-bill this week, be sure to read the previous article in the series: “The Head Element”. Next week we will take a look at the inclusion of meta elements in the head section of a web page.

The Complete “From the Top” Series

 

3 Responses to “From the Top: The Title Element”

  1. Another great article, well done! The W3C QA team have also published this tip about writing good titles.
    http://www.w3.org/QA/Tips/good-titles

  2. See this site for more information about Seo.

  3. Good stuff, Karl.