Web Presentation Design Principles

Step One - Defining a Goal

Clarify what is to be accomplished through this web presentation. The overall objective should be clearly written out to ensure a definite understanding of what is to be accomplished. This makes the design job considerably easier and helps identify many problem areas right at the beginning.

Step Two - Know Your Audience

Although every web presentation is available to the world, most presentations generally have a specific target audience in mind. This is extremely important for determining both content and technology should be used. Some questions to ask yourself are:

• Should the presentation be designed to support a specific browser, or be as browser-independent as possible?
• Will the average user be accessing the presentation from a slower type of internet connection (14400, 28800, etc)?
• What assumptions about the size of the computer screen are you going to make?
• Will the average user be an experienced web user, or will there likely be a large number of newbies?
• What are the consequences of each of these decisions?

Some methods of dealing with these issues are:

• Design a presentation with different versions for different browsers
• Create a presentation which uses only the most common features supported by browsers in general. (This is a real tough one!)
• Add just enough "new technology" to encourage users to upgrade their software/hardware to take full advantage of modern tenchology, yet still be able to easily navigate and benefit from your presentation.
  • Use animated GIFs to illustrate the advantages of your full-featured presentation.
  • Show images of your frame or Java enhanced version for those who do not have Java- or frame-enabled browsers.
• Include educational information about your presentation and what is required to experience it to the fullest. This demonstrates concern for your users and provides added value to your presentation.

Step Three - Organization

Create a "road map" of how the information which will be presented is related. This often relates closely to the map of how a visitor will navigate through the presentation. Advanced graphics programs may be used, or simple post-it notes stuck on a wall or table top to represent the various topics and locations.

Step Four - Design a User Interface

Here are some guidelines for designing a user interface:

1. Maintain familiarity. Attempt to create an interface which will be familiar to your users.
2. Be consistent. Various controls (such as buttons) and elements may appear differently from page to page, but should elicit a consistent action.
3. Use logical structures. Start off the top levels with a minimal number of general categories and simple information. Build to more complex structures and detailed information as the user moves deeper into your presentation.
4. Minimize errors. Design your presentation to reduce the number of mistakes a user can make.
5. Be obvious. Make controls and objects look like they should do what they are should. Buttons should look like something that is supposed to be pressed.
6. Don't be distracting. The main reason your presentation is here is its content! Create a design which allows the user to focus primarily on your content, while still able to locate any controls required, when needed.
7. Feedback. User actions should produce an obvious effect.
8. Points of view. Try to view each area within your presentation from a users point of view.
9. Speed. Different people absorb information at different rates. Create a presentation which will allow the user to have control over how fast they progress.
10. Appropriateness. Make sure the design at all levels and technology used appropriately matches the content of the presentation and the target audience.

Remember that HTML descibes the general structure of the document, not the actual layout of elements on the screen.

Create HTML documents which allow the browser to effectively display the contents based upon the platform on which it is viewed. Don't design documents with your browser and computer configuration as the "norm".

Home Page | Session 3 Index | Style Guide