Choosing the Best Title Separators
Published Wednesday, July 30, 2008 @ 10:01 am • 15 Responses
While writing my previous article on creating the perfect WordPress title tags, I deliberately avoided discussing the use of separators in titles. I feel that the topic is worthy of its own article, enabling a more thorough exploration of the details. Title separators are the symbols, punctuation, and other characters used to distinguish between various parts of the page title. For example, a title may include the blog name, post title and blog description, with each element separated by a hyphen. Any Google search will reveal that some of the most commonly used title separators include the hyphen, the dash, and angled quotes. Many others are used as well, and we will explore some of them in this article.
To get a feel for how other sites use title separators, let’s look at the titles of a few “high-profile” web pages:
- Google Directory - News
- Yahoo! Search - Web Search
- NPR : National Public Radio : News
- WordPress › Blog Tool and Weblog Platform
- WordPress.com » Get a Free Blog Here
- Politics and Political News | Reuters.com
- MySQL :: MySQL Downloads
- PBS KIDS . Games
Quite a variety, certainly, but you have to dig through the search results to see it. It seems that a majority of websites use the simple hyphen for multi-part titles. This is fine for titles with two components, such as those shown above, however for three or more components, hyphenated titles appear a bit homogeneous and slightly tedious. To see this, have a look at these imaginary examples:
- Mystery Blog - Pancakes, Chickens, and Vodka - Behind the Scenes - Archives
- Am I too old to drive a car? - Deep thoughts for geezers - Geezer Blog - Archives
- How to Rank for Clam Store in Google - SEO God - Manny McMillionz - Articles
These are ridiculous examples, yes, but they certainly make the point: hyphens are quickly over-used, especially when also appearing within title words and phrases. Even worse, many browsers add an additional hyphen between the page title and the name of the browser:
Mystery Blog - Pancakes, Chickens, and Vodka - Behind the Scenes - Archives - Mozilla Firefox
Yikes! Pretty scary stuff. The purpose of each of these title elements may not be clear to the average user. To improve the structural and semantic clarity of such titles, we might inject an alternate character or two. Instead of using hyphens after every title element, we could use a more distinctive character such as the bullet ( • ) or vertical bar ( | ) to distinguish the main title of the article from the other title elements. Then, after dropping unnecessary phrases, employing additional separators further enhances visual interest and title structure. Here is one way of sharpening the appearance of the previous examples:
- Pancakes, Chickens, and Vodka — Behind the Scenes « Mystery Blog Archives
- Am I too old to drive a car? • Deep thoughts for geezers • Geezer Blog Archives
- How to Rank for Clam Store in Google | SEO God : Manny McMillionz
The possibilities are endless. When used intelligently, separators bring structure and clarity to your page titles. The key is to choose characters that facilitate usability while enhancing the aesthetic quality of your titles. From an SEO perspective, the sequence in which title elements appears is an important ranking factor. Placing your post title information before other title elements increases page relevance in the search engines. Then, eliminating unnecessary elements such as page type and blog tagline improves readability and keeps the focus on the essential:
- Dark Knight Review – More Popcorn Please
- Another WordPress Update « Jumping for Joy
- Presidential Politics | World First News
Of course, with many blogging platforms, unique titles may be generated for different page types. With WordPress, for example, different titles may be created for each of the following page types:
- Home page
- Tag archives
- Search results
- 404 error pages
- Individual pages and single posts
- Archived post, date, category, and author pages
While the home page typically displays the blog name only, you may also want to include your site’s description:
Dropnine ~ Technology Blog
For tag archives and search results, title elements can be separated by more than single characters:
- Dropnine's Tag Archive for "Hamburglar"
- Search for "Chimpanzees" at Dropnine
Here, we are using actual words to join the different parts of the title. This may not work for all page types, but for certain pages such as the 404 error page, it seems worthwhile:
The Requested Resource was Not Found at Dropnine
Nice, clean and simple. Here at Perishable Press, I am a big fan of bullets. I have been serving bullets, so to speak, for the past year or so, and just love how it makes my page titles “pop” in the search engine results:

Title bullets bring a sense of solidity and permanence to the title. As you scan through a list of search results, title text appears mostly the same, leaving separators and other decorative characters to distinguish titles and grab attention. Decorative characters, when used properly, add a touch of flair and originality to your titles. I have seen many good (and bad) examples of this:
* Design Netwerk *$$$ T "money" Dollaz $$$^ ^Maddie^ ^'s Blog on Shine
These results don’t always make it to the top of the pile, but when they appear, it is hard to ignore them. These examples also demonstrate the effectiveness of underused and underrated characters. There are many visually interesting characters available from the keyboard; why the hyphen remains so popular is a bit of a mystery. For example, consider the humble bracket. Square brackets are extremely practical and serve well in many title configurations, for example:
- Toilet Huffing [Perishable Press]
- Monzilla Media [Archive] • Perishable Press
- Tag Archive for [gibbonz] • Perishable Press
- Search Results for [marz] • Perishable Press
..and so on. Again, the point of this exercise is to get creative with your title separators, increase the number of possibilities, and optimize your page titles for visual prominence in search-engine results. So, before closing this semi-casual stroll through the fascinating land of title separators, I would like to inspire you with a few ideas for separating and embellishing your titles:
- The Post Title +++ Blog Name
- The Post Title *** Blog Name
- The Post Title ::: Blog Name
- The Post Title ||| Blog Name
- The Post Title ___ Blog Name
- The Post Title $$$ Blog Name
- The Post Title /// Blog Name
- The Post Title <<< Blog Name
- The Post Title <-- Blog Name
- The Post Title <= Blog Name
- The Post Title <> Blog Name
- The Post Title at Blog Name
- The Post Title @ Blog Name
- The Post Title ~ Blog Name
- The Post Title • Blog Name
- The Post Title [Blog Name]
..ad nauseam! Hopefully, this article gets you thinking about the many possibilities for configuring and displaying your page titles. Bottom line: an easy way to sharpen your titles and stand out from the crowd involves using unique characters and intelligent separators to bring structure and clarity to your titles.
..and I’m out! (:!Thanks for reading!:)
About this article
Related articles
- How to Generate Perfect WordPress Title Tags without a Plugin
- Perfect WordPress Title Tags Redux
- Title Attributes for WordPress Post Navigation
- Prevent JavaScript Elements from Breaking Page Layout when Following Yahoo Performance Tip #6: Place Scripts at the Bottom
- Miscellaneous Code Snippets for WordPress, Windows, and Firefox
- How to Write Valid URL Query String Parameters
- Stop WordPress from Leaking PageRank to Admin Pages
Dialogue
15 Responses Jump to comment form
July 30, 2008 at 3:41 pm
Some time ago I tried the bullet point as you do here at PP, but I felt later that it was not what I wanted. I then went back to the hyphen.
Oh, when you list some inspirationnal examples, why not go crazy and link to a ASCII characters collection? They might by some really great stuff there :p
Note: I vote the have the “Notify me of follow-up comments via email” checkbox checked by default!
July 30, 2008 at 5:12 pm
I like some of the title ideas you’ve thrown out there. I’ve been a bullet man myself for a while, but I’m interested in trying the “Post Title @ Blog Title” for single pages.
July 31, 2008 at 8:05 am
Great post Jeff.. It inspired me to switch from using | to using the bullets as separators. It really stands out when you look at the title.. I’m surprised I didn’t think of that before.. I guess I thought special characters were not allowed or indexed.
August 3, 2008 at 3:39 am
Hmm, after reading this I think it’s definitely time to rethink headers on my blogs. The dot is great, but how about other ascii entries such as ÷ ø ‡ - they should make some nice seperators as well, what do you think?
August 4, 2008 at 4:53 am
Thanks for the checkbox Jeff :D
Quick note concerning what you say just above this comment, that “it is important to specify the proper character set (utf-8, ISO 8859-1, etc.) before the title element“.
Are you sure that the position of the meta within the head element has any influence. My understanding of the browsers mechanisms is that the page starts rendering only after the head has entirely been loaded. This implies that the order is not important, like it isn’t with CSS — because the CSS is not interpreted until the file is all loaded.
What do you think about it ?
August 5, 2008 at 8:46 am
After some researches, I think that you are right.
This W3C recommendation explains that:
The META declaration must only be used when the character encoding is organized such that ASCII-valued bytes stand for ASCII characters (at least until the META element is parsed). META declarations should appear as early as possible in the HEAD element.
Therefore it seems that the meta elements are parsed on-the-fly. This is a pretty tricky thing to know.
Glad you pushed me to figure it out :)
September 3, 2008 at 11:43 pm
Well nice post,, !! :)
I’ve rarely seen any page ranking with competitive keywords in the Google SERPs,, which are having special symbols in their Title Tags..!!!
Don’t you feel that ?? :D
And if some page(using special symbol) is ranking then the site is too old & have grown a big trust factor which lets the title tag ignored,,(in this case even if u dont use those words in title tag you will still rank) ,,
So in my opinion ,,(if you also consider SERPs position using special symbols in title you can use special symbols in your Title tag) any new websites or new blogs should not use special characters in the Titles.
‘m i right jeff ???
September 22, 2008 at 5:27 am
Hi, Jeff,
Thanx..! :) I’m sure you will be doing some research on it .. lolz, , yeah you might b right with your point that ‘people just aren’t using some of the more unique characters’, ,, it might be the case that my observation was based on several common words and highly competitive ones, where there are tons of web-pages fully optimized for SERPs to ram such beautiful, less optimized titles ?
Share your thoughts..
← Previous post • Next post →
« WordPress Error Fix: Unable to Parse URL • Horizontally Sequenced Display Order for WordPress Posts in Two Columns »
1 • Geert
July 30, 2008 at 11:57 am
Details. But, yes, it matters. Nice post.
I guess another related discussion could be about where you place the name of the site: in front or at the end of the title?