The Importance of the Hypertext Document Title

The title is the element that identifies globally the document’s content. It is one of the most important contributors to a positive user experience for a Website’s visitors. Ironically, the title is commonly overlooked, or not considered, possibly because browsers don’t use the title within the document’s body.

This article explains where the document title is used and how, by following just a few guidelines, you can create useful titles.

Where to Use the Title

The title is used in various places within the browser interface, so it’s important that it’s properly defined. Some of the areas in which the title is used include:

  1. Bookmarks: Bookmarks allow the user to save the URL of an Internet resource. The user can visit the reference resource on future occasions by selecting the title, rather than needing to provide the URL to the browser.
  2. 1317_fig1

  3. Title Bar: Most graphical browsers display the hypertext document title in the upper area of the user interface.
  4. 1317_fig2

  5. Navigation Tabs: The user can access multiple resources through one browser instance. This type of interface design is known as Multiple Document Interface (MDI). The browser uses the title in the various navigation tabs to identify the different resources accessed in a given session.
  6. 1317_fig3

  7. Session History: Browsers provide at least two buttons that allow the user to move back and forward between the resources visited in a session. In addition to providing sequential access, these buttons display a list of titles that correspond to the resources visited. The user can select these to re-visit different resources.
  8. 1317_fig4

  9. Navigation History: Browsers store the URLs of resources and documents the user has visited. The title is used as to identify the URLs maintained in the navigation history.
  10. 1317_fig5

  11. Task Bar: The title is displayed in the operating system’s task list to identify the different browser instances the user might be executing at a given time.

1317_fig6

In addition to the different ways the browser interface uses the title, search engines perform the search operation by reading the title tag and looking for key words within the title and document body. In most cases, the search results are displayed using the title as a link to the hypertext document.

After reviewing how the title provides the user with a better browsing experience, you should have an understanding of how important it is always to carefully define the document title. The title should provide better usability in all contexts in which it is displayed.

How to Create Useful Titles

In order to develop useful titles, you need to employ logical sense and follow a few information design guidelines.

Short and Meaningful

The title should be at most 64 characters in length. Take into consideration that there is no rule for the acceptable title length, and that most browsers truncate the title. Using a short title will help the user to read and understand the title’s meaning.

Establish a Title Structure

You should establish a structure to define titles and use it consistently. Following are three examples for structure definition:

  1. Home Page: A company’s Website home page should include the company name. In addition, you could include a brief description of what the site is about.
  2. Example:

    • PC and Electronics
    • PC and Electronics — Computer and Electronics equipment at discount prices.

  3. Product Category Documents: When titling a product category document you should include the category name followed by the company name. Each word of the product’s name should start with an upper case letter.
  4. Example:

    • Portable Computers — PC and Electronics

  5. Product Description Document: The product description document should include the product name followed by the company name. Each word of the product’s name should start with an upper case letter and all words used in the description should appear in lower case letters.
  6. Example:

    • Toshiba Satellite 15" screen — PC and Electronics

The portion of the title that describes the document’s content could be placed at the beginning, following the normal reading process (left to right). This will allow the user to quickly obtain the description when reading or hearing, in the case of visually impaired users.

The main purpose of establishing a structure for title definition is to promote a better browsing experience while visiting Websites and accessing other resources through the browser.

What to Avoid

The guidelines described above do not guarantee that no errors will occur. Following is a list of things you should avoid including in your titles:

  1. Special characters: Special characters affect the key word search process. In addition, assistant technology for visually impaired users will read the title’s content literally. If a document contains the title: –::PC and Electronics::– the user agent will read "dash dash colon colon PC and Electronics colon colon dash dash." This would not be meaningful to the user.
  2. Using the same name for all the documents: Every time a user creates a bookmark, the browser will use the title as the bookmark’s name. If you use the same title for all your Web documents, it will be difficult for the user to identify the specific bookmark he wants to use. Also, search engines will display the same link text multiple times, for different pages o your site, causing more confusion to the user. Remember that using frames as a design mechanism limits the browser to the frame group document’s title. The browser will not use individual documents’ titles.
  3. Using the "untitled document" title: I don’t think people knowingly use this title, given the huge number of online documents that use it. Just make a search using your favorite search engine for the key word "untitled document", and you’ll be stunned by the amount of documents returned. "Untitled document" is the default title used by many tools used to create hypertext documents. You should change the default title before publishing the document. This is a good example of the common minimal importance given to the document title.

How to Test Your Title

You should test documents’ titles to determine their efficiency. Following is a simple but effective method to test whether the titles meet their purpose:

  1. Create a bookmark for each hypertext document. The browser will allow modification of the bookmark’s name. The browser will display the title of the document in context as the default name for the bookmark. If you need to change the name at the time of creating the bookmark, it means the title was not properly defined. Review the title until it clearly describes the document’s content.
  2. Have a group of users access the bookmark you created in the previous step. Before they actually access the bookmark, have them read the shortcut name and tell you what kind of information they expect to find once they access the shortcut. Pay close attention and write down what users tell you.
  3. Once users access the document, ask them if the information matches what they expected. Take note of the users’ observations.
  4. Review the results and annotations. If the results show that the information accessed didn’t match what the user expected, you need to redefine the titles and repeat the test until you obtain favorable results.

This iterative process will help you understand the users’ thought processes at the time of accessing a Website. Possibly what you think will be a descriptive title would not seem so descriptive to the user. By testing titles with real users, you would have begun to design using a different approach, known as User Centric Design.

Conclusion

Even though the browser does not display the title as part of the content, it is widely used in the visual interface.

The title is a unique identifier; therefore, great care should be taken in defining it. What would your impression be if you opened a book to its table of contents and find that all the chapters were named identically, though the references were to different pages? How would you be able to select the chapter you are looking for if they all have the same title?

Using ambiguous or redundant titles will lead to confusion on the part of the user, and make it more difficult for them to access the resources available on the Website. Take advantage of the advice provided here to ensure your site’s users know how to get to the information they want at all times!

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

No Reader comments

Comments on this post are closed.