How to use the title tag
I think this is something big, that every site should be aware of. Think about how to use the title tag! I’ve seen so many websites doing this wrong, so I want to explain the method which is in my opinion the best.
Why is <title> important?
You have to see where title appears, in order to know how important it is.
Title Bar of the browser
That’s the only thing where title plays a role – for some IE-only users and webmasters. Most people focus on this, and therefore titles can be very long.
Task Bar
This is very much related to the title bar of the browser. You expect every program to have the same title in the title bar and in the task bar.
Tabs
Since nearly every browser uses tabs for comfortable navigation, this becomes more and more important.
These where important locations where a title is displayed when you actually visit the page. But there are more.
Recent pages
You can’t go back only one page. Most browsers show you a list of recently viewed pages, click on a title to jump back to that page.
Browser history
See which sites you browsed last week.
Bookmarks
Bookmark pages you like. Normally, the title tag will become the bookmark title.
ScrapBook
The ScrapBook extension stores your pages on your local hdd and you just have to click on a title to view it. The title is important here, too.
Search engine rankings
Have you thought of that? The title appears in the search results!
The correct format
Now that you have an idea where the title tag appears, it comes to the right format.
This is most important. Think about the correct structure and how the visitor will have a benefit from it. As you know now, the title appears nearly everywhere.
The primary information comes first. Not just because you read it first, no. Have a look at the screenshots above. If the titles would be longer, you just wouldn’t get all the information you want. That’s the big mistake. So don’t put the website title first.
Example:
Yeah, excellent. I’m on CNN.com – but what was where? Until you click through the tabs or wait for a tooltip to appear, you simply have no idea.
That directs me to the following:
The primary information is the document title, not the website title. Then you can add secondary information, like the category, and finally you can add your website’s title.
The title for a blog article would look like that:
Example Article | Category | Blog name
Unfortunately, many websites are doing this wrong, even the ones following web standards. I think there should be a standard for title tags.
What you can do to improve your titles
Follow the guidelines above :-)
Well, additionally you can search for your site at Google. Are you satisfied how your pages turn out? Are the titles clear and easy to understand? Could someone else understand what the document will be about?
Then bookmark your own page or open it in multiple tabs and ask yourself the same questions.
12 Comments on “How to use the title tag”
Leave a comment
Your e-mail address will never be displayed.
Pingback by
andrea's journal » Website Titles
2005-2-15
6:45 pm
[...] under Web Development @ 1:45 pm
Julian Bez has an interesting article today about how to use the title tag. Besides showing various screenshots of places where [...]
Posted by
Joe Clark
2005-2-15
10:54 pm
If somebody could tell me how to edit my template and various hocus-cadabra/abracapocus PHP files in my WordPress, I would have my title information in the correct order. It bothers me, too.
Posted by
Julian
2005-2-16
12:33 pm
@Joe Clark:
You could change the titles by editing “template-functions-general.php” in the “wp-includes” directory. Look for a function called “wp-title” and then for the comment “// Send it out”.
That’s what the part of my file looks like:
// Send it out
if ($display && isset($title)) {
echo "$title $sep ";
} elseif (!$display && isset($title)) {
return "$title $sep ";
}
$title is the title and $sep is a seperator you can define in the WordPress index.php file.
Posted by
Mstyle
2005-2-19
9:13 pm
Nice article. I have even posted an extra thing related to title to the Mozillazine. I think it would be even better if we could do:
<title>sitename</title>
<subtitle>extra description</subtitle>
The advantage: If you run a site with articles and such you could use just the title and put everything inthere. However if you have a site where the sitename is important, but the extra info might change from time to time you could use subtitle to do so. Also would this make a decent way to bookmark sites, instead of ‘title- welcome to our website, hope you enjou etc…’ it makes for ugly bookmarks.
So i’m not quite done by how it should be implemented but i know it has the benefits if used/implemented right.
Posted by
Julian
2005-2-19
9:27 pm
I think we don’t need something like <subtitle>. If everybody would care about usability, and put the title elements title in the right order, there would be no problem.
Posted by
Joe Clark
2005-2-20
11:05 pm
Julian, that didn’t work for me. I’ll need a better explanation, if you’ve got it. joeclark at my domain.
Posted by
Mike Mariano
2005-7-19
6:41 pm
Julian,
I second Joe’s request; thanks for your article and follow-up comment. I was trying to achieve similar results by creating a new Wordpress template, but that required me to go into The Loop in
header.phpmerely to hack together a makeshift title. Your solution would affect all templates, but that’s not necessarily a bad thing.There’s one drawback to putting the document title ahead of your site title: you may not be able to see the site title in Google. Observe. Right now, part of my overly long post title is not displayed, but with your method my site title would disappear. Overall it’s no big deal—the post title is more important—but just think of how panicked greedy Search Engine Optimizers would be!
Posted by
Kryz
2005-8-15
9:04 am
Thanks for this eye-opening article! I’ll have to change a bit in my home-cooked blog, but this will definitely be implemented in the new version.
Posted by
Frank
2006-6-8
12:09 pm
Thanks, this is pretty helpful. Until now I only watched out to have the most common info in the title, yet not in a particular order like described above.
Pingback by
Wordpress titles - two seven
2007-2-15
5:37 am
[...] How to use the title tag. [...]
Posted by
Chris Beale
2007-3-15
7:38 pm
If your putting together a title for an online retail store, what would you want to do as far as listing items in your tittle? What would be the proper format.
Thanx
Posted by
Nial Fuller
2009-11-5
7:27 am
I have used the tried and tested , site name and site author title tags for 2 years and my traffic is ace.