| The User Interface
When the Macintosh first came out, Apple published
a set of user interface guidelines for software developers.
Some developers felt that having to adhere to a standardized
interface would hamper their creativity. But others realized
that it would actually free them to spend more time applying
their creativity to step up to the next level of application
design.
Consider the signal-to-noise ratio of your interface.
How much is useful and interesting, and how much is just noise?
Avoid using large or gratuitous graphics that don't add to
the content of the page.
Remember that browsers have a lot of user-configurable features -- colours,
fonts, etc. These can really mess up your fancy interface.
Don't make the user guess where to click.
Don't replace bullets and horizontal rules with images. It eats bandwidth and
confuses the user. If you use images as bullets, your visitors may try clicking
on them and wonder why nothing happens.
Be very careful in using graphic elements as controls (buttons, links, etc).
The user has to guess what to do.
Try not to have two or more places to click that perform the same action.
Don't use the "underline" attribute for text.
It makes it look like a clickable link.
Find out what your visitors do most often at
your site and make that the easiest thing to do. If you're
an overnight delivery service and 90% of your visitors are
there to track a package, have a big button that says "Track
your package." This is a good rule to follow when determining
the size and placement of interface elements.
For some reason, most browsers default to a background colour of gray. The
easiest way to fix this is to override the browser's default. Use a white background.
Set the background colour to white using BODY BGCOLOR="#ffffff".
Don't forget that links show up in different colours than regular text, and
may change colour after a link is viewed. Consider how these links will show
up against a coloured background. (And remember that these colours will be
different on different browsers and can also be changed by the user.)
You can use a shade of gray as a background if you are not displaying text
against it. Use as light a shade as possible.
Keep the interface uniform. Have the same controls perform the same action
everywhere.
Avoid putting too many interface elements on
the same page. Some sites present the visitor with a bewildering
array of image maps, buttons, text links, and images to click
on. The effect can be overwhelming
Don't use coloured, textured, or graphic backgrounds
unless absolutely necessary. They may look fine in your browser,
but could end up looking quite different in someone else's
browser, or on a computer with different video hardware, colour
depth, etc. They're distracting, and they really do make text
hard to read.
Another problem with backgrounds is that they are handled differently by different
browsers. On some, your page is first displayed, and then, after some delay,
the background suddenly shows up, like a layer of smog descending on the page.
With other browsers, you sit and watch a blank page until the background has
been downloaded.
Displaying images against anything but a plain background may cause them to
be rendered incorrectly by the browser. And it may make it difficult for a
visitor to view them. There's a reason that most museums and most art books
display their images against a simple background.
Don't anything unless it's to indicate an emergency such
as a life hazard. It's distracting, and it annoys the hell out of some people.
Try to read something over here while something over there is blinking.
Don't use tricky (or undocumented) HTML to do dissolves or fades or other special
effects. They look different on every machine. And after a while, they can
get downright annoying. And they may stop working (or work strangely) on different
browsers or on new releases of your current browser.
Don't have something that, when clicked on, takes the visitor back to the page
they're already on. Disorienting. This is common on sites where every page
has links to every page.
One way to get a precise block of type, such as a name and address, to appear
correctly in every browser is to render the type in an art program, then save
it as an image (GIF) file. If done properly, a name-and-address block, including
email and web addresses, should be about 2K bytes. (But don't forget to include
a text alternate.)
You can set large (headline) type, normally black, to a shade of gray. But
not too light.
Don't change any of the type colours -- either
for displayed text or for links. It only disorients the user.
In general, try and keep the user interface simple
and uncluttered. Try and use default values whenever possible.
|