Phine Solutions web work notes

Recently I discovered this little javascript hidden gem: smooth scrolling to an anchor link on the same page.

Basically it creates smooth scrolling effect when a user clicks on an anchor tag that points to a different part of a page, mostly likely a very long page. Often times, in this kind of situation, the page jumps so quick that I have to look for the URL in the browser’s address bar to see if I’m still on the same page. And for a lot of users, this can be confusing sometimes. This little script, once included in the “head” tag, will make this kind of scrolling go slower. Although It’s still a pretty fast scrolling motion, it slows down enough to make user aware that he is being redirected to a different section on the same page.

Another benefit of the approach is that the scrolling subtly reveals the other part of the page as well, which is a nice way to encourage user to explore other part of the page.

Typically I’m not a big fan of implementing fancy but less practical effects on a web page using javascripts. They do have a cost to load and for most of the users, visual effects wear out after the initial “oohs and ahs”. However, this one is a great implementation to address an issue that is too trivial for browser but valuable for web designers.