hash-tag

I’ve been recently engaged on a few SEO related initiatives and came across inquiries regarding the usage of “hash” symbols (formerly known as the “pound” sign) specifically in URLs and how they affect SEO rankings. Are these characters simply ignored by Google search crawlers, or does this make an impact that people should be aware of? How should these kinds of characters be used on the web? This is a brief description of where and how to implement these across your dynamic web applications.

A hash sign (#) in a URL is referred to as a ‘fragment’. In the past and with many legacy applications, URL fragments have been used to automatically set the browser’s scroll position to a predefined location in the web page, like a standard HTML4 ‘anchor’ link (used on many ‘link-farm style websites and old school Geocities sites). Applied in this manner, a URL refers to a document, then the fragment refers to a specific subsection of that document (or web page).

In recent years, however, this definition changed through the use of major Social NEtworking sites, primarily driven by the popularity and adoption of Twitter. Any information that appears after the first hash symbol in a URL is referred to as the fragment identifier – sometimes also called an anchor tag. By default, the fragment identifier is interpreted only by the local web browser and is typically not passed to the remote web server. For example, the following two links would both be considered requests for the same document by the web server:

• www.samplewebsite.com/colors.html#red
• www.samplewebsite.com/colors.html#blue
• www.samplewebsite.com/colors.html#yellow

Since the fragment identifiers (tags) in the example URLs above signify two different locations in the same page, search engines like Google, Bing, etc., will consider them both to refer to a single search result: www.samplewebsite.com/colors.html

For this reason, it’s important not to use fragments as a way to represent what should instead be different pages. In short, if you want Google to crawl two different pages and index them separately, you’re better off simply using two distinct URLs without fragments. However, in modern implementations, fragments are often used in a different way – to add dynamic functionality to websites and web applications. In this approach, a series of related requests are all processed by the same URL. So, in order to return different variations of the content, parameters are passed via URL fragments. Javascript is then used to interpret the fragment and update only portions of the page that need to change, without the need for a full page or browser refresh. This is typical of AJAX-style applications.

So, the question is, how does Google index distinct content within AJAX style pages? After all, we just said that Google will not consider the fragments in the URLs. The answer is Google has provided a syntax for working around this problem. It’s known as the “hash bang” syntax. By putting an exclamation point immediately after the hash sign, you’re telling Google that the fragments are not used for traditional scroll positioning but instead for loading separate content variations that should be crawled. With that approach, our example URLs with fragments could indeed be crawled and seen by Google. Our example URLs might then look like this:

• www.samplewebsite.com/colors.html#!red
• www.samplewebsite.com/colors.html#!blue
• www.samplewebsite.com/colors.html#!yellow

Remember, if you’re not using this special syntax, analytics reporting systems like Google Analytics may not be configured to track clicks on fragment links in your site. To ensure tracking works, either structure your content with distinct URLs or configure your Google Analytics code to also track fragment clicks.

Here are a few useful links regarding Hash Tags in URLs…

• Character Escaping (Stack Overflow) – http://stackoverflow.com/questions/5007352/how-to-escape-hash-character-in-url
• Fragment URLs (HTTP Watch) – https://blog.httpwatch.com/2011/03/01/6-things-you-should-know-about-fragment-urls/