Best Practices for the Color Usage:  

• Challenges of Text on Images and Patterned Backgrounds 

Assessing contrast becomes more complex when text is placed over an image or a patterned background. Variations in brightness and color within the image can create areas of low contrast, making parts of the text difficult to read. 

To improve contrast in such scenarios, consider the following solutions: 

• Add a solid background behind the text to create a strong contrast: A semi-transparent overlay can also be used to enhance text visibility while preserving the background image. 
• Darken or lighten the image so that the text remains distinct against the background. A blurred or dimmed effect can help emphasize the text. 
• Use text outlines or shadows to improve contrast when an image background cannot be altered. 

By implementing these strategies, you can ensure that text remains legible in all contexts, maintaining accessibility while preserving the aesthetic appeal of your content. 

• Don’t Rely on Color Alone 

Color should not be the only visual element that conveys information, indicates an action, or distinguishes content. Incorporate other elements like text or icons to convey meaning. 

 When color is the only visual cue, individuals with color blindness or those who use grayscale settings will have difficulty understanding your content. Additionally, screen readers do not communicate color information to users. 

      See below for additional information on:

• Use High-Contrast Color Combinations  

• ►Colour Usage

Additional Tips 

• Create additional ways to present information by adding text labels, underlines, or bold-face. Failure to meet these standards may make text difficult for users with visual impairments to perceive. 
• Microsoft recommends using the Color Contrast Analyzer, a free downloadable application to check for color contrasts. 
• For more information, check out the WCAG 2.2  for detailed guidance on ensuring your web and document content is fully accessible.