Table of Contents
Featured Post
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.
Experiences
Lived experiences shared by disabled people.
The power of ChatGPT as a cognitive accessibility assistive technology for Traumatic Brain Injury survivors
This essay explores the use of ChatGPT as a cognitive accessibility assistive technology for traumatic brain injury (TBI) survivors.
Blind people need to be considered more when making data visualizations
As a blind journalist, I’m concerned that the increased use of visual data representation without careful and creative thought about accessibility is widening the inaccessibility gap.
Disability: let’s say the word
In hesitating to use the word ‘disability,’ people are unwittingly reinforcing the stigma that having a disability is a bad thing.
How I deal with colorblindness as a digital product designer
What it means to be a colorblind designer and what the main problems are that someone with colorblindness can encounter if they decide to pursue a career as a designer.
Background
General information for help in thinking about different parts of digital accessibility.
What is Semantic HTML?
The Web Accessibility Initiative is W3C's effort to improve accessibility of the Web for people with disabilities.
A guide to troublesome UI components
Some UI components that have non-trivial considerations to use in an accessible way.
What is WAI? The Web Accessibility Initiative
The Web Accessibility Initiative is W3C's effort to improve accessibility of the Web for people with disabilities.
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.
Accessibility and SEO
SEO and accessibility have a lot more in common than you would think. Many of the same practices that we use to further enable people to enjoy our digital experiences are also great for search engines.
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.
Navigate using just your keyboard
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.
Starting a design with accessibility
Three quick tips to help us design more accessibly.
Reviewing a design for accessibility
Reviewing designs for accessibility is a great way to help designers think more accessibly and to help developers implement more accessibly. We can use short checklists to help us make sure we haven't missed any big things.
Everyday Accessibility
Make your social media, digital document, and multimedia content more accessible with these quick and practical steps.
Creating valid and accessible links
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.
Are you making these five mistakes when writing alt text?
When you ask them, most experts’ advice also boils down to: Describe what you see. And while it’s valid advice and may seem simple, it’s not.
Use Firefox for accessibility testing
Firefox has become one of the best tools for accessibility audits. Let’s go over Firefox’s accessibility features that you can use today.
Accessible heading structure
Headings are the backbone of the content of a page. A visitor should be able to scan or navigate a webpage using headings to get a good impression of its content.
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 navigation links
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.
Getting started with TalkBack on Android
A brief overview of getting started with TalkBack version 13.1 on Android.
Getting started with Orca screen reader on Gnome desktop environment on Ubuntu 20.04 LTS
A quick overview of getting started with Orca on Gnome desktop environment on Ubuntu 20.04 LTS.
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.