Use your design to enhance information, not distract
Use features such as animation and video to add to your content, rather
than to distract from it.
Ensure multimedia is inclusive
Ensure multimedia does not exclude information from those who
cannot see, hear or play it.
The use of video players to play multimedia content should be
avoided. All video content should use HTML5 to play MP4 or OGG
For embedded multimedia, supply a link to a standalone version.
Provide controls to skip, pause or stop the presentation.
Offer different download sizes. Information on the file size should be
included on the page.
Provide captions for multimedia, so that it can be understood by
all members of the public regardless of the volume the multimedia
is played at. This is an important consideration as one in seven of
members of the public have hearing difficulties.
Where captions are not provided, provide transcripts for the
multimedia. This can be provided either on the same page or as a
link to a transcript on a different page.
Avoid content that flashes more than three times per
High flash content may cause seizures among some people.
Some key guidance when using images includes:
When uploading an image or graph, supply the same information
through Alt Text.
Avoid text within images.
Create good contrast between text and background
The contrast between the text and the background affects how easy it
is to read information.
Key guidance on colour contrast is as follows:
Make sure there is strong contrast between the text and the
If using white text, make sure the background colour is dark enough
to provide sufficient contrast. Contrast is best when using very dark
colours together with very light colours.
Avoid combining yellow and blue, and green and red, as these are
difficult for people with colour blindness to distinguish.
Pale text on a dark background typically makes text look smaller, so
you may need to increase the size and weight of the text to make it
easier to read.
Avoid placing text in front of an image or patterned background, as
this makes it more difficult to read.
Print your page in greyscale. This will help identify if you have
Use a contrast analyser to ensure there is enough contrast
between the foreground and background colours. WebAim
provide a online colour contrast analyser which also gives
guidance on the contrast ratio for normal and for large text.
Toolkit for the Public Service
– A Universal Design Approach
Digital and Web Based
Communication Systems and Services