Clean URLs and AJAX

I have been perplexed for a while when starting to develop a new web application. I wanted to implement clean URLs in it, because clean URLs are the buzz these days. Actually I wanted to use clean URLs to make my web application more user and search engine friendly which would help in SEO as well as make the application look cleaner and neater.

AJAX is another hot topic these days which I did want to make use of in my application. The interesting thing is that by default an AJAX based application does not change its URL while the user interacts with it. Gmail uses AJAX extensively and its URL never changes.

Those two concepts, clan URLs and AJAX seemed to collied with one another at first. Then after some research and thought I came up with the logical conclusion. For parts of your web site which you want search engines to see and index and which you want your users to be able to bookmark and exchange its link with others, use clean URLs. For other parts of your application where a user interacts with the system to display specific information for that user as a result of his or her interaction with the system, then use AJAX for such parts of the system and do not change the URL while the user interacts with the system.

I came across this interesting wiki about unique URLs which discusses in some detail how to use AJAX while at the same time making your web application have more than a single URL so that people can bookmark specific parts and search engines can index those parts as well.

The Anchor Tag

I used to think that the only way to make internal links inside a web page pointing to sections found in the same web page was to surround the target section with an anchor tag like this:

<a href="section-name">Some Link Text</a>

I just by coincidence while scanning the W3C documentation for anchor tags discovered that there is another method which in my case proved to be easier and more compact.
Let's say you have a section in your web page titled as follows:

<h2>My Section</h2>

If I wanted to link to such a section, I would modify it as follows:

<h2><a name="section-name">My Section</a>

But I discovered that I can alternatively write it as follows:

<h2 id="section-name">My Section</h2>

This has the exact same effect as the first method and looks neater and easier to write.

By the way, using internal anchors and linking to them from the same web page helps a lot in search engine optimization (SEO). Google seems to love web pages that have such links in them. They give spiders many clues and Google just loves this and usually ranks such web pages high.

Tracking External Clicks

Google Analytics allows you to track traffic coming to your web site. It's an excellent too and its free.

I wanted to also track how many people who are visiting my blog click on a specific link I have on the blog. The link I want to track clicks on points to an external site and not to a web page in the blog itself. I have just discovered by mere coincidence that Google Analytics allows you to do this as well using a function called urchinTracker. Now I can know how many people visiting my blog have clicked on that specific link and visited the external site it is pointing too.