Skip to main content

Search

Sort & Filters

Filters

Content type
Assistive Technologies
Disabilities
Elements
Page Categories
Principles
Technologies

14 results for "High contrast mode"

14 results for "High contrast mode"

A Deep Dive into Contrast Themes

News

People use Contrast Themes to improve their experience of sites by radically changing their visual display to enhance perception and access. Site designs often don't need to account for them but it's worth checking whether there are barriers present or...

✎ Technique: Non-text contrast

Page

The contrast of icons and graphical objects is just as important as that of text. Use sufficient contrast for all elements on the screen, with a minimum contrast ratio of 3:1.

Structure

Page

Make sure that the semantic meaning of your content is preserved, even if the visual display changes or the content isn’t visible.

✎ Technique: Using color to convey information

Page

Color is a powerful visual means of presenting or distinguishing information, but when you use color to identify or distinguish information, make sure that this information is still available to people who can't perceive color.

✎ Technique: Writing headings

Page

Headings are used to group and label sections of content, giving visual structure to the page and providing a means of navigation to screen reader users.

✎ Technique: Required fields

Page

A clear indication that specific form fields are required can save users time and avoid potential errors relating to missing data when a form is submitted.

✎ Technique: Describing graphs

Page

Some people understand complex information best when it's presented visually, such as as a chart or diagram, while others find that reading the information suits them better.

✎ Technique: Text and images of text

Page

When text is presented as an image of text, that limits peoples' ability to change the appearance of that text. So wherever possible, use text along with CSS to apply styling.

✎ Technique: Identifying headings

Page

Headings are important orientation aids, and they help people quickly identify the content on your page. When headings are correctly identified, they also allow screen reader users to quickly navigate from heading to heading.