Multimedia on Mizzou Wire

| | Comments (0) | TrackBacks (0)

flash-icon.jpg

With the development of Mizzou Wire, Mizzou’s news and features Web site, we knew we were going to want to have multimedia with our stories — including slide shows, audio, video and other kinds of media we haven’t thought of yet. The challenge was finding a way to present all this information in a uniform way so the end user could easily view it, but also make it manageable for us to update using our content management system.

It took a bit of research and trial and error, but I think we’ve found a system that covers all the bases and doesn’t require a lot of money or programming time.

All Flash

When checking our Web stats, we found that almost all of our visitors had the Flash plug-in installed, so it was an easy choice to go all Flash with our multimedia.

Slide Shows

To present multiple images with a story we went with Slideshow Pro. It’s easy to use and has a ton of options. An example of a slide show.

Pros:

  • Inexpensive - $30
  • XML driven
  • Extremely customizable
  • Can include video

Cons:

  • Won’t sync to audio (can play background music)
  • Requires Flash to create slides shows
  • Actionscripting knowledge required for heavy customization

Slideshows synced to audio

To display a slideshow presentation that must sync to an audio file we went with Soundslides Pro. It seems to be the program of choice for journalism photographers and does a really good job of presenting a story. An example of an audio slide show.

Pros:

  • Flash not required to create slide shows
  • Easy to use
  • Inexpensive - $70

Cons:

  • Not very customizable
  • Loads the entire presentation on page load (bandwidth waster)
  • Not XML driven

Video or audio

When presenting video or audio, we went with JW Media Player. It plays almost anything and will play one file or a whole playlist. A video example with one file. An audio example with a playlist.

Pros:

  • Will play almost any kind of content
  • Inexpensive (free for non-profit)
  • Play one file or a playlist from XML
  • Can display an image with an audio file
  • Can include closed captioning

Cons:

  • Limited customization

How to embed

When embedding Flash content on our pages, we decided against Adobe’s default script that publishes out with SWF files. It’s a bit bloated and doesn’t do exactly what we want it to do. Instead we use the SWFobject script created by Geoff Stearns. It’s easy to use, standards compliant and allows for alternate content if the user doesn’t have JavaScript or a new enough version of the Flash plug-in. The alternate content is also readable to Web bots and screen readers, which helps with accessibility.

Since this method is JavaScript based, you can easily test how your alternate content will appear by turning off JavaScript in your browser.

Accessibility

The one disadvantage to presenting multimedia on the Web is poor accessibility. Screen readers and Web bots don’t see multimedia content and not all users will be able to access it because they lack the required software/hardware or they have a physical disability.

With Mizzou Wire, we made sure that every piece of multimedia has some sort of alternate way to get the content, so any user can access it and so search engines, like Google, can index it. Below is how we handle different types of media.

Slide shows: Captions are embedded in the page using appropriate XHTML tags and work with the SWFobject script. If the user has the Flash plug-in they are hidden, but screen readers and Web bots can still see them.

Video, audio or audio slide shows: If the audio has spoken word in it, a transcript is linked to as a plain XHTML page.

Make it work

I hope this quick rundown on how we handle multimedia was informative. As with anything on the Web, there’s always a variety of ways to do the same thing. This is how we decided to do things based on our situation. You’ll have to figure out what works best for you and your users. Like Tim Gunn says, “Make it work!”

0 TrackBacks

Listed below are links to blogs that reference this entry: Multimedia on Mizzou Wire.

TrackBack URL for this entry: http://webcom.missouri.edu/mt/mt-tb.cgi/44

Leave a comment

Note: Comments are moderated. If published, comments may be edited for length, style and clarity.