Kompatibilität

The Art and Zen of Web Sites ( http://www.tlc-systems.com/webtips.shtml )

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 -- colors, 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 color of gray. The easiest way to fix this is to override the browser's default. Use a white background. Set the background color to white using BODY BGCOLOR="#ffffff".

Don't forget that links show up in different colors than regular text, and may change color after a link is viewed. Consider how these links will show up against a colored background. (And remember that these colors 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 colored, 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, color 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 blink 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 colors -- 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.

zurück