Don’t Use Hash Bangs (#!)

Recently I decided to implement what has become known as “hash-bangs” in a site I’m working on. Hash-bangs are used in AJAX applications and websites (such as Twitter) and have a #! in the URL. For example a twitter URL is:

http://twitter.com/#!/gilbitron

The main reason for using these “hash-bangs” is to allow Google to crawl your AJAX website. This was all fine until I was shown the error of my ways.

I was pointed to an article by Mike Davies entitled “Breaking the Web with hash-bangs”. In the article Mike points out all the flaws with using this method. In summary:

"the #! URL syntax was especially geared for sites that got the fundamental web development best practices horribly wrong, and gave them a lifeline to getting their content seen by Googlebot"

The lesson learned: always use progressive enhancement, never rely on Javascript to show your content.

As an alternative to hash-bangs it is recommended you look at HTML5 pushState() from the History API if you really need to serve your content using AJAX.

  1. gilbitron posted this