Flash wmode considered harmful

Despite the emergence of the <video> element in HTML 5, Shockwave Flash is still the de-facto standard for publishing multimedia on the Web. Macromedia, and now Adobe have improved the support for assistive technologies and software interfaces like Microsoft Active Accessibility (MSAA) within the Flash browser plug-ins. And, it is now possible to create a video player in which all the controls and status information are perceivable by screen reader users. So all the challenges to do with Flash have been overcome, no problems? Wrong.

I and others have uncovered what appears to be a little publicised or little known flaw that renders some of the “embed codes” displayed at sites like YouTube, Vimeo et al completely inaccessible.

Recently I’ve been evaluating Flash media players and I noticed that while many players were fairly accessible, one was not at all. Initially I blamed the media player itself, but then I noticed that the wmode parameter in it’s embed code was set to opaque. Further tests have revealed that anything but the default value window completely hides the Flash player from MSAA and therefore screen readers. Web Accessibility in Mind note this as a technique to hide decorative Flash. Stephanie Sullivan has also written (archive) about this (2nd to last paragraph), however I think the advice in these articles leaves something to be desired. The Flash content of a page, for example when you embed a movie in a blog post, is often not eye candy, it’s the whole focus of the page. And providing ‘text-only’ alternatives in the blanket fashion suggested at ‘lessfussdesign’ is often a bad idea (Archive).

OK:

<object data="player.swf">
    <param name="wmode" value="window" />
    ...

Inaccessible:

    <param name="wmode" value="opaque" />

    <param name="wmode" value="transparent" />

My tips are to avoid setting the wmode parameter unless you absolutely have to (that is, stick with the default value), and if you must, then provide a full HTML/Javascript user-interface (that is, all buttons and status/progress information). An example is Christian Heilmann’s excellent Easy YouTube (wmode is not set to opaque/transparent in this case, I hasten to add).

I tested with Inspect32, part of the Microsoft Active Accessibility kit and the NVDA screen reader.

I’m currently working on fixes for the oohEmbed code (also here) and the Drupal video filter module. The premise for these fixes is that in at least 90% of the cases where this code is used the default for wmode is acceptable.

Feel free to comment on any other embed code or software which needs fixing – and volunteer to submit fixes! (23 September 2009.)

Background: Web Accessibility in Mind (WebAIM) – Flash techniques.