Netskills Corner: Multimedia Web Design

Paul Garrud, Issue 8 of Ariadne, looked at how multimedia might be used online in a medical context (patient education), and started from the premise that “ one shouldn’t neglect the presentation and visual impact of educational packages because they engage the user’s motivation, attention and aesthetic sense”. Paul nicely encapsulates in one sentence the difficulties of designing with multimedia in mind. In Issue 12 of Ariadne Brian Kelly discussed how widely some of the newer Web technologies are being used in UK university and HE college home pages. So, exactly how easy is it to incorporate multimedia elements in Web pages, and is it a good thing?

Well, like most things in life, the answer is “yes and no”. This is the subject of an entire Netskills one-day workshop (“Creating Multimedia Web Pages”), but in this article if we first look at some examples of how easy it is to insert multimedia objects into our pages, and how frightfully easy it is to make an absolute pig’s ear of our pages as a result, then maybe we can come up with some sort of general guidelines as to what we should and should not include, and when.

Let’s start with the most accessible (and perhaps the hardest) aspect - the part about which absolutely everyone will have their own views: the aesthetics of multimedia. Personally, my own all-time favourite site for showing the aesthetic dos and don’ts is the Bud Uglly site, at http://wwwvoice.com/bud/bud.html. This site deliberately breaks all the rules on colour, animations, spelling, etc. Incidentally, for an extremely well-argued expose of “bad” examples, see Vincent Flanders’ Pages that Suck, at http://www.webpagesthatsuck.com/home2.html. Smile we may, but how easy in fact is it to justify, formalize and quantify our reactions? One way is to break multimedia on the Web into discrete parcels or technologies, and see whether we can arrive at a consensus of when a particular technology might prove useful.

Always thinking of the twin issues of impact and universality of access (presumably the key reasons why we want a Web presence in the first place) Web multimedia objects fit neatly into the three areas of

Animation

Video

Audio

Animation

Animation can mean that old favourite, the ubiquitous animated image (“animated gif” - those eye-pulling little rotating images on Web pages) or else text which is animated in some way. GIFs pre-date the Web, and so any graphics-capable browser can handle animated GIFs. The somewhat newer manifestation of animated text can be achieved using animated GIF technology, or it can be achieved using the newer technologies of Java, JavaScript, ActiveX, Shockwave or QuickTime to name but a few. These newer technologies are not only about animations, of course, but they can be used for that purpose on a Web page, perhaps with the added bonus of sound effects. They only work on recent browsers and even then, users may have to obtain a (free) plug-in to enable their browsers to handle them.

You can create your own animated text online via the Web without having an ounce of know-how about the newer technologies: to see how easy it is, go to: http://www.zyris.com/ and follow the instructions, or try an alternative at: http://www.mediabuilder.com/abm.html I promise you it’s fun for the author, but whether it’s fun for the final user is a moot point. So far as animated GIFs are concerned, they’re everywhere - for a somewhat eye-catching example, see: http://www.cimmerii.demon.co.uk/colourblind/ To find out how to make them, see the URL: http://cnet.com/Content/Builder/Graphics/Webanim/index.html (enthusiastic “let’s do it now” approach) or the (somewhat more thoughtful) site at http://members.aol.com/royalef/GIFmake.htm. If you’re interested in how to ensure your animated GIFs are as inoffensive as possible (ie “optimize” them), have a look at the URL http://www.webreference.com/dev/GIFanim/

All very well and good, but when should we use animations? When you want to attract attention, maybe in a “splash” or entry page; above all, the trick is NOT to place an animation near any text that you want people to read carefully - animations are terribly eye-pulling and distracting. They make good advertising banners - most effective “click through rate” is when they’re placed at the bottom right of a page. They are fun, and an easy way to liven up a site, especially when used thoughtfully: for example, there’s no need to have the thing whirring away at top speed, and there’s no need to assume the image has to rotate through 360 degrees - sometimes a simple, slow, left and right movement is just as effective; use a few deep colours and a clear font; where animations are concerned, perhaps the message “less is more” is appropriate.

In theory, animations could be used in an educative way (to show progression over time, or transitions of some sort, for instance), but I’ve seen very few examples. Perhaps one good example of an educational use is the illustration of a molecule’s composition, at the URL http://chemdept.uwsp.edu/pdbs/. Of course, you’ll need a plug-in from MDL Information Systems Inc. called Chemscape Chime to view it. You begin to understand now some of the problems about incorporating multimedia objects in your pages…

Generally, animations are good in that they don’t usually “take over” the user’s page: the user can normally stop them, and in fact some animations involve intervention by the user (for example, manipulation of a molecule). ActiveX “controls” actually invite the user’s intervention - as navigation aids through a site, for example - though remember that ActiveX frequently works best with Internet Explorer rather than with other browsers, one of the very good reasons perhaps why it doesn’t figure highly on institutional home pages.

Video

Video (“movies”) is the ultimate luxury: moving pictures, sound, ambience, immediacy, you name it; yes, and HUGE files. Only practicable on the Web as a supplement to your pages’ central message - and even then best used as a trailer for active themes (eg. dance or entertainment rather than an advertisement for, say, a thrilling new PC lab) or as a trailer to another movie. Apart from the sheer size of movie files, there are other considerations:

• For one reason or another users may be unable to view or run the movie at all.
• Quality - users get frustrated with poor quality movies.
• Image - be sure that the image portrayed in the movie is the one you want to project: you will be judged on the way you speak, your gestures, tacky-looking buildings/decor/environment, difficult foreground/background colour contrasts, etc.
• Behaviour modification: users will modify their behaviour on your site to avoid known pitfalls or sections which annoy them (page which are slow to download, for example, or seeing the same tired old out-of-date video clip every time they load a page).
• Alternatives need to be provided (textual transcripts for example, or audio, and/or subtitles); I’ve never yet seen this done at any site that I can recall.
• Information about information: file size; the format of the movie; the content of the movie; running time; stills from the movie so as to give the user the opportunity of judging for themselves whether they want to watch your clip; any necessary instructions. And all this without having the faintest idea of what software will be used to view your movie: will users know how to ensure audio is turned on; will they know how to operate any play or rewind buttons; will the clip look alright in a tiny viewing window; will the user be embarrassed or distract other people sitting in the same room?
• “Experts” from different backgrounds may have to meet and actually talk to each other (Audio Visual technicians may have to talk to Web administrators and to Departmental/corporate affairs staff, for instance).

The best way of considering these implications is to see an example: look at how movie clips are used to advertise a UK university, at the URL http://www.tees.ac.uk/video/ As a user, make a mental note of how just how many issues need to be resolved to make video successful on the Web, and then do a quick calculation of how much energy and enthusiasm will need to be continuously devoted to this aim by the providers of the Web page and by the people using the page.

Audio

Audio is a much more practical option. There’s less to go wrong, for a start! Generally it’s less all-embracing than video - while the audio file is playing or loading users can be doing something else (for example reading what a wonderful jolly place your institution is). Audio files are much smaller than video files, of course, although they can be quite hefty beasts in their own right, and there’s still the problem of many formats, and many audio players that the user can choose from. Overall, though, audio may be more educative than video for the following reasons:

• audio is great at establishing an ambience
• audio is a superb instructional tool in its own right (language work, or music, for example)
• audio on the Web poses a great opportunity for continuous commentary
• audio is less distracting than video
• audio is more accessible and less restrictive than video
• quality is less of a “mission-critical” issue than it is in video: the technology is cheaper, and the human ear is much more forgiving and intuitive than is the eye
• audio can add to (rather than supplant) other Web objects: for instance you could supply differing audible “clicks” to different navigation buttons - left and right, or correct and wrong; don’t depend on audio, though, to provide the sole means of navigating your site.

Again, the same issues of providing alternatives, and providing information, apply to audio just as much as they do to video. Perhaps even more than video, be aware that tastes change, trends in markets come and go, and what you consider to be actually rather a neat street-cred, groovy, hip-hop happening sound may in fact place you unequivocally in some sad parallel universe of no interest to your more worldly-wise visitors.

To see some examples of how audio is used educationally (and for fun, too) see the following URLs:

Commentary: http://www.bbc.co.uk/radio5/live/live.html

Language: http://zeta.broonale.co.uk/falklands/slang.html

Music: http://www.bagpiper.com/links/piping.html

So, after a brief gallop through the multimedia traps of animation, video and sound, are we any nearer establishing a set of golden rules, as intimated at the start of this article? We can probably draw out some general guidelines:

• Assess the need and relevance for multimedia: do your users (and your providers!) really need it?
• Be prepared for the extra maintenance: files/formats/alternatives/transcripts/information/instructions/help menus/co-operation of others/hardware and software considerations/rigorous testing/updating and modernisation
• There are other overheads: you (or someone else) will have to become very au fait with the finer nuances of HTML: although it’s not difficult to incorporate multimedia in your pages, it’s time-consuming to do it properly (for example, learning to use consistently the HTML attributes of ALT and OBJECT properly).
• You will need to be critically aware of copyright and ownership issues.

Multimedia summarised in one (longish) sentence? How about this: “Multimedia on the Web is a jolly good thing when relevant and well-managed: it’s what the Web should be all about: a lively, universal, interactive, stimulating, educational, intuitive medium offering lots of alternatives, and for those very reasons multimedia is a disaster when it demonstrates a failure to deliver.”

Author details