Principles of Web Page Design
The purpose behind every web page is to transmit information. How the page looks, though, can influence how well that information is transmitted. Anyone can put up a web page. Remembering a few basic principles will make your page more useful and credible:
- Know Your Audience
Although most sites will have unknown users accessing it, you should know your primary clientele. Who your clients are and why they access your site are the primary influences on its content, but they also influence design. Does your institution mandate the use of a particular platform or browser, or will platform and browsers be mixed? Does your institution have a sophisticated user group? Does it have a technology training program designed to uniformly educate users?
- Emphasize Substance over Beauty
The design of your website should emphasize your message. Design elements shouldn't get in the way of the information you want to convey. But remember that an attractive page will be more likely to hold the viewer's attention.
- Keep it simple
Balance design sophistication with ease of use. Remember that including new and innovative web design capabilities will almost always complicate use of your website. Elements that load beautifully and quickly on your brand new whiz-bang computer connected to your institution's T1 (or better) line may completely frustrate users with older equipment and/or those connecting via modem. Draft your friends to test your website from home.
- Identify yourself
Search engines may lead users to lower level pages on your site, not to your home page, so put a link to your site's home page on every page. Make sure that your institution is identified on every page, in a way that's clear to the users. Acronyms for your institution, such as "UTHSCSA", don't mean anything to most people, so spell out the name or link your acronym to another page with contact information, including a mailing address, phone number (with area code), and email addresses. Remember that people from other institutions may want to get in touch with your staff, so include a staff directory with phone numbers and email addresses.
- Clear and simple navigation
Make sure your website's navigation is easy to understand. Your users should be able to find the information they need with just a few clicks. Use terms that are familiar to your audience. Do your users know what "Interlibrary Loan" means?
- Be consistent
The same banner (graphic, text) should be at the top of every page, and the same information (footer) at the bottom of every page. The navigation bar and buttons should also occupy the same place on every page. Choose a color scheme and stick with it. Decide how to format page titles, paragraph headings, phone numbers, etc.
- Current content
Keep your content up-to-date. You might want to put a date at the bottom of each page to show when it was last revised or reviewed. Highlight what's new with a special icon or under a "What's New" heading.
Webliography
Web Style Guide, 2nd Edition
http://www.webstyleguide.com/index.html
Basic principles of website design including page layout, graphics, and writing for the web.
Page Resource.Com
http://www.pageresource.com/
Tutorials on web development including HTML and stylesheets plus help forums, original articles, and pointers to other sites. Site design articles: http://www.pageresource.com/zine/index.html.
Viewable With Any Browser: Accessible Site Design
http://www.anybrowser.org/campaign/abdesign.shtml
Tips to help make your site accessible to all users, no matter what browser they're using.
Usability.gov
http://www.usability.gov/
Resources for designing usable and accessible websites. From the U.S. Department of Health and Human Services.
Web Design and Usability Guidelines
http://usability.gov/pdfs/guidelines.html
Research based guidelines for navigation, headings and titles, links, content organization and more.
Quick Tips to Make Accessible Web Sites. W3C Web Accessibility Initiative.
http://www.w3.org/WAI/References/QuickTips/
A summary of key concepts of accessible web design, from the World Wide Web Consortium.
Writing for the Web
http://www.sun.com/980713/webwriting/
Writing for the web is different from writing a print article.
Web Content Style Guide: Writing for the Web
http://www.gerrymcgovern.com/guide_write_01.htm
Excerpts from the book.
Jakob Nielsen's Alertbox
http://www.useit.com/alertbox/
Regular articles on website design and usability. Check out the "Top Ten Web Design Mistakes" of each year.
Web Pages That Suck
http://www.webpagesthatsuck.com/
Classic site that emphasizes learning good design from bad examples.
