Blog :: Javascript and browser effects

I've started a tech lecture series in my division's weekly all-staff meeting. This week I'm talking about javascript effects; the following is the presentation I plan to give on Javascript, moo.fx, and one implementation of the Yellow Fade Technique.

Introduction:

Frequently a small touch of Javascript can signifigantly improve the usability of a web application. De-cluttering a form by hiding optional or irrelevant form elements and using effects like the Yellow Fade Technique to draw attention to parts of a page that change make it easier for the end user to complete the task they are attempting.

Previously, to my mind at least, Javascript/html "effects" had a vaguely disreputable flavor. Some of the least enjoyable programming I've done was attempting to write a cross browser (Netscape and IE) hierarchical menu system around 2001 or so. Taking into account the differences between browsers meant writing layers of if/else statements that accessed various browser specific properties (anybody remember Netscape "layers"?) Additionally, it sometimes seemed that all that javascript was mostly to make self indulgent widgets that frequently made sites less usable. I remember with some horror floating menus that scrolled with you (and utilized half your underpowered CPU), "dynamic" navigation systems that meant every link started with "javascript:", and text that jumped and skidded and flashed colors for no apparent reason (all on a single geocities homepage, of course).

Fortunately we've come a long ways. Nowadays, standards compliant Javascript tends to use the Document Object Model to access elements in a standard way and uses standard CSS properties to implement visual changes. It also seems that web development has matured in its use of Javascript - focusing on enhancing the usability of pages instead of distracting users with glitz. The following presentation (S5 Slideshow, use arrow keys to navigate) features some of the smaller javascript libraries I use to get things done.

Posted on July 11th 2006, 01:41 AM