HTML Title Tags Done Right

Tabbed browsing is an awesome thing. Websites that use the HTML title tag poorly tend to make it not so awesome. Some sites just kind of forget about the tag, others order the content incorrectly and don't even get me started about stuffing keywords. Anyway, let’s talk about making user-friendly title tag contents.

Probably the most frustrating patterns is when all of the pages on a site use the same title tag contents — usually the site’s name. It is not very frequently that you will see this, however sites built with frames usually exhibit this behavior. Imagine if this page’s title was iMarc. That would be awesome.

Second on the list is sites that don’t include the site name in the title. You’ll see pages with Contact Us and About. It gets real interesting when you have multiple tabs open with pages like that. Which About is the one I’m looking for again?

The most common mistake after sites get past the first two obstacles is incorrectly ordering the title. The most specific information in the title should be first. This matters much more once a user has drilled down into a site. Imagine a title like Example Site - About - Employees - John Smith. Most browsers will display the following in the tab: Example Site - About - Empol.... Which employee am I looking at again?

Here is the above example corrected, with most specific information to least: John Smith - Employees - About - Example Site. Browser tabs would tend to show John Smith - Employees - Abo.... Now I can figure out what tab I wanted to click on. I love it!

In closing, if you want to kick up the usability of your site when being viewed in a tabbed browser, be sure to add a favicon. Dan Cederholm will love it.