07/01/2007
Until a year or so ago, fly-out navigation wasn't often used for professional web sites, being mostly relegated to:
- Trendy retail stores such as the Gap, BMW, etc.
- Small companies (<$5m per year) trying to look like medium sized companies ($50-500m per year)
- Sites who's target market are "urban trendy" people (who are technically savvy)
- Sites where the design is the most important element; for example, a trendy furniture store in Soho might decide to put form (design) over function (usability), as part of their business differentiation.
Even major IT and Web-based companies choose not to use fly-out navigation because:
Lost Visitors - A few years ago, we surveyed about 100 major brand names and only found 2 non-flash sites that used fly-out navigation - Saturn and Caterpillar. We conducted a standard usability test on these two sites in all browsers over a 1% or greater market share. We found that both of those sites were not usable at all for a significant percentage of web users, and had a host of display issues for many others. Most companies can't afford to build a website that might not be navigable by 1-5% of their visitors. Seriously, what retail store would turn away 5% of their potential customers at the door?
Usability - Based on our user testing, there are no "standard" expectations for fly-out navigation. Fly-outs can confuse less computer savvy people, as well as web users in non-technical fields (although this is slowly becoming less of an issue, as more sites embrace them).
It's A Crutch - In the industry, "fly-outs" are often called "mystery meat navigation," since you don't know what will show up inside of them. In our experience, the main reason people want fly-out navigation is that they don't want to invest the time or money in developing intuitive/useful navigation; that's like telling a friend, "You don't need directions to my house - it's in Alabama, you can't miss it."
Cost - We're not going to lie: if you expect fly-out navigation to work well, expect it to cost more to develop. The navigation should be tested on all top browsers, and a client still has to be willing to ignore minor display issues (i.e. Between Firefox 1.1, 1.2 and 2.0 the navigation will "jump around" and might look slightly out of alignment.) Testing should also include "fringe" cases; such as how does the right-most navigation item look if you only have an 800x600 screen? Do the navigation choices cause people to scroll right? There's no 100% solution.
Might Not Work On New Browsers - Maintenance costs may increase to ensure the navigation works with new browsers.
Limited ROI - Usability studies have proven (fairly conclusively) that the "3 click rule" is a myth. Users don't have a clear perception of how many times they click, as long as they have the scent of information. You can get the same results (in terms of satisfaction) by having users click as many times as needed; spending money on simplifying navigation may only end up complicating it.
Search Engines Don't Like Fly-outs - Fly-outs make it harder for search engines to catalog the pages in your site; there are workarounds for this, but that does add cost.
Accessibility - Depending on the technologies used to implement the navigation, fly-out navigation can create many problems for users with special accessibility needs (i.e. blind users with screen readers, users with limited motor control, etc.)
Changing Times
Recently, we have seen more and more "mega-companies" using fly-out navigation (albeit sparingly) on their websites. This is mostly due to some recent changes in browser market share (most notably the shift from IE5 and IE5.5 to IE7 and Firefox).
Companies who don't use this sort of technology on their home page:
BBC, NYT, CNN, Apple, Bank of America, Dell
Companies who have recently started using this sort of technology on their home page (in last 12 months):
Ebay, HP, IBM, Delta, Disney
Companies who use a mouseclick to bring up more content
(instead of a rollover):
Yahoo (see below), Citibank, Google (changed in last month)
Companies who go above and beyond:
Yahoo has a pull-down menu in the upper right (requiring a click), if you go to their site with an older (unsupported) browser you get a completely different Yahoo site. This is expensive, but well within Yahoo's budget. It may not be a wise decision for companies with smaller budgets, as this can greatly increase development and maintenance costs.
In our opinion, the most valid reasons to use fly-out navigation are:
- Intranets: If there is an internal audience where the saved clicks will translate into a real savings of significant time/money.
- Web applications (sites which are tools that people use often).
- Sites that can validly be Flash sites (audience is more interested in form over function) and search engines don't matter - a good example would be a movie promotion site.
- Companies where money really isn't an issue (like Yahoo).
- If a key decision maker loves the latest gadgets and won't be happy with the site unless it has "that thing" he "saw on this cool website the other day."
Gravity Switch is an experienced web/multimedia design firm with a knowledgeable and friendly staff. For information about working with Gravity Switch please call [413] 586-9596 or email us!