Powered by Conduit |
Five Steps to Good Web Design
Note: this article was written in the mid-1990s. Today, increased recognition of standards-based design — not to mention the advent of Web 2.0 — has changed the face of the Web. Nevertheless, the advice below remains relevant.
Building a web site is easy. Armed with basic keyboarding skills and numerous free resources, anyone can create a site in minutes. That's just the problem. Anyone and everyone is doing it. As a result, the Web is getting clogged up with sites (these days it's blogs) that are just plain bad. Sites that exhaust one's patience or crash your browser. Frivolous sites. Ugly sites. Confusing sites. Sites that don't do what they're supposed to do. There's an aesthetic crisis taking place on the Web. For those who are about to enter the fray, this article is offered in the spirit of aiding better design and facilitating clearer communication.
It may seem like stating the obvious, but start by determining the goal of your web site. This will help you assess the scope, complexity, and cost. You wouldn't believe how many people I've worked with who want a web site, but can't answer the question "Why?" For them, the compelling reason seems to be "because everyone else has one." Sit down and define what you hope to achieve from your web site before you plunge into the design phase. Many web sites are intended primarily as advertising. Do you plan to actually do business over the Net? Take orders and close sales? This will require a more sophisticated site, and security will be an issue. Will you use your web site for ongoing customer service and support? Do you have PR concerns that need to be addressed? What about long-term plans? Will you eventually require an Intranet (web site internal to your organization)?
You'll need to choose a domain name and decide whether to hire a consultant or do it yourself, as well as whether to host the site internally (in which case you'll have to deal with hardware and security issues) or with an Internet Service Provider or web hosting service.
Identify the key stakeholders in your organization and involve them early on in the process. Make sure that the people who need to have input into the content and design of the site do. And, very importantly, designate up front the person(s) who will ultimately have responsibility for ongoing site maintenance. Neglecting this key detail can be disastrous - I've seen several cases where someone has worked hard on a web site project, only to have another department hijack the site and send it back to the drawing board.
Plan the site carefully. Again, it may seem like stating the obvious, but lack of planning is the reason behind many bad sites. When I teach HTML and hand out a web page design assignment, 9 out of 10 people gleefully rush to the computer and start coding immediately. Only once have I seen someone take out a pad of paper and sit back thoughtfully with pen in hand. Storyboard your web site. Plan it on paper. Draw flow-charts. Figure out how people will interact with the site, what information they'll want to see first, what path they'll follow through your site. Where your links will go. (For example, a lot of web design gurus believe you should bury external links several levels down, since these can function as a springboard straight out of your site. That way, people will only discover them once they have thoroughly explored your site.) Turn on the computer only when you're satisfied that you've got a handle on the structure and organization of the site. Use templates to aid consistency and speed up the coding process.
Unless your site is designed primarily for entertainment or targets the 15-24 demographic, avoid whiz-bang effects. Resist the urge to use technology for technology's sake. I can't emphasize this enough. If you're serious about communicating with the people who visit your site, avoid the temptation to use gadgets like frames, Java/Javascript, animated GIF's, or scrolling text, and exercise restraint with graphics, sound, and video. Many of these admittedly "cool" effects not only gobble up bandwidth and slow down the loading of your page, but seriously annoy many people. It requires powerful and sophisticated hardware and software, not to mention a fairly high level of Net literacy (software has to be downloaded or plug-ins installed on your site visitor's computer for many of these effects to work), for people even to be able to experience your streaming audio or Shockwave animation. Most won't have the patience, and will leave your site before it has finished downloading. If you're inclined to use these effects, ask yourself why. Do they aid communication or obstruct it? (Note: I use Javascripted drop-down menus in this web site, but a non-Javascript alternative is provided for those who surf with this functionality disabled.)
Make sure there's a response device, and that you are clearly identified throughout the site. Again, a frequent mistake. I can't tell you how often I've wanted to contact a webmaster, but found that there was no tool available for that purpose. It's not hard to include an email link. Make sure people visiting your site can tell quickly and easily who you are and how to get in touch with you, and include this information throughout the site. Make it easy for people to reach you, especially if you're planning to do business over the Net. If you have an 800 number, include it in your web site (but make sure you state clearly any geographical restrictions that apply - remember, the web is a global medium).
On this note, be sure to include navigation links liberally throughout your web site as well. Remember that, with today's powerful search engines, someone may not necessarily enter your site from the top, but several levels down. If you are not identified, and if you haven't given them the ability to move around your site or to get to the top, you've just wasted a valuable opportunity.
Test, test, test. Test your page on different computers, at different screen resolutions, with different browsers. Macs vs. PCs. SVGA resolution vs. VGA resolution. Firefox vs. Explorer. Try different versions of Firefox and IE. You may be shocked at the results. Unlike designing for the printed page — where you have complete control over the ultimate result — on the web you have very little control over how people will see your page. Your beautiful 16 million colour graphic looks adequate in 65,000 colours, but it's likely to look hideous at SVGA's 256 colours. Text may wrap in the wrong places. Your beautiful layout may look like scrambled eggs to someone using a non-graphical browser. Your carefully tested CSS floats may be playing peek-a-boo with site visitors using a different browser or screen resolution. Design for lowest common denominator, and you can be confident that your site will look really great to someone equipped with state-of-the-art hardware and software.