You are here: Homepage > AcceDe Web Guidelines > Graphic and functional accessibility guidelines > 2. Colours > 2.3. Make sure that information is comprehensible, even if the colours are absent

2.3. Make sure that information is comprehensible, even if the colours are absent

Information must not be conveyed solely by colour.

Pie chart, a percentage is associated with each portion, the color of each portion is shown in the legend and the color is the only way to connect the portion to its label.
In the first example, the information in the pie chart can only be understood by associating each segment with a colour.
Same pie chart, a percentage and a legend are associated with each portion.
The second version is comprehensible even if the colours are absent.
For each EDF entity, colored squares refer to a legend indicating "Production", "Distribution" and "Services".
In this first example, squares of different colors are used for the legend. Information is conveyed only by this means.
For each EDF entity, icons indicate whether the entity performs production, distribution and/or services. A legend placed after the list indicates the meaning of each pictogram.
While in this version, the color squares have been replaced by pictograms. This makes the information understandable even in the absence of colors.
5 links navigation menu, the background color of the active item is different from the other items.
In this first example of a navigation menu, information regarding the current position (“Investors”) is only conveyed by a change in the background color.
5 links navigation menu, the background color and shape of the active item is different from the other items.
While in this version, the addition of a downward pointing arrow makes the information understandable even in the absence of colors.
5 navigation chips in a carousel, the middle chip has a different background color.
In this first example of a carousel navigation system, the information regarding the current position is conveyed only by the color change.
5 navigation chips in a carousel, the middle chip has a different background color and size.
While in this version, the shrinking of the current position makes it possible to make the information understandable even in the absence of colors.

Comments

Add a comment

All fields are mandatory.

Back to top