A few days ago I was testing a soon to be released site. I followed a link I had never seen before and suddenly found my self confused and disoriented. In retrospect it could’ve been the fact I had just ran into a glass door on my way in (I totally didn’t see it there).

But, never the less, it lead me to tweet this:

GUIDELINE: Users should never “teleport” between areas of the page. This can be disorienting. Show the movement from one place to the other.

Ice, Ice, Baby

The reason why I suggested that is not because of the severe “bling” deficiency on the internet. Which, I might add, is getting worse by the day. Its, also, definitely not because I just got laid off and really need a job (see my resume). Its because its just plain bad UI design.

Now, don’t get me wrong. There are a lot of reasons you want link to a specific part of a document, but the way browsers implement this functionality is bad. Fortunately this is an easy fix if you use the scrollTo jQuery plugin

$(function() {
	$("a[href^='#']").click(function (e) {
		var element = this.hash;
		e.preventDefault();
		$.scrollTo(element, 1000, {
			offset: -50,
			onAfter: function() {
				$(element).css({"background": "red"});
			}
		});
	})
});