Skip to content.
Table of Contents

Background

General information for help in thinking about different parts of digital accessibility.

Should I use an accessibility overlay?

There are two types of accessibility overlays: Temporary bandage solutions, and permanent plugins. The use of a permanent plugin is incredibly problematic.

Dyslexia fonts

A quick overview of dyslexia fonts.

Introduction to WCAG 2.x

A quick overview of WCAG 2.x documents.

Introduction to the Web Accessibility Initiative

Key facts about web accessibility initiative, what it is, and why it exists.

An in-depth guide to ARIA roles

ARIA roles are one half of the predefined categories of attributes used to describe elements that may not exist natively in browsers or may not be understood by screen readers and other assistive technologies.

ARIA states

A quick introduction to ARIA's states.

ARIA properties

A quick introduction to ARIA's properties.

Understanding color blindness

What is color blindness, and how can we design with it in mind?

What is color contrast?

What is color contrast and why do we need it for web accessibility?

Getting started with ARIA

Introduction to ARIA, describing Roles, States, and Properties and when to use ARIA in HTML.

A primer to vestibular disorders

Key facts, definitions, demographics and causes of vestibular disorders.

A primer to visual impairment

Key facts, definitions, demographics, causes, challenges and future of visual impairment.

Myths

Common misconceptions and falsehoods about accessibility.

Alternate text and automation

Alternate (alt) text help people who use assistive technology understand images, and are a core part of the Web Content Accessibility Guidelines (WCAG). They require a human’s input to be effective.

ARIA Has Perfect Support

ARIA is a very useful tool for helping to enhance accessible web experiences, but it should only be used when no other options are available.

People who use screen readers don't use JavaScript

97.6% of all screen readers have JavaScript enabled.

Accessibility is 'blind people'

A brief explanation of the four categories of accessibility.

Quick tests

Things you can quickly try out to check for inaccessible experiences.

Resize text

How to test the Resize Text WCAG Success Criterion.

Large touch targets

How to determine if your touch targets are large enough to be used.

Check comprehension level

you can check the reading level of your written content by using these tools.

Check contrast with your mobile device

Using an ordinary mobile device you can check your site's readability.

A quick accessibility test that you can run on your sites right now.

Quick tips

Short, easy-to-digest and easy-to-implement accessibility-related information.

Everyday Accessibility

Make your social media, digital document, and multimedia content more accessible with these quick and practical steps.

Links are used on almost every site on the web, however it is easy to create links that are not accessible to all.

Browser Keyboard Navigation in macOS

How to enable full keyboard support in browsers on macOS.

a11y and a brief numeronyms primer

The numeronym 'a11y' is shorthand for 'accessibility.'

Never remove CSS outlines

Removing CSS outlines without proper fallbacks can make it impossible to navigate your site with a keyboard.

Don't auto-play video, music and more

Why you shouldn't auto-play anything that could distract the user from their main task.

Never use maximum-scale='1.0'

Why you never ever should use maximum-scale='1.0' in your viewport meta tag.

ARIA Landmark roles and HTML5 implicit mapping

Use ARIA Landmark Roles to help assistive devices navigate the markup.

Using alt text properly

A few tips on how and when to use the alt attribute. Make sure the text is helpful and most importantly meaningful.

How-to

Guides to implementing accessible code.

Use the tabindex attribute

tabindex is a global attribute that allows an HTML element to receive focus. It needs a value of zero or a negative number in order to work in an accessible way.

Designing accessible animation

A general guide to designing more inclusive animation and what to avoid along the away.

Enabling keyboard culture with No Mouse Days

Tips on ditching your mouse and creating more accessible experiences.

Create accessible forms

Practical tips on how to create accessible forms.

Create accessible data tables

What you need to create an accessible data table.

Use placeholder attributes

How-to use placeholders on input elements.

Using captions with HTML's video element

How to implement captions for HTML video element.

Use skip nav links to ease keyboard user fatigue and frustration.

Use title attributes

Avoid using title attributes except in a few special circumstances.

Hide content

How-to hide content but still make it accessible to screen readers.

Use role='application'

Never use role='application' on a widely containing element body if your page consists mostly of traditional page elements.

Future-proofing your accessibility efforts

Ways to help make your accessibility efforts are as future proof as possible.

Assistive technology

Background information on the tools used by people who rely on them to navigate digital devices and interfaces.

Fixing contrast issues, on your own site and elsewhere

Insufficient text contrast is the most common accessibility issue on websites today, even though by and large be automatically found and fixed. The Fix Contrast browser extension fixes contrast issues for end users.

Text resizing in iOS and Android

Things to keep in mind for designing accessible mobile apps.

Getting started with VoiceOver on iOS

How-to guide to the basics of navigating around on an iPhone using Apple’s VoiceOver screen reader, included in iOS.

Learning common keyboard shortcuts for screen readers

Keyboard shortcuts are hard to learn. Here are some other ways that can help that learning.

Operating System and Browser Accessibility Display Modes

A quick overview of navigating a webpage using the NVDA screen reader.

Getting started with NVDA

A quick overview of navigating a webpage using the NVDA screen reader.

Getting started with macOS VoiceOver

How-to guide to the basics of navigating a webpage using Apple’s VoiceOver screen reader, included in macOS.

Write for us

We're always looking for people who want to share what they know about accessibility.