Colours
People who cannot see a full spectrum of colour benefit most when there is a strong contrast between text and the background colour. Certain colour combinations cannot be seen by everyone, such as people who have red-green colour blindness. People who see in only black and white will not see content easily if it is presented using midrange colours against similar backgrounds.
Colour Deficiency
Colour deficiency can be broken into roughly two categories:
Red - Green Deficiency – Causes people to be unable to identify certain shades of red or green. This type of colour deficiency is the most commonly inherited type and tends to impact men more than women.
Blue - Yellow Deficiency – This causes the person to have difficulty differentiating between blue and green.Yellow could be perceived as grey or purple.
Poor Colour or Contrast Examples
What We See
| Dark text on a mid-range grey background |
Red-Green Colour deficiency. Red background with green text |
Yellow-blue colour deficiency. Yellow text on a blue background |
Light text on a white background |
What people With Different Colour or Vision Deficiencies Might See
| Dark text on a mid-range grey background |
Green text on a red background |
Yellow - blue colour deficiency. Yellow text may appear purple. |
Light text on a white background |
Good colour contrast examples:
| High contrast white text on grey background | High contrast white text on red background |
High contrast light text on dark blue background |
High contrast dark text on a white background |
Images
Images: Images are an important feature of the visual experience of a website, but sometimes you can have too much of a good thing.
The Web Content Accessibility Guidelines (WCAG) recommend avoiding using images of text if you expect the text to be read by the user, unless it's necessary such as in a logo or brand name, in which case the alt text should be the same as the text in the image.
Section 1.4.9 of WCAG: Images of Text (No Exception): Images of text are only used for pure decoration or where a particular presentation of text is essential to the information being conveyed. (Level AAA)
The best time and place to use images is to add visual appeal to a page and to support the content of the page, but NOT to use an image to communicate that content.
For instance a news or events posting can have photographs integrated within the page, but the images should NOT use text to communicate any portion of the actual posting.
Below is an example of an image that should NOT be used on a website:
Below is a good use of images and text:
The Beauty of the Saint Mary's University
Beauty can be seen all over the Saint Mary's University campus year round.