The User-centric Approach to Website Design
The User-centric Approach to Website Design
by Raphie Frank , for swandivedigital, January 2003
Your guide could not be here. You will have to go through on your own.
– Voice from a loudspeaker
The Internet, in spite of the boundless opportunity for connection and interaction with others it provides, is fundamentally a user-controlled , solitary medium. Whether within the comfort of a home or the confines of an office cubicle, the typical Internet user will still be sitting there, alone, with a keyboard, a mouse and a monitor and will need to figure out how to go from A to B or accomplish Z. The trick for those who design and maintain websites is to provide Internet users with the best possible direction and guidance within a richly useful, pleasant environment.
In 2002 swandivedigital undertook a comprehensive review of online Best Practices as they relate to User Experience. Our findings served as the basis for the development of a proprietary User-centric Assessment , a weighted scale we use to rate Website efficacy along the qualitative lines of Usefulness, Ease-of-Use, Efficiency, Engagement and Trustworthiness. The lack of any one of these often intertwined components can negatively impact upon user experience.
Make it Useful
The useful site will first and foremost provide high quality, accurate content that is relevant for the audience. Generally, it should be updated frequently with graphics and/or animations that illuminate content or, in the case of dynamic content, perform a function.
Second, the useful site will be robust , with breadth and depth of content that makes the site understandable for first time users and valuable for repeat and highest value users. Reference resources, useful links, interactive tools and community elements can all add value to a site when employed in an appropriate, judicious manner.
Third, the site must support user goals . It should tell and show users what it can do through proper text and visual cues. It should help them accomplish tasks by helping them find what they are looking for and by providing proper support networks – search tools, FAQ’s, easy to access contact information – to help them when they encounter difficulties. Lastly the site must deliver on its promises, actually enabling them to do what it tells them it can do, either implicitly or actually.
Make it Easy
If “Content is King” as the conventional wisdom goes, then Ease of Use is the trusted aide without whom the King is lost, confused and ineffective. “Tell me what to do. Show me how to do it. Let me do it with a minimum of hassle and thought. And help me if I get into trouble.” These are the Ease of Use imperatives that allow high quality content to have the most powerful impact and support user goals. A site that is not easy to use, by contrast, is far less useful no matter how good or relevant the content.
The easy-to-use site should be intuitive and clearly navigable ; should make it easy to access information via useful search function and well thought out information hierarchies/ categorizations within and between site sections (helping users “guess right” when looking for something);
At heart, the goal of making a site easy is to reduce needless mental processing (related to “Efficiency” below). Some of the more specific ways this can be achieved are:
- Immediately provide users with a sense of site purpose and mission;
- Show users where they are, where they’ve been and where they can go through the use of standardized linking conventions, and with expected, logically ordered placement and labeling of menus and buttons;
- Design layout and visual presentation to be consistent and uncluttered in order to offer clarity and minimize users’ need to memorize (long term) and remember (short term);
- Structure content for “scannability” by breaking up information into small chunks with descriptive headlines (“chunking”), utilizing the “inverted pyramid” approach to writing content (the most important information comes first), highlighting important points, and mercilessly editing copy to 1/2 that of offline presentation of the same material.
- Place the most important links and content “above the fold” and allow for drill-down depth so that users can immediately get the overall picture and then choose to read more if so desired.
- Give them a clearly identifiable “escape route” or “breadcrumb trail” to bring them back to a familiar “Home Base” such as the Home Page.
- Institute search functionality that returns descriptive, relevant results, allows users to narrow search parameters, and gives the ability to search via standard query languages (e.g. Boolean operators, truncation, proximity, ranking) and specifiable search elements (e.g. text and numeric strings, specific HTML tags or URL).
Make it Efficient
In order for a site to be either useful or easy, the site has to technically work in the first place and help users perform tasks quickly and successfully. Thus, the efficient site will be technologically sound, accessible and flow well.
In order to be technologically sound , the site should be error-proof (e.g. no missing pages, broken links, or non-working advanced scripting), cross platform and cross-display compatible, and should degrade well on older systems and lower speed connections. Page loading times should be minimal (ideally less than 5 seconds on a 56K modem), forms should function and there should be high system visibility that keeps users updated on system status when downloading assets, loading new pages or encountering errors.
With varying degrees of attention (determined in part by a site’s target audience) Universal Accessibility requirements should also be considered for those who are physically challenged by vision, hearing or mobility impairment; technologically challenged due to economic status or locale; or comprehension challenged language due to native tongue.
Finally, the site should flow well , helping users to accomplish tasks quickly in a variety of ways:
- Present steps in a linear process in clear, well-ordered fashion.
- Provide users with visible, easy, well-arranged controls.
- Help users avoid needless scrolling by making page sizes appropriate for content,and on longer pages by including links that bring users to other places on the same page (i.e. “back to top” buttons).
- Incorporate shortcuts and mouse/keyboard equivalents where appropriate (i.e. “helpers” such as autocompletion or tabbing through forms).
- Include value-added, context sensitive help.
Make it Engaging
A site that is useful, easy to use and efficient will almost by definition be an engaging site. That said, a particularly engaging Website can inspire vision, better communicate message, and encourage repeat visitations while promoting trust and confidence in an organization.
Ideally, a Website site will be attractive, use layout to “befriend” the user, and engage or even possibly inspire the user through the use of appropriate content, tone and mode of presentation.
The attractive site will be attention grabbing without being annoying (e.g. blinking text or pointless animation), will use graphics in a relevant and illuminating manner, will utilize aesthetically pleasing and eminently readable text and typography treatments, and will employ effective, moderate use of color and backgrounds.
Layout will be used to maximum effect through an uncluttered positioning of elements and judicious use of white space that allows users to “breathe.” More important information will be accorded more prominence with respect to both visibility and positioning, logically related items will be visually related and unnecessary scrolling avoided. In sum, the layout will adhere to proven design standards unless there is a compelling argument to suggest “innovative” (read: potentially confusing) treatments.
Finally, the engaging site will actually engage and possibly inspire the user by adopting the user’s language and tone; by using a context-sensitive, proper mode of presentation (e.g. educational, entertaining, expedient); by employing dynamic content, community elements and “nifty” online tools (e.g. perform steps, summaries, calculations) in instances where it can increase communication, understanding or useful functionality.
Make it Trustworthy
Trust is the final essential ingredient that should not to be overlooked as a foundation for user-centric Website design. If all the other elements, usefulness, ease of use, efficiency and engagement are working in tandem, this will go a long way towards building the desired trust.
A site with useful content that is updated frequently builds trust. So too does one that delivers on its promises, works well, helps people find what they are looking for and accomplish tasks, looks solid and professional (or at least “appropriate”) and provides adequate support function. A few elements, however, are unique to the trust domain and, without them, they can undermine an otherwise tremendously successful effort at user-centric design.
Second, users should be treated courteously . Examples of courteous treatment include: warning users when aspects of the user/organization relationship will not be in accordance with standard practice and user expectation; warning users if a link will take them directly to a document or software download, alerting them as to the file size of the download and providing them with links to necessary viewing and downloading software; and employing sensitive use of e-mail.
Third, the trustworthy site will tend to be transparent . It will be connected to the rest of the Web with links in and out. Clear, transparent contact information will be provided. And, where appropriate, biographies and possibly photos of key organization players will be included upon the site.
There is a building in Prague, Czech Republic, that is part of the official Castle complex. This building, Romanesque in origin, has small arched windows and a marked sense of weight, volume and solidity – all in keeping with the style and technical means available at the time it was built. Over the course of many centuries, many monarchs [presumably] desired improvements to the building in order to make it “modern and timely.” Each era brought its own marked architectural style and fashion; each Monarch their own opinion and desire.
Looking at the building today, the result is an amusing, disjointed pastiche – “modern and timely” only insofar as it now appears more a cubist collage (a Czech specialty) than a unified, integrated work of architecture and design. There is a side door with a Renaissance portico, the façade of the building has been stripped off and a Baroque one “pasted on” in its place, and a gothic spire extends heavenward from the roof.
Similarly, any website design must carefully balance a number of issues in order to avoid such a divided scenario. Attention to visitor needs and the provision of useful, relevantcontent and information to visitors; ease of use; design integrity and consistency; clear communication; effective message integration across media; technological implementation now and planned for the future – the interplay of all these factors must be given their proper due and consideration within the context of an overall design.
From a user perspective, a successful site must be useful, easy, efficient, engaging and trustworthy – the basis of what swandivedigital (as well as leading usability experts and advocates) considers best practices website development. At the same time, the organizational perspective must never be overlooked – a site must communicate to the right people; embody and further organizational ideals through form and function; and appropriately consider administrative needs, desires and resource limitations.
In relation to website design and redesign, while the urge and urgency to just “get something up” can be palpable, “slowing down in order to hurry up and get it right” often best serves an organization’s needs. Care must be taken not to rush into any piecemeal designs, lest a website suffer the same fate as that Prague edifice as pertain to issues of usability, communication and aesthetics.
2 Comments »