WCAG - Web Content Accessibility Guidelines - what it means for your colours

Tech Notes

There are many factors that have to be considered in designing a website that complies with the new WCAG (Web Content Accessibility Guidelines). Colour is probably the most important element during the design stage, making sure the contrast level is high enough to comply with the WCAG standard. The colour contrast ratio limitation in WCAG 2.0 (Section 1.4.3) makes picking colours challenging but thanks to tool such as the WCAG contrast checker at Webaim, colours are able to be directly adjusted by darkening or lightening as needed. The lowest contrast ratio allowed by the WCAG2.0 (Section 1.4.1) is 4.5:1, with the exception for larger text where the contrast ratio can be lowered to 3:1. For the example above we are able to get the colour we wanted provided that we only use it with a large font because of the contrast ratio limit. Colours also can’t be the only cue provided (Section  1.4.1) so text cues are also provided to highlight the importance of a certain section of the webpage. Marcela Pournomo