Ajax and Usability - Browser navigation buttons / by Cory

ajax1.jpgOne of the biggest usability problems you encounter in a fully Ajaxified site (i.e., a completely dynamic site that functions with little to no page refreshes)...is the fact that anything you load dynamically on the page without a refresh is blind to the browser's buttons, as well as bookmarking. Kailash however has discovered a slick way around this problem in this post. He mentions that by making use of the 'url fragment identifier' or whatever that comes after the # in a url, you can use javascript to dynamically update the url in the browser's address bar:

Javascript can update the fragment identifier dynamically with a simple

CODE: document.location.href = '#whatever';

On page load, something like RegEx could be used to parse the query

CODE: var thisUrl = document.location.href; var query = thisUrl.split('#'); alert(query[1]);

So if page numbers or required variables are set as the fragment identifiers, it is possible to efficiently make Javascript process it (nearly) and make Ajax act normal with page urls.

On another note, Smugmug has released a new version of their site that is proof positive that this technique can sucessfully be done. Well done! I'm really excited to start using this technique on our projects over at Blue Lava.