1.1. These standards ensure that the use of colour on BBC Online is suitable for people who have some form of colour-blindness, vision impairment or have difficulty in reading text.
2.1. Information being conveyed with colour MUST be available without colour also, i.e. from context or mark-up.
2.2. Navigation controls MUST be identifiable and usable without colour cues or mouse-over, e.g. you MUST distinguish link text from non-link text by text style (underline, bold, italic) as well as colour (see Text Link Standards).
2.3. The information conveyed in diagrams and multimedia MUST be able to be perceived without using colour cues, e.g. lines/areas on graphs SHOULD NOT just be differentiated by colour, but also by style (dotted, dashed etc.) or labels.
2.4. Any information in images which relies on colour MUST be made clear in the alt-text for the image or in the surrounding body text. This does not apply to furniture images.
3.1. All colour combinations MUST have brightness contrast >=125 and colour contrast >=400 (Hewlett Packard colour contrast standard). You can check the colour contrast between two colours using Hewlett Packard's Colour Contrast tool or Juicy Studio's Luminosity Colour Contrast Ratio Analyser.
3.2. The graphic text/background colour combinations in banners, diagrams, and multimedia MUST be checked in the same way. These are even more important to get right because the colours cannot be customised by users by overriding with their own style sheets.
4.1. You MUST NOT use any colour combinations which will be indistinguishable by people with a form of colour-blindness (see Vischeck/Colour Vision Simulator Examples for details).
4.2. You MAY use Vischeck's colour-blindness image checker on your Image Files.
4.3. You MAY also apply Vischeck's Daltonise tool to "fix" the image for colour-blind users.
4.4. You SHOULD do a final check that the editorial content of the page is visible, using Vischeck's colour-blindness tool: Vischeck/Try Vischeck on a Webpage.
Take a screen grab (PC) or use Paperazzi (Mac) to grab an image of your page.
On the Vischeck site select 'Run Images' from left hand menu.
Select type of colour blindness from menu, select image file to be analysed and 'Run Vischeck'.
For a more detailed look at any specific section of image, grab that specific section of screen and repeat.
Check that the colour blindness emulation complies with the Colour Contrast Standard.
Repeat the above for each type of colour blindness; Deuteranope, Protanope and Tritanope.
4.5. You SHOULD also check that your colour choices will not interact with each other when they are displayed on a CRT/TFT (gamma, moiré, bleeding etc.).
5.1. You MUST define both the text and background colours of all textual areas on a page in a CSS style sheet, so users can override your colours with a style sheet of their own.
|20/03/2009||v1.5||Minor change: URL to Juicy Studio Analyser in section 3.1 updated to link to WCAG 2.0-compliant test. Explanatory notes also added.||Ed Lee||25/02/2009||v1.4||Minor change: updated URL to Juicy Studio Analyser in section 3.1.||Ed Lee|
|17/11/2008||v1.3||Minor change: bbc.co.uk replaced with BBC Online.||Victoria Jolliffe|
|23/10/2008||v1.2||Details added about using the Juicy Studio analyser in section 3.1.||Victoria Jolliffe|
|24/9/2007||v1.1||No changes other than trying to make the standard clearer and simpler to be more usable.||Gareth Ford-Williams|
|25/09/2006||v1.02||Added the instructions (section 3.2) for testing a page using the Vischeck colour blindness simulator, recommended by the Accessibility work group.||Gareth Ford-Williams|
|28/06/2006||v1.02||HP standard adopted over W3C standard by Design Forum.||Tred Magill|
|14/06/2006||v1.01||Adopted W3C standard, as recommended by Accessibility WG and approved by Technical Forum||Tred Magill|
|19/01/2006||v1.00||Removed outdated reference to Sitemorse in Section 6.||Tred Magill|
|15/12/2004||v1.00||Standard renumbered as 1.00 on approval by Standards Exec||Jonathan Hassell|
|24/09/2004||v0.6b||Updates to triggers for iTV application, ref to Durham Uni research||Jonathan Hassell|
|18/06/2004||v0.6||More tidying (links)||Jonathan Hassell|
|04/06/2004||v0.5||More tidying||Jonathan Hassell|
|03/06/2004||v0.4||Tidying up & clarification before Colour-Contrast subgroup meeting and additions in Colour-Contrast subgroup meeting||Jonathan Hassell|
|11/02/2004||v0.3||Added in comment regarding web-safe colours||Jonathan Hassell|
|23/01/2004||v0.2||Updates after 1st meeting of Colour-Contrast subgroup||Jonathan Hassell|
|21/01/2004||v0.1||First draft of document, based on G-KW/JH's Colour Contrast Research document and G-KW's Understanding Colour Blindness document.||Jonathan Hassell|
Like all other Future Media Standards & Guidelines, this page is updated on a regular basis, through the process described on About Standards & Guidelines.
This page is best viewed in an up-to-date web browser with style sheets (CSS) enabled. While you will be able to view the content of this page in your current browser, you will not be able to get the full visual experience. Please consider upgrading your browser software or enabling style sheets (CSS) if you are able to do so.