Don't Be A Bad Javascript User
Let me start off by saying that this is not going to be a javascript bashing article. I don't hate javascript, in fact I really do like it a lot— although the title of this article may seem to the contrary. There are many javascript libraries that do really cool stuff. I love that many of these scripts enhance webpages without requiring the use of flash.
The problem I have been encountering lately has more to do with the improper use or implementation of javascript. I think there is far to much whiz-bang stuff being added to many of todays modern websites without considering the impact on users. I feel it's important that before you add a script or a feature to your site that you stop and ask yourself: Is this thing I am about to add to a site going to help my visitors or hurt them? Does it add any value to for the user? Does it hurt them if it's not there? Will it only cause more confusion?
Rather than just talk about it, I have compiled a few video clips to help demonstrate some bad uses of javascript.
Hiding Banner: One Trick Pony?
In this first example, I surfed onto site designchuchi and was struck by it's beautiful interface design. It's clean and organized with great use of color. I like the site a lot. But they have this hide header thing that just made me go huh???
You can click the button and a javascript function pulls the 150 pixel banner closed. I though okay, that's cool for those monitor challenged users who want the site a little more compact so more content fits above the fold. That's great for going through the portfolio section of the site where a user may not want to scroll. However when I clicked to the next page the banner was back again? I closed it once more, thinking the session variable did not remember my preference. Nope that is not the case at all. I would have to close the banner on every page. This begs the questions: Is this feature put there for the convenience of the user? Is the users experience on the site somehow better because of this trick? Would the visitor care if that function was missing? Or is it's only purpose to achieve a "That's neat" effect?
Floating Blocks of Chaos
This second example uses a dragable div. It allows you to drag the sidebar navigation and position it anywhere on the screen you wish. I cannot think of one good reason why a user would want a feature like this.
The floating boxes can overlap obscuring other navigational items. Originally the boxes were all spaced evenly, though after recently checking back I noticed that in order to fix this flaw, the developer placed the boxes further apart. This just creates a whole different set of usability issues. All for some dragable boxes. Personally I just don't get it. In my opinion, the return on investment is just too low to be a feature that I would want as a user.
The web is full of poor uses of javascript. I hope that developers will see the mistakes before javascript gets the same bad rap that flash and DHTML got several years ago. Truth of the matter is. I would rather see people find creative ways of using javascript for good rather than evil.
Good And Bad
Have you spotted good or bad implementations of javascript libraries in the wild? If so, I would like to see a link to them. I am looking for both good and bad examples. I plan to follow up this article with some sites that I feel make great use of javascript. Rather than being only the devils advocate, I also want to point out some great uses for javascript.
I also want to hear what you have to say about this. I know I can get pretty caught up in my concerns over usability on the web and that can sometimes make me overly critical at times. That being said, do you agree or disagree with me?
Tags: Accessibility · Code · usability
1 comments so far ↓
Good post, and I agree completely. As you mentioned, the first example would be worlds better if they saved the preference with a session variable. I tend to put any display setting changed by users (most commonly list sorting preferences) in session variables as consistency is key to user experience.
Your right about the second example, there's no good reason for it. I think drag and drop is amazing when paired with ajax to sort a list of items into a preferred order. It is used very effectively for modifying your Netflix queue, and rearranging Drupal navigation.
The biggest mistake I'm guilty of is not trying to glam up a website, but rather just assuming the user has Javascript turned on for things like opening a new properly-sized window. I'll usually code fallbacks, but I often forget or get lazy. So many mission-critical sites (like all of my banks) now require Javascript, It's hard to justify spending extra time for the 1-2% of users that don't.
Leave a Comment