Better, more user-focused, web page titles
I adore WordPress. However, the default install, and most themes, seem to come with default Page Titles that look something like this (I’m using my titles, as an example, yours will be different):
Laird Farquharson » Blog Archive » Page Title
The PHP code to generate this looks like this:
<?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> » Blog Archive <?php } ?> <?php wp_title(); ?>
This looks fine, but I have some issues with this for a few reasons. When all your titles are listed one after the other, they become hard to read, since the beginning of every link is identical (site title, blog archive, page title). This is very common to those that read your blog via RSS readers, or anyone that simply bookmarks more than one post. So, generally, when the Page Title comes after the Site Name and Section Name, it’s hard to read when listed. I generally recommend (not just for blogs) that we put those key elements in our Titles — Page Title, Section Title, Site Title — in that order. This way, when humans read your site’s list of pages (via an rss reader), or bookmark more than one page, your page titles become easier to read and consume.
Above is an example of bookmarks when the Site Name is used first (I love globeandmail.com, but this is a small issue). When looking at this list, the most important item you want to choose (the individual title) is not the left-most element, so it’s harder to choose and digest.
Also, for windows users, the page title shows in the taskbar:
This image shows the “good” version, where the individual page title is at the left-most part of the page title. So, if we used the wordpress default, “Site Title » Section » Title”, it’s very hard to see the page name in this short, and truncated, page title.
SEO people agree with me. The general consensus is that ordering page titles from most detailed to more general is better for SEO too, (but refer to my prior post on SEO. This is yet another example of why we should make these “SEO changes” because they’re good for users, not because they’re good for Search Engines. We should be HO experts, remember — that’s Human Optimization — LOL)
Here is an example of the PHP code I currently use to generate my wordpress titles:
<title><?php if (is_home () ) { bloginfo('name'); echo ' - Blog Home' ;}
elseif ( is_category() ) { single_cat_title(); echo ' - ' ; bloginfo('name'); }
elseif (is_tag() ) { single_tag_title(); echo ' - ' ; bloginfo('name');}
elseif (is_single() ) { single_post_title(); echo ' - ' ; bloginfo('name');}
elseif (is_page() ) { single_post_title(); echo ' - ' ; bloginfo('name');}
else { echo trim(wp_title('»',false), '» '); } ?></title>
Basically, this says:
- If it’s the home page, I use my Blog Name (as found in the setup)
- If it’s a category page, use the category name plus ” – ” then the blog name
- If it’s a tag page, use the tag name plus ” – ” then the blog name
- If it’s a single page or post, use the post title plus ” – ” then the blog name
- Finally, I strip out the silly French Right Quote (the » character) that is added by default to separate the elements
