Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

When typing in text you want to consider the color contrast between the text and the background. For small text (under size 18), a good contrast ratio to aim for is 4.5:1 or higher. For bigger text (over size 18) a good contrast ratio is 3:1 or higher. Black text on a white background or 21:1 is considered to be the most accessible contrast ratio.

Contrast Example

...

Warning

This slide above has a contrast ratio of 1.13 : 1. This is very low and hardly visible to most readers.

A slide with a poor color contrast ratio.Image Removed

...

Tip

This slide above has a contrast ratio of 21 : 1.

Slide with a good color contrast ratio.Image Removed

Bullet List Example

If you create a bullet list, the points need to have a contrast ratio above 3:1.

...

Warning

The bullets in this list are light green and may have a low contrast ratio.

A shopping list with light green bullet points.Image Removed

...

Tip

The bullets in this list are dark green and have a higher contrast ratio.

A shopping list with dark green bullet points.Image Removed

Background Examples

Backgrounds with crazy features or patterns should be avoided at all costs. To check if your color contrast ratio is sufficient, you should use Adobe’s Color Contrast Analyzer tool.

...

Warning

This slide has a high contrast between the text and background, but the background pattern is very distracting.

A shopping list with a distracting backgroundImage Removed

...

Tip

This slide has the text on a plane background. A fancy background is still visible, but since it does not interfere with the text, it is okay to use.

A shopping list with an undistracting backgroundImage Removed

Section 2.2: Using Color to Convey Meaning

If you are going to use color to convey information, always include a text alternative. Color alone is not enough to show off information. For example, if color blind users look at a chart may not be able to read the data. They may also struggle to know which color belongs to which section.

...

Warning

This pie chart for the “Most Popular Sports in the USA” only uses color to represent the data. A person who is color-blind may not be able to tell the difference between the colors. Therefore they cannot read the data.

A pie chart on the most popular sports in the USA without data labels.Image Removed

...

Tip

This pie chart for the most popular sports has data labels to represent the data in addition to the color. Now all users can read the data much easier.

Pie Chart of the most popular sports in the USA with data labels Image Removed

After your pie chart is finished, you need to provide an alt text for the chart. To do this, right click on the chart and select Alt Text. The Alt Text panel will appear on the right side of the screen. Type in your alt text.

...

Tip

The chart has been provided an alt text.

The Alt Text panel open with an Alt Text for our Most Popular Sports in the USA chart.Image Removed

Section 2.3: Transitions and Animations

...