Images and multimedia
Consider the pros and cons before using images and multimedia
Advantages
- convey information more quickly than when using text
- make complex information simple
- enhance online teaching and learning
- enhance communication with some disabled groups, particularly those with learning difficulties or cognitive impairments.
Multimedia is necessary if you want to show movement or change over time or to demonstrate three-dimensionality.
Disadvantages
- take longer to download
- require the use of plug-ins that the user may not have or be able to install
- create accessibility barriers for some users.
Guidelines for images
- Avoid gratuitous use. Only use graphics when they provide a clear benefit for your users.
- Use an appropriate graphic format. JPG and GIF use different forms of compression. Use JPG format for photographs and GIF for images that have large areas of solid color. This produces the best quality image at the smallest size.
- Use an appropriate size - height and width dimensions. You should be able to view the image on a screen resolution set to 800 x 600 without a horizontal scrollbar appearing. If a scrollbar does appear at this screen resolution, you may be using an image that is too large. Also, try printing out the Web page, does it print with all page elements (including images) visible within the width of an A4 page?
- Optimize - height and width. Crop and scale images to an appropriate size. Do not manipulate the height and width attributes of the image tag used in HTML markup to make images look smaller than they really are. Users still have to download the large image, and this approach can reduces the crispness and apparent quality of the image.
- Optimize - file weight. Reducing color depth will reduce the weight (size in kilobytes) of graphics. Balance color depth and associated quality of the image against the need for a fast download time.
Making images accessible
When images provide information, you must provide a text equivalent for them
Where an image is used to provide information, a text equivalent must be provided by using the alt attribute.
<img src="openday.jpg" alt="First Day of Classes" />
When images are used for decorative purposes, no text equivalent is needed
Where images are used for decorative or layout purposes, the alt attribute must still be used, but should not contain any content. The best approach is to use an alt attribute that contains a space. The space is a workaround for older screen readers. They attempt to alert users to the existence of an image by substituting the file name. Newer screen readers accept that an empty alt attribute is deliberate, and ignore it. Using this workaround causes a small square to appear when a user mouses over an image when using Internet Explorer. To avoid this, use an empty title attribute in conjunction with a space in the alt attribute.
Where an alt attribute is missing, screen readers and text browsers will alert users. Sometimes the file name will be displayed, or the word "image" or similar may be used. This can cause unnecessary confusion. It is not acceptable to omit the alt attribute.
- Wrong: <img src="spacer.gif" />
- Right: <img src="spacer.gif" width="100" height="1" alt=" " title="" />
Guidelines for multimedia
- . Use an appropriate format. Use formats that support animation only where you need to show movement, three-dimensionality or transitions over time. Using an animated format for a company logo is usually not necessary.
- Use PDF only where it is critical to preserve the printed format of a document. PDF takes longer to download and it may not be accessible to blind people using screen readers.
- Use common formats and stay a version or two behind. Users are generally slow to upgrade, so save multimedia files so that they will be readable by an earlier version of the plug-in.
- Don't force it on users. Some sites use scripts to detect whether users have certain plug-ins installed and send them to the multimedia version of the site. Users should be allowed to remain in control of what they want to see and what they're prepared to spend time downloading.
- Provide an accessible alternative. Multimedia may not be accessible to some disabled users.
- Segment larger works into topical sections. Users may only be interested in a portion of your content, and this would allow them to download smaller and more relevant files.
Making multimedia accessible
Flash
Recent improvements have been made to Flash, but the format is not considered fully accessible.
- An alternative accessible version must be provided for all Flash content providing information needed by the site visitor.
- Never use Flash for navigation.
Video and audio
To provide accessible video and audio:
- provide transcripts for audio and video with audio
- provide captions and video descriptions (text describing the non-verbal parts of the video/audio)
- provide alternative formats (static images, animated GIFs).
