Search
Saturday 18 November 2017

Hash Symbols and Special Characters in URLs Explained

hash-tag

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…

 

 

Reviews

  • Hash Symbols10
  • Google Crawler9
  • SEO9
  • Fragment URLs8
  • Hash Bang7
  • 8.6

    Score



Justin Hoffman is a NYC based developer and technology leader. He writes about web development and processes, mobile trends, and consumer-facing technology. Justin is a frequent speaker at many national events with focus on Technology and Agile, including DrupalCon, Agile Allegiance, and DreamForce (Salesforce) conferences. He is currently spearheading a development team at Asset International.


One thought on “Hash Symbols and Special Characters in URLs Explained

  1. Vickie Figueroa

    I was just looking at your Peculiar IQ – Hash Symbols and Special Characters in URLs Explained website and see that your website has the potential to get a lot of visitors. I just want to tell you, In case you didn’t already know… There is a website service which already has more than 16 million users, and the majority of the users are looking for websites like yours. By getting your site on this network you have a chance to get your site more visitors than you can imagine. It is free to sign up and you can read more about it here: http://dmrgnza.de/4 – Now, let me ask you… Do you need your site to be successful to maintain your way of life? Do you need targeted visitors who are interested in the services and products you offer? Are looking for exposure, to increase sales, and to quickly develop awareness for your site? If your answer is YES, you can achieve these things only if you get your site on the service I am describing. This traffic network advertises you to thousands, while also giving you a chance to test the service before paying anything at all. All the popular sites are using this service to boost their readership and ad revenue! Why aren’t you? And what is better than traffic? It’s recurring traffic! That’s how running a successful website works… Here’s to your success! Find out more here: https://fsuh.de/yourls/Q

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *