Minimum contrast requirements for maximum accessibility
According to the WCAG (Web Content Accessibility Guidelines), a good contrast ratio starts at 4.5:1 for regular text. 1.0:1 means that something is contrastless and 21.0:1 means that something has the maximum possible contrast. Large texts (from 18pt) and bold text (from 14pt) are easier to read and therefore have a lower minimum contrast ratio of 3.0:1. Minimum contrast ratios also apply to elements on the website without text , such as tables and graphs. A minimum contrast difference of 3.0:1 applies to these. There are a number of exceptions. For example, you do not have to adjust your logo to meet the accessibility requirements.
Curious if your website meets these guidelines? Here are some handy, free tools to test your color contrast.
Contrast-ratio.com : Website where you can easily enter the foreground and background color to calculate the color contrast.
Contrast Checker : Website of Acard Communication, a Canadian advertising agency, where you can enter colors and calculate the contrast.
Colour Contrast Analyser : This free tool tells you the contrast value of two selected colours. You can also see immediately whether the combination meets the requirements of WCAG 2.1.
Step 2. Enlarge font
People with a visual impairment often have difficulty reading small letters. It is therefore important that users can enlarge the font on your website without any problems. Sometimes they use a magnifying glass for this, but more often they enlarge the letters on the website itself. This can be done in various ways. For example, with digital france telegram data magnifying glasses in the browser or with enlargement software. Even people with healthy eyes sometimes need larger letters. For example, if their eyes are tired.
In Success Criterion 1.4.4 of WCAG 2.1 the following is mentioned about enlarging the font:
All text must be able to be enlarged up to 200% without software, without loss of content or functionality. Captions or images of text do not fall under this criterion.
Increase the font size on your website by 200% and ask yourself these questions:
Is the text still readable?
Can you still easily find your way around your site?
Is everything still functioning properly?
Within each operating system a free option is offered to zoom in: