Color contrast is crucial for making content accessible to all users. It refers to the difference in brightness between text and its background. Adequate color contrast ensures that users, including those with low vision or color deficiencies, can easily perceive content on the page.
Our base website templates at Digital Common are crafted with color contrast compliance in consideration. However, when incorporating background colors or images into landing page sections, it's important to ensure there's sufficient contrast for effortless readability.
Best Practices for Color Contrast
- When adding or embedding charts and graphs, use colors that create the most contrast between the content and the background. Measure color compliance with a color contrast checker like WebAIM's Contrast Checker.
- Pay attention to color contrast on landing pages. If you add background color or images to bands on landing pages, ensure there is a lot of contrast. The background behind the text should not be busy.
- Do not use color alone to convey meaning. Communicating with color alone creates barriers for users with visual impairments. Information conveyed with color must also be communicated textually. Use patterns, shapes, or other visual differentiation to be effective.