Visual Design for WebWhen considering design for a web page, one should pay particular attention to their audience. Putting a page on the internet opens up the audience far beyond who is the intended audience. The designer also has to always keep in mind the aim of the organization behind the website, its values, and its goals, as the web page will be used to communicate this to the users, and members of the page’s organization may also be users of the page. Lin (2002) wrote that “A Web site is such a multi-user product. It is also a product designed for use by multiple audiences. Therefore, designing a Web page imposes the need for the designer to take the interests and concerns of those multiple audiences into consideration”. Therefore, the page’s purpose must always be in mind. The best way to overcome the possible differences in audience from intended and actual audience is to abide by certain values in web design, which revolve around simplicity, clarity and consistency.
Audience and PurposeJanice (Ginny) Redish said in her book Letting Go of the Words, “Understand your audience, why they come, what they need, and how to write web content for them.” When you begin working on a web page, and throughout the process, keep these tasks, listed by Redish (2000), in mind. These will help keep you on focused on the goal of information design. This list is especially true for websites, since the designer has to understand that lay users may access the page. The page must be designed so that those who may, or must, use the information can:
- Find the information they need
- Understand what they find on the page
- Use what they find and understand appropriately
Page ContentThere are many ways content can be presented, depending on the role of your document. If your document serves an informative purpose it might be helpful to display your content in question form that a typical reader might ask. An example of effective content, displaying content in question form:
- Question: What type of batteries does this toy require?
- Answer: The race car requires two double A batteries.
- When planting flowers, first prepare the flowerbed.
- After preparing the flowerbed select the flower seeds you would like to plant.
Simplicity, Clarity, and ConsistencyAs Williams (2000) described, elements on the screen must be legible, and often a pair of critical eyes is needed to judge legibility of text and images. Elements should contrast greatly with their backgrounds. Very small color elements can be seen much more easily on a black background rather than a white background. Backgrounds should not be busy with clutter or heavy use of patterns. The foreground needs to be clear and easily distinguishable from the background, so a busy background distracts the user. Also to give the greatest contrast, backgrounds should be white or short-wavelength colors, such as light blue. It can also be a bad thing to use too many large file size elements on the page such as pictures, as they can take too long to download to be seen on the user’s screen, which hurts the page’s usability. Since computer screens are typically wider than they are tall, often have less space than paper media, and give light rather than reflect light, certain considerations need to be made to distinguish design of a paper document with a Web document. The space available on a screen allows you to break information into chunks so that different elements on the page can be viewed easily on any screen. If there is an intended sequence in chunks, it is possible to use numbers or letters to code the sequence, or use graphical elements such as arrows to direct the user from one piece of information to the next. Otherwise, the most contrasted element to its background will likely be read first. Consider the following key elements:
- Chunking - The average reader will not wish to read long passages of text on a computer screen, so use chunking, or break down a large text into shorter, more digestible pieces of information which can be read independently from each other.
- Color Scheme – Don’t mix a lot of colors. It is best to select only a few colors that either complement each other or are appropriate in representing the group for which the website is written, or appropriate for the audience. Also, colors can call attention to elements of importance.
- Using images – Pictures, or video, can sometimes communicate information much more quickly and clearly than text. It is encouraged to include images where appropriate, but the designer shouldn’t clutter the page, or use pictures which have are only for aesthetic and have no relation to the text or other elements on the page, as this can confuse the user.
- Consistency – Visual appearance has a large effect on how users read and value Web sites. One important aspect of professional Web pages is consistency. Information and user interface should be presented in a consistent manner throughout the page and the entire structure of the Web site. Logos, page titles, headers, and interface elements such as navigation, buttons, and graphics are all to be consistently represented. This will ensure the users will perform on the website without error or confusion.
To better understand how to effectively layout a web page, read more about How Users Process the Page.Loorbach and Geest (2005) cite Grudin’s distinctions of consistency in interface design:
- Internal consistency in graphical layout, command naming, dialog forms, and etc.
- External consistency in the featuring of elements of interfaces already familiar to the users.
- External correspondence of the interface features to familiar features outside of realm of computer interface.