In web URLs including Facebook, I see the string /#! appearing. What is the purpose of it?

Question

What does the string #! do when facebook sticks it into its URL when I visit? I know the role of the # sign in indicating an anchor location in the page. But what is #! for?

Answer 1

This should make pages crawlable by Google and friends:

http://code.google.com/web/ajaxcrawling/docs/getting-started.html

http://googlewebmastercentral.blogspot.com/2009/10/proposal-for-making-ajax-crawlable.html

The solution works as follows: the crawler finds a pretty AJAX URL (that is, a URL containing a #! hash fragment). It then requests the content for this URL from your server in a slightly modified form.

Your web server returns the content in the form of an HTML snapshot, which is then processed by the crawler. The search results will show the original URL.

Answer 2

This article explains how it works in an easy to understand way.

On the other hand, when I point the browser at http://twitter.com/#!/timbray, here’s what happens:

The browser pulls apart that address, saving the part after the “#”, namely !/timbray, locally. This part is technically called the “fragment identifier”, but let’s say “hashbang”.

It connects to twitter.com and sends a more-or-less empty query, because the address was all hashbang.

The server doesn’t know whose tweetstream is being asked for because that information was in the hashbang. But what it does send includes a link to a (probably large and complex) chunk of JavaScript.

The browser fetches the JavaScript and runs that code.

The JavaScript fishes the hashbang (!/timbray, remember?) out of browser memory and, based on its value, pulls down a bunch more bits and pieces from the server and constructs something that looks like my tweetstream.

Answer 3

On the web it's called hashbang. In the Unix environment it's known as shebang.
This article gives a detailed description of the consequences arising from the usage of hashbangs in URLs, using the Lifehacker redesign as a case study.

So why use a hash-bang if it’s an artificial URL, and a URL that needs to be reformatted before it points to a proper URL that actually returns content?

Out of all the reasons, the strongest one is “Because it’s cool”. I said strongest not strong.

Danny Thorpe describes it's side effects in this article from his blog.

Another side effect of using URL fragments is that the fragments don’t appear in the browser history. As a result of the URL equivalence rules ignoring URL fragments, multiple URLs that differ only in fragment will only appear as one entry in the browser history. This makes sense if you are using URL fragments as they were originally intended – to reference specific subsections of the same base page.

---

While I’m not sure I agree with all of Davies rants against LifeHacker, I will agree that building an entire content system solely on the hash-bang URL pattern with no appreciable static HTML content independent of JavaScript is probably not the best use of the hash-bang URL pattern.

Ryan Grove, YUI engineer at Yahoo!, doesn't recommend using it and explains why answering this question on Quora.

No, hashbang URLs are not a recommended practice. But it's important to be absolutely clear about what this means, so read on.

and a sum up:

1. "Hash" URLs and "hashbang" URLs aren't the same thing, although "hashbang" has unfortunately become the generic name for "hash URLs that trigger JavaScript-based logic".
2. Hash URLs are never sent to the server, so they're useless without JavaScript if you depend on them to trigger application logic.
3. Since hash URLs require JS, you're doomed to either break all existing URLs or maintain a JS URL handler forever if you ever decide to change your URL scheme.
4. "Hashbang" URLs don't automatically make your page indexable by search engines. You still need to do a lot of server-side work to make that happen.
5. Even if you support the full Google Ajax Crawling Scheme correctly, that only helps you with Google. You're still screwed with the other search engines.

Check this question on stackoverflow, as well.

Answer 4

This tells Google how to index the page.

http://code.google.com/web/ajaxcrawling/

Answer 5

It is an anchor point for the top of a page. Some web pages have a link "top' at some point in the page that jumps to the top. The link points to "#"