Effective Arts Websites, Part 2: No More Than Six Buttons

First off, don't panic. I know that it is impossible for you to live within the budget of six navigation bar buttons. Nevertheless, you must face a fundamental limitation of the human brain -- we can immediately recognize groups of 1, 2, 3, 4, 5 and (some of us) 6, but beyond that we have to start counting. We can't tell the difference -- at a glance -- between groups of 8, 9 or 10, and yet in a quick survey I did of arts websites, the median number of navigation bar buttons was 9.
The secret is to use one or more subsidiary navigation bars.

(NOTE: The websites I show are not meant to be paragons. I picked them very quickly the night before I presented this material at the Fall 2010 Arts Reach conference because I wanted them to be fresh, and it was scary how easy it was to find both good and bad examples.)

Good Example 1



The Atlanta Symphony Orchestra's website is delightful for a lot of reasons, but for the moment I'd like to highlight their carefully planned navigation bars. Almost all of the information on the home page appears within the first screen for people with typical browser and monitor settings, and the three navigation bars are easy to pick out, differentiate and prioritize. The main bar starts with "concerts & tickets," which is perfect because that's what most people come to the site for, and it's a lot better than merely "concerts" -- a section that might or might not have links for ticket buying. (Some arts website in fact do not offer "buy now" links in their season description section, forcing visitors to remember what they were interested in buying while they search for the "buy tickets" page. Shocking, but true.)

The next three buttons are used for background on the music, the venue/area and the orchestra -- again perfect because education, helpful tips and insider information are very influential in getting first-timers and nibblers to come back. The last two buttons feature the symphony's education mission in the community and the fact that it needs donations too. Again, perfect. "Your relationship with us goes well beyond ticket transactions and date nights," is the message.

Notice what's not there too -- no self-focused "Board", "Gift Shop", "Our Maestro", "Press/News" or "Contact Us" buttons. Those options are available -- just not at the primary, customer-focused level of the main navigation bar. "Press" and "Contact Us" appear in the five-button secondary navigation bar at the top right corner, which crucially also includes "Shopping Cart" and "Donate" buttons. The e-commerce industry has settled on the top right corner for financial transaction buttons, so it not only makes it easier for shoppers, it also underscores the meta message that "Your goal here is to buy tickets or donate money."

Good Example 2

Arts websites do not have to be built on e-commerce platforms and use the "shopping cart" lingo of e-commerce to be effective. The main navigation bar delivers the key messages with just six buttons (or five if you don't count "Home"), with less important choices on the the secondary navigation bar above it. The meta message of "performing arts venue with a wide variety of acts" comes through quickly because of the rotating billboard (showing Clay Aiken in the screen capture) and the immediate start of the upcoming show descriptions below the header. Visitors receive information gradually, in chunks they can digest before moving on.

Poor Example 1

Wow. I don't know what to look at first on the Springfield Symphony homepage. I'm overwhelmed with 13 choices on the main navigation bar at the left and at least 7 more choices on the secondary navigation bar on the right (there are more choices not shown here). As a result of the chaos, my eyes retreat to the top right corner with the bright red box offering me tickets for what I don't know and "Peter's Page," which communicates "if you don't know who Peter is, then you don't belong here" loud and clear. The navigation bar on the right mystifies me because it visually highlights choices that for the most part require a pre-existing level of knowledge and commitment. The visitors who are already committed patrons do not need visual highlights, while those who are truly new to the symphony need to discover the basics without the distraction of secondary or tertiary messages demanding their attention.

Poor Example 2

Evidently, the designer of the California Theatre Center's website has not received the memo that nobody uses frames, surfers don't like frames, and if you insist on using them, they should be invisible to the user's experience. The awkward navigation frame on the left includes 11 links and three phone numbers -- that you can see. There is more information below the bottom of the frame that users must use the frame's scroll bars to see. Depending on visitor's connection speed, the navigation frame is all they will see for several seconds or minutes as the enormous graphic to the right loads -- leaving visitors not only overwhelmed with links, but confused about what the site has to offer and why anyone should care.

Poor Example 3

Despite this site's command to "be impressed," I'm not. There are several areas I might choose to address, but I'm showing it here because it's button issue is easy to fix. For some odd reason, four of the nine buttons on the primary navigation bar are repeated below in the show-off secondary navigation bar. The easy way to make the site's navigation more comfortable for visitors would be to remove the repeated items from the primary bar, leaving an easily digestible five buttons.

Coming up in the next "Effective Websites" post: Part 3 -- Paving an Easy Path to Order

Free Blog Themes and Free Blog Templates