Bringing the local association online: guiding principles for developing a professional web presence: part two.

With blueprint in hand, you are now ready to begin the actual development of your association website. Effective design is dependent on good organization of material, clear navigational structure, proper choice and color combination and graphic interest, and judicious use of multimedia.

Working with Text

Clear text representation depends not only on the clarity of writing, but also on the density of information on the page and choice of fonts. Writing for the web is very different from prose or business writing, and requires concise, simple phrases. Information should be prioritized, with the most important statements at the top of the page. In addition, users should be guided through more text-heavy pages by subheadings that will allow them to scan the page to easily find information they are looking for, without having to read the text in its entirety. Be sure to take advantage of spell-checking tools to ensure accuracy.

In instances where a substantial amount of information is being presented (association bylaws, performance competition guidelines and so forth) break the text into logical units of information. Use anchors and bookmarks to help the user jump from one section to another. An anchor is a hidden piece of code connected to a link that takes the user directly to a specific part of the page when clicked. (See purple links in the graphic below)

[ILLUSTRATION OMITTED]

Finally, use clean and complementary combinations of fonts--usually no more than three. Serif fonts, such as the text of this column [Garamond] can be harder to read on screen, and are usually best for larger headings. When possible, opt for a Sans Serif font, such as the one used for this column's heading [Frutiger Bold]. Remember too, that not every computer has the same set of fonts, and a font that looks great on your computer may appear garbled or different on another. Universal font sets include Times New Roman, Arial, Geneva and Helvetica, among others.

Working with Images and Color

Images are an important way of providing visual interest to any web page. When choosing images, be sure they reinforce or explain page content and load quickly. When possible, avoid rotating images or animations unless you simply cannot convey the information any other way. Another important design element often overlooked is the inclusion of "alternate text" that lets the user know what the image actually represents. If for some reason the image does not display correctly, the alternate text will identify what is supposed to appear. This is critical for navigational images and icons.

It is also essential not to rely on images alone to convey information--doing so makes the text less accessible to users with slow connections or visual impairments. Every PDF file should be accompanied by a text version of the information and image maps should also have a text alternative.

Finally, place navigational icons in the same location on each page and use a consistent color scheme of complementary colors throughout the site. You can learn more about color and view different colors at www.visibone.com/colorlab/.

Working With Multimedia

Multimedia--sounds, animations, videos--can provide a great deal of value and interest to your association site. Like images, the use of multimedia should reinforce content that is expressed in the text. Of all the components of a website, multimedia requires the greatest deal of user intervention--that is, the user will often have to download a multimedia player, if it is not already present on their computer or adjust settings to access a particular file. It is important to give the user the choice to listen to music, rather than having it play automatically, and to inform them of the significant amount of time it might take to download the material. There are important copyright laws that govern the distribution of audio content, and it is important to be sure that all multimedia use falls within these guidelines. You can take a "crash course" on copyright law at www.utsystem.edu/ogc/intellectualproperty/cprtindx.htm.

Finally, as you begin designing the site, be sure to pay careful attention to balance and structure, white space and visual appeal. Like musical form, a website has its own sense of equilibrium and timing, and when constructed carefully is beautiful, as well as useful.

Editor's Note: This is the second column in a three-part series that focuses on developing a website. The first installment was featured in the February/March 2006 AMT on page 88. The third installment will be featured in the October/November 2006 AMT.

SOURCES

Krug, Steven. Don't Make Me Think: A Common Sense Approach to Web Usability, Second Edition. (New Riders Press, 2000).

Lynch, Patrick J. and Sarah Horton. Web Style Guide: Basic Design Principles for Creating Web Sites, Second Edition. (Yale University Press, 2002).

Part Three, the final column in this series, will focus on cutting-edge technologies, including Podcasting, which can round out a well-designed association site; it will appear in the October/November 2006 AMT.

Julianne M. Miranda is associate professor of music at DePauw University where she directs the music instructional technology pro gram. A consultant and clinician, she works with independent music teachers, schools and music-industry representatives.