Colour is often used as a way in which to visually distinguish important information on a page. However, Web Content Accessibility Guidelines advise against doing this solely based on colour because this can be a problem for visually-impaired or colour-blind users who are not able to discern the additional meaning implied by different colours.

Example of using poor contrast colours in text links

You can still use colour if you add some text to provide additional contextual information so that users do not have to rely on colour alone to determine the full meaning. This is one way of reinforcing the importance of the information you are presenting, and succeeds in making the same information even more accessible to users who are able to perceive the difference in colour. 

Ensuring Colours are Readable

Using colour can be an effective way of presenting information to users – however, some colours are better than others! Some colours can be difficult to read depending on the colour of the text and the colour of the background. Readability depends on the contrast between these two colours. 

Light text colours on a light (or white) background provide very poor readability, so if you want to use colour as a design element of your site, it is important to check that it provides a contrast ratio of at least 4.5:1. 

To do this, you need to know the numerical value of the colour you are using. In Blackboard, you can do this by clicking on the Text Color button, and clicking More Colors:

Click the More Colors button

From the Color Picker menu, you can see the numerical value of the selected colour in the field at the bottom left:

Get the numerical colour value from the bottom left field

In this case, the numerical value for orange is FF9900. To check if this compatible with a white background (which has a value of FFFFFF), you can use the webAIM contrast checker tool at https://webaim.org/resources/contrastchecker/

Enter values for the foreground and background to see the contrast ratio, and find out if this complies with the WCAG2 standard:

Conversely, there are instances when selecting too high a contrast can pose its own problems. Many people with dyslexia can have difficulties reading black text on a white background. Consider changing black text on resources to very dark grey instead.