Craig Webster
Nottingham City Hospital, UK

Download as a PDF here

Designing For Users

Usability has been defined in ISO 9241 as:

�The effectiveness, efficiency and satisfaction with which specified users achieve specified goals in particular environments�

When desigining a web site, the usability of the web site is a fundamental design consideration. Ensuring the usability of your web site will greatly enhance your chances of success.

The usability of a web site is enhanced if the site is easy to learn and on return visits the user can remember how to use it. The web interface is now almost a universal computer interface. With this in mind it makes sense to utilise this and not to force the user to learn new ways of doing things. This will enable a user to come to your web site and be efficient in their tasks. The site should also be reliable. If a site is consistently broken or does not do the expected it becomes unusable and therefore user satisfaction with decrease.

Usability itself is not a static concept; it varies depending on how a single user interacts with the site. As every user is different we therefore we have to design for the average user.

The design medium of the web site is a primary concern. We are designing for a computer screen and not paper. This can often be overlooked as a web site is often seen as a means of publication. We cannot expect that the design principles used in paper publishing (fonts and size of fonts used for example) will be directly transferable to the electronic publishing medium.

The Users

As usability is about designing for specified users we have to profile the users we are expecting to use our site. This is relatively easy to do as most web sites will have specific design goals. For example when producing a laboratory handbook the audience for this material can be quite tightly defined not only in terms of who is using the site but also how they are going to access the site (over the hospital intranet using the standard specification computer for example).

In addition to this there are a number of characteristics that are common to all users of web sites from ref[1].

• Vision capabilities of the user
• Memory capabilities of the user
• Response and reaction times of the user
• How a user responds to stimulus
• The movement capabilities of the user
• And the environment the user works

Vision [See reference 1 for a full description of these characteristics or visit http://www.webdesignref.com/ or http://www.htmlref.com/ ]

Web sites are an inherently visual medium and therefore the vision capabilities of the average user are very important. As stated before you should not assume that the design parameters that make a paper publication visually usable will transfer directly to the electronic medium.

• Keep contrast high, Avoid using text, graphics, and background of similar lightness.
• Avoid using busy background images that may distract the user.
• The colours for links should be significantly different. The general web convention for links states that blue and underlined text is a hyperlink and that green or purple underlined text indicates a visited links. Most users now expect this convention to be used.

Memory [1]

A web site should help users achieve their goal. The processes involved in achieving these goals should not make the user do more work. This has the effect of not only reducing the efficiency of the process but of also making the whole process less usable. This is also applicable to any process that involves IT solutions.

Visual recognition is easier than recall. A web page is a visual medium and therefore more conducive to visual recognition. One way to make things easier for the user is not to make visited links the same style or colour as unvisited ones, as it forces the user to memorise where they have been. It also makes sense to make pages that should be remembered visually different from other pages in the web site (e.g. home pages).

In terms of menu options on web pages the groups of similar choices such as links, should be limited to between 5-9 items. This is the optimum number of choices. Too many choices and the user will be confused, too few choices and you are limiting the users flexibility and freedom. An analogy is with restaurant menus. Too many dishes and there is difficulty in making a choice. Too few dishes and there is difficulty in finding something palatable.

Response Times of Web Pages [1]

The amount of time a user will wait for a page to load is proportional to the payoff. The more the perceived benefit of loading a page the longer a user will wait for a page to load. Generally however pages should be designed to load as quickly as possible. A slow site is not usable as the user will become frustrated with the visit and a return visit is unlikely. When page loads take more than 30 seconds feedback should be provided to the user such as a load-time progress bar, as this will help answer the �is it broken?� question of the user.

Ergonomics of the Web Site [1]

The usability of web pages can be enhanced if they are optimised for keyboard access (all pages in a site, not just form pages). The physical action of moving a mouse can be a significant drain on the user�s time. In addition most ward spaces are cramped and often do not have the luxury of a dedicated mouse mat or space in which to move a mouse.

With this in mind, it also makes sense to minimise mouse travel distance between successive choices and to minimise mouse travel between primary-page hover locations (usually the main site menu) and the browser back button

Further enhancements to usability can be made by making clickable regions large enough for users to move to them quickly and press them accurately. A bigger target is far easier to hit quickly and accurately than a small one.

Web Conventions

There are a number of conventions now widely used on the World Wide Web that will make any web site more usable if they are followed. This is because users have come to expect certain functionality with web sites and therefore if it is not provided, it could result in poor user satisfaction.

• Upper left-hand corner logo signals home page return.
• Text links are repeated at the bottom of a page
• �Back to top� link used on long pages
• Special print forms used for heavily printed pages
• Clickable items are blue and underlined

Some Design Ideas

Don�t forget the media you are publishing to. A computer screen is very different from paper media. What looks good on paper may look poor on screen. The main aim is to make it easy for users of your web site to get the information they require.

In general try to follow these basic design ideas.

1. Black text on a white background is possibly boring but offers the best contrast of text and background and is therefore easy to read. It�s been tried out for a number of years on paper and seems to work in that medium as well as on the computer screen. Most sites use black text on a white background
2. Keep hyperlinks blue. Everyone now expects linkable text to be blue and underlined.
3. Fonts generally used on web pages are again a matter of choice. Classical design theory indicates that serif fonts (Times new roman, Georgia, Garamond etc) are better for large tracts of text and that sans serif fonts (Arial, Verdana, Helvectica) are better for creating an impact and small amounts of text (e.g. headings). This may not be the case for web pages. Looking at many of the popular web sites it can be seen that most of them use sans serif fonts for the main blocks of text. One of the reasons being, that generally you do not have large blocks of text on web pages. Most people still do not read large amounts of text off a computer screen but prefer to print it out. The Georgia and Verdana fonts are fonts that have specifically been designed for use on the WWW. One final point regarding fonts is that the size of the font is important. Macintosh users cannot see fonts under 9pt in size, therefore 9pt font is the minimum font size to use.
4. If you are expecting users to print out information on your site you have to cater for this as well. Portable document files (PDF) are the standard solution but this means you generally have to layout your content twice (once on the web site and once on a desktop publishing system) but the results can be very good.
5. Try and reduce the amount of scrolling involved. The web is all about hyperlinking to information; use the technology.
6. Graphics and images: Alt-tags are essential for those users who do not or cannot view images. They are also useful for search engine positioning.
7. If using tables to create a layout also remember the screen resolution of your target audience. Most designers design for a target screen resolution of 800 pixels in width. If you create a table of 650 pixels you will virtually guarantee that the table will display in the full width you require in a browser on an 800 pixel screen.
8. Don�t use large graphics or java applets that take ages to load. If you need to link to a large file, etc. provide a link and a warning so that users can make the choice whether to view that resource.
9. Repetition: repetition is a good way of creating the overall image and a professional look of your web site. Try and use the same colours, fonts and layout on all your pages. One way of achieving this is to use cascading style sheets (CSS) (http://www.w3.org/Style/CSS/)

References

1. Web Design: The Complete Reference, Thomas Powell, Publisher: Osborne McGraw-Hill ,ISBN: 0072122978