What is Web Accessibility?
Web accessibility is the process of making web content more accessible to people with disabilities. This is done by following the Web Content Accessibility Guidelines (WCAG) 2. The goal of WCAG is to provide a single shared standard for web content accessibility that meets the needs of individuals, organizations, and governments internationally.
Web “content” generally refers to the information in a web page or web application, including:
+ natural information such as text, images, and sounds
+ code or markup that defines structure, presentation, etc.
Why is Web Accessibility important?
Making the web accessible benefits individuals, businesses, and society. One in four people in the United States has a disability, and most of us will experience a disability—a temporary injury, poorer vision as we age, etc.—in our lifetime. Therefore, it is important to make sure that the web is accessible to all.
Additionally, websites that meet WCAG AA standards tend to perform better in search engine rankings and can better tap into the buying power of the millions of people worldwide currently living with disabilities, making web accessibility a smart business decision too.
Web Accessibility Foundations
List of statistics (with links) related to web accessibility
A set of high-level guiding principles/philosophies for approaching web accessibility
Effort to make digital accessibility easier by breaking down complex WCAG topics
Longer read (PDF book) that digs deep into web accessibility and why it’s important
Guidelines/Quick Reference
Quick overview of the accessibility guidelines most relevant to and influenced by designers
Quick reference guide of the easiest to implement and most common WCAG violations
Comprehensive guide for structuring, labeling, and tagging content on your site to be more accessible
Covers when to use what units in order to maximize accessibility on your website.
Guide to designing carousels that are more accessible
Guide for properly using and creating ARIA labels (method of describing a component in ways that assistive technologies can reliably interpret)
Cool Tools
Tool to see how color contrast can affect different people with visual impairments
Simple tool to check contrast between two colors (Figma now offers this natively, but this site gives a good breakdown of the various compliance levels)
Check URLs to identify WCAG errors
Input URL to see how your website performs on the web, including speed and accessibility issues
Comprehensive color palette generator with different modes to check contrast and ensure WCAG compliance
Bonus
Newsletter that features design and UI/UX links, including often ones about web accessibility