Web Interface DesignDawn Pedersen

American River College

What’s an Interface?The connection between a user and a

machine.Interfaces provide complex information in a

usable format. Interfaces accept and execute commands

from a user.Interfaces give feedback to a user.

Sample of Software Interfaces

AdobePhotoshop

WindowsExplorer

Firefox

MicrosoftWord

Web InterfacesWeb interfaces allow a user to interact with a

website.The simplest web interfaces provide

information and allow the user to click between site pages.

Web InterfacesMore complex web interfaces act more like

software interfaces:Accept and execute user commands.Provide feedback to the user.Allow users to rearrange interface elements.Can update instantaneously.

Web InterfacesAccept and execute user commands.

Web InterfacesProvide feedback to the user.

Web InterfacesAllow users to rearrange interface elements.

Web InterfacesCan update

instantaneously.

Web UsabilityWeb designers need to consider the needs of

users when designing a web interface.Usability refers to the degree to which a user

can quickly and confidently navigate a website.

Usability is typically the number one factor influencing whether someone will stay on your site or go elsewhere for what they want or need.

Web UsabilityThe following is a summarized list of tips for making web sites usable. They come from the legendary book about web design usability, "Don't Make Me Think" by Steve Krug.Don't make your visitors have to think. A web

page should be self-evident, obvious, self-explanatory.

Recognize that visitors don't read pages. They scan them, and they muddle through.

Create a clear visual hierarchy.

Web UsabilityCreate a clear visual hierarchy.

Web UsabilityBreak up pages into clearly defined areas. Make it obvious what's clickable.

Web UsabilityKeep visual noise to a minimum. Omit needless words.

Web UsabilityCreate street signs and breadcrumbs in your

navigation. On any page, a visitor should be able to answer these questions: What site is this?What page am I on?What are the major

sections of the site?What are my options at

this level?Where am I in the

scheme of things?How can I search?

Web UsabilityYour home page must convey "the big

picture" for your visitors: What is this?What do they have

here?What can I do here?Why should I be here-

and not somewhere else?

Where do I start?

Web UsabilityNothing beats a good tagline. Don't design for a mythical "average user."

Test your site with real, ordinary people.