Wood and Wire

In my day job I often have to write accessibility / usability reports on web sites (both professionally produced and student projects). I see a lot of very well written and pretty-to-look-at sites, but I’m constantly amazed to see web developers (even the professionals) making the same usability design mistakes over and over. This the first of a series of my tips on how to avoid those mistakes.

Many of these mistakes are examples of what I refer to as designing for the board-room rather than designing for the user — sites that would look fantastic in a client presentation running on a fast computer with a fast connection, but in some cases almost no thought has been put into how the average user would interact with the site, or in some cases how they would even find it in the first place.

Mistake 1: Flash Abuse

We all know Flash can be a great tool for creating compelling, interactive content. However, if used thoughtlessly it can cause serious usability and accessibility problems.

Tip: Accommodate Users Who Don’t Have Flash

There aren’t many of these left (maybe 2-3% of users), but they deserve something better than a bald error message. At the very least you could tell them politely that they need Flash, why they need it, and where they can get it.

Tip: Accommodate Users With Old Versions of Flash

This is a much bigger problem, as with each release of Flash Macromedia encourages developers to create content that uses all the latest features, which will then only work with the latest version of the Flash plug-in (v.8 at the time of writing). Macromedia haven’t even started reporting the market penetration of version 8 yet, but even version 7 penetration is somewhere around 85-90%. If you want to reach the widest possible audience you should think carefully about those users who are still on versions 6 or 7.

Quite a few of the sites I looked at only worked with v.7 and higher. Accessing Flash 7 or 8 content with an old Flash plug-in can often create a very unsatisfactory user experience including browser crashes and sites that appear to be completely “broken” with no indication as to the cause of the problem.

The best solution is to identify the user’s Flash version from within your Flash movie so that it displays some sort of upgrade prompt to users who have older plug-ins. Actionscript has a built-in variable “$version” which makes it very easy to do this. Take a look in your Flash manual!

Tip: Accommodate Search Engines

Most search engines can’t index Flash content. Even the ones that claim to, generally don’t do it very well. If all your content is inside Flash, users won’t be able to find your site using a search engine. Recently, I saw a professionally produced educational site where all the content was embedded in one huge flash file. The page had no indexable text (not even in the title tag!)

This approach could easily reduce your potential audience by a factor of 10. Here are some example strategies for overcoming this problem:

• Provide a “plain HTML” version of the site as an alternate version. Give each page a prominent link to its Flash equivalent. Search engines will find the HTML version, and users who wish to can click through to the Flash version. This can also solve Flash accessibility issues (see below), and help address the compatibility issues outlined above. This is a very good solution if you can manage it.
• Just use Flash in the parts of the page where you need its functionality — e.g. a Flash navigation panel or video player. Flash is an inefficient way to lay out simple text and graphics, so why not use HTML for that purpose?

Tip: Accommodate Disabled Users

Macromedia have provided some tools for developing accessible Flash content. However, it is still quite difficult to make Flash content fully accessible. Make sure you consult the WAI checklist. Often the simplest solution is to provide an HTML alternative, as suggested above.

Tip: Use Bandwidth Intelligently

Chances are, you’ve developed your Flash presentation off-line, so during the developments phase the site will seem snappy and responsive. But what happens when you place the files on your web server?

Flash developers often neglect to think about how their project will work across a network. Wherever possible, start testing your Flash content over the Internet early in the development process. Avoid “top heavy” designs where the user has to download large Flash files just to navigate the site. Users will tolerate a larger download once they are inside the site and they know what they are waiting for. Try to “modularise” your Flash content, so that the site requires a number of small downloads instead of one really big one. Remember to use informative “pre-loaders” whenever a large download occurs.

Most web developers have broadband, but many of your audience members won’t. You should make sure your site performs tolerably well over a narrowband connection. The preview movie function in Flash provides tools for modelling different connection speeds. If you can’t manage to get your Flash content working over narrowband, provide an HTML alternative.

Tip: Don’t Break The Page Metaphor

If you create Flash sites that use a page metaphor (i.e. clicking on a link changes all the visible content on screen), make sure that each “page” is contained in a separate HTML document. Web users have come to rely on basic browser functionality such as bookmarking, the status bar, the address bar, the back button etc. Embedding a multi-page Flash site in a single HTML document takes all this functionality away from the user. Many users will resent this disempowerment, and disabled and inexperienced users may find your site difficult to navigate.

Tip: Don’t even get me started on splash pages…

Next → Javascript Abuse

This entry was posted on Sunday, December 4th, 2005 at 8:13 pm and is filed under Tech, Web Dev, Flash, Web Design Mistakes. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.