Tag Archive for 'greasemonkey'

Distinguishing Interactive Elements

March 15th, 2008 by peasleer

When looking at a web page or some other piece of hypertext, the pieces of text that are interactive have historically been set apart by some style change. This really refers to links, which in the majority of pages, are the only pieces of text a user would click on and expect something to happen.

As a small tangent before I continue, I have a weird habit. When I read text on a computer screen, I rapidly highlight the lines I’m currently reading from top to bottom, then release and do the same from bottom to top. Repeating this action helps me track what I am reading, By interacting with the text ‘physically,’ I find I am better able to focus, retain information, and process text quickly.

Now with this behavior in mind, imagine a text interface where simply selecting text results in a behavior the user doesn’t expect. If you are having trouble thinking of an example, allow me to point you to a political article hosted by the New York Times, and another from the Free Dictionary on spectator ions. The common feature shared by these two websites is they both have a hidden feature. Selecting and clicking on words will open a new window containing their definition.

This behavior is unexpected, as there are no visual cues to hint that the above action will have that result. Surprising your users with behavior like this is an annoyance, but not having the ability to turn off this behavior results in blog posts (like this one!).

The lessons here are short, and barely warrant a full post as they should be common sense:

  1. Your interfaces should behave as the user expects.
  2. Separate your interactive elements visually.

If you ignore either, you risk frustrating the very same group of people you are trying to attract - a behavior that most developers try to avoid.