The internet is a powerful resource for information, communication, and services. In many ways, it is a great equalizer, granting access to a treasure trove of information and connections to all who log on.
But imagine for a moment that you can’t use your keyboard due to a severe tremor or paralysis and that operating your mouse is impossible. Now turn off your screen and pretend you’re visually impaired for a moment. The World Wide Web isn’t so freeing all of a sudden.
Have you ever wondered what it takes for everyone—including people with disabilities—to use websites and apps with ease? This is where web accessibility comes into play, and why web accessibility should be at the forefront of any choices we make about design or development on our own sites.
In this article, we’ll break down what web accessibility means, why it matters, how it’s enforced, and how you can make your own web pages more accessible. We’ll also introduce key concepts, guidelines, and tools to get you started.
What is web accessibility?
Web accessibility refers to designing and developing websites, web applications, and digital content so that people with disabilities can perceive, understand, navigate, interact with, and contribute to the web. This includes ensuring that web content is usable by people with various impairments—such as visual, auditory, physical, speech, cognitive, language, learning, and neurological disabilities.
Accessible websites and apps enable equal access for all users, regardless of their abilities or the assistive technologies (like screen readers) they use.
While it can be disheartening that not everyone reaps the benefits of the web, there’s a lot you can do to make your sites accessible to more people, like folks with the following conditions:
- Visual impairments: Blindness, low vision, color blindness
- Hearing impairments: Deafness, hard-of-hearing
- Motor/physical disabilities: Difficulty using hands (hence unable to use a mouse), paralysis and need to use special assistive tools to access the web.
- Cognitive disabilities: Learning disabilities, memory problems, attention disorders
- Speech impairments
- Seizure disorders: Sensitivity to flashing content
- Limited bandwidth: Unable to load large files, images and videos
Why is web accessibility important?
Web accessibility is crucial for several reasons.
1. Inclusivity
Over a billion people worldwide live with some form of disability, including visual impairments, hearing impairments, cognitive impairments, and motor disabilities. Making your website accessible would ensure that this group of web users are able to use the internet and your website effectively.
2. Legal requirements
Besides the moral imperative of helping our fellow humans, there are legal reasons to build accessibility into your site. Many countries have laws (like the Americans with Disabilities Act (ADA), the Rehabilitation Act of 1973, and the European Accessibility Act (EAA)) that require digital accessibility. More information on that in the next section.
3. Better user experience
Accessible websites are easier to use for everyone—including people without disabilities, older users, and those on mobile devices or with slow internet.
4. SEO benefits
Many accessibility best practices (like using headings, alt text, and semantic HTML) also improve search engine optimization.
5. Wider audience
Making your website accessible opens it up to more people and can improve your brand image.
How is website accessibility enforced legally?
Website accessibility is enforced differently around the world:
- In the US, Section 508 of the Rehabilitation Act and the ADA require certain organizations to meet accessibility requirements.
- In Europe, the European Accessibility Act (EAA) sets accessibility standards for digital products and services.
- Enforcement can include lawsuits, audits, and penalties for non-compliance.
The Americans with Disabilities Act (ADA) provides that public venues must be accessible to people with disabilities. In 2017, more than 7,600 lawsuits regarding ADA compliance were filed against website operators. Most relate to websites that aren’t accessible to the legally blind or visually impaired.
Other applicable legislation includes Section 508, an amendment to the Workforce Rehabilitation Act of 1973. Passed in 1998, this requires that electronic and information technology developed by or purchased by federal agencies must be accessible to people with disabilities. This only applies to a subset of webmasters, but it’s important because it provides actual guidelines. Section 508 incorporates WCAG 2.0 (more on this in a moment).
So there are legal reasons to whip your website into accessible shape, too.
Web accessibility is all about breaking down barriers that prevent visitors from interacting with your content.
You can accomplish this by following defined guidelines when coding your site. That’s it — in many cases, a few characters or words of code in the right places will do the trick. In some situations, the work can get more involved, but it’s still worthwhile.
Whether your reasons are moral, ethical or legal, learning about web accessibility should definitely be on your agenda.
The accessibility community is active on social media and there are always worthwhile conversations happening. Search for the “a11y” (shorthand for “accessibility”) hashtag on Twitter and other social media. “A11y” originated from the letter “A” + 11 letters + y in the word “accessibility.”
Related: The basics of accessible web design
Examples of web accessibility
One common example is providing alt text (alternative text) for images. People with visual impairments or blindness often use screen readers—software that reads aloud web content. If an image on a web page lacks alt text, the screen reader can’t describe it to the user, resulting in lost information.
Other examples include:
- Ensuring sufficient color contrast between text and background for people with low vision or color blindness.
- Making sure all functionality can be accessed with keyboard navigation (for users who cannot use a mouse).
- Providing captions or transcripts for multimedia (videos, podcasts) for people with hearing impairments or who are hard-of-hearing.
- Using clear headings and structure in HTML markup to help those with cognitive disabilities or using user agents like screen readers.
Web accessibility guidelines: what are the 4 principles of web accessibility?
To figure out how to make a website accessible, webmasters (and judges) turn to the Web Accessibility Initiative (WAI) group of the World Wide Web Consortium (W3C) for Web Content Accessibility Guidelines (WCAG). These aren’t laws or regulations, but voluntary guidelines for making your website welcoming to all, without turning aside people with disabilities.
A lot of the WCAG guidelines overlap with Section 508 requirements. If you’re curious, this article does a side-by-side comparison of WCAG and Section 508. If you’re not a federal contractor, WCAG should be your go-to. Many webmasters aim for both WCAG and Section 508 compliance since they overlap quite a bit.
The WCAG guidelines (currently version 2.1) are organized into a checklist. Don’t be overwhelmed by all the information at that link. The document is a comprehensive effort to define accessibility standards, and you don’t have to meet every one of them to make your site accessible to most people. In fact, checklist items are categorized as A, AA or AAA. Companies can aim for compliance at level A (lowest), AA (mid level), or AAA (highest).
AA is the target level for many businesses. AAA is typically reserved for special dedicated software.
The guidelines are organized around four principles:
1. Perceivable
Information and user interface components must be presentable to users in ways they can perceive. This includes standards such as providing text alternatives for non-text content, adaptable content.
2. Operable
User interface components and navigation must be operable. For example, all functionality must be available from the keyboard.
3. Understandable
Information and the operation of user interface must be understandable. This includes, for example, a requirement to identify the primary language of the page.
4. Robust
Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies. This means being certain to use valid markup, for example.
Conforming with level A brings basic compliance to your site. With each level you step up, the more accessible your site becomes.
Tips for hitting the basics of web accessibility
Hitting the basics of web accessibility is pretty easy to do, although when you dive deeper the issues and solutions can get a bit more complex. If you can’t get into full WCAG 2.1 compliance right away, there’s still plenty you can do to make your site more accessible. Here are seven easy starting points:
1. Identify the language of the document
Help screen readers identify the primary language used in the document. You can easily do this in html: <html lang="en">.
2. Use meaningful page titles
Every page title should adequately and briefly describe the content of the page. Every page should have a unique title that distinguishes it from other pages.
3. Use alt tags on images
Make sure all images include equivalent alternative text (alt text). So the pic of your company headquarters, for example, would be defined as <img alt= "company headquarters photo" src="hq.jpg">. Without the alt, the image essentially doesn’t exist for a visually impaired visitor, search engines, or people who have turned off images.
4. Don’t require a mouse
Everything should be workable from a keyboard, as many people cannot use a mouse, including many older users and people lacking fine motor control. If your site is workable from a keyboard, it will also be workable from an assistive technology that mimics a keyboard, such as speech input.
5. Provide transcripts for audio
Without a transcript, your audio file is likely inaccessible to people who are deaf or hard of hearing. As an added plus, your transcript will be searchable and add to your SEO. If you don’t want to do it yourself, use a transcription service.
6. Make link text meaningful
Users should be able to determine the purpose of the link from the link alone and/or its context.
7. Proof your page for proper tag closure
Missing open or close brackets can really mess up a screen reader so be sure your pages are properly formatted. Use this markup validation checker to find potential errors.
You’ll notice that a lot of these items are also good for SEO, so you’ll get double bang for your buck on any accessibility work you do. The above steps are starter moves, but they’ll greatly improve your site’s accessibility with minimum work. See the WCAG guidelines for even more you can do. Learn more about WordPress accessibility.
Web accessibility resources
The tough thing about boosting accessibility is that there are a lot of rules to follow to lift your site up to a high accessibility level, especially if you’re working with legacy code. However, even if you’re never planning make it all the way to WCAG AA compliance, you owe it to your users to take as many steps as feasible to make your content accessible. Start by assessing your site with one of these accessibility assessment tools (for some of these you’ll have to trade your contact info for the report):
Chrome Dev tools: Dev tools has a built-in assessment tool you can access under the Audits tab. This basically checks if a page is properly marked up for screen readers and looks at other accessibility issues.
AChecker: Check individual HTML pages for conformance to accessibility standards.
PowerMapper: Checks up to 10 pages for accessibility plus other problems such as broken links and SEO issues.
If you’re a WordPress dev, you’ll be happy to hear that as of March 2016, all new or updated code released into the WordPress core and bundled themes conforms to WCAG 2.0 Guidelines at level AA. In the WordPress theme repository, you can search for themes with the “accessibility-ready” tag. Plugins are another story, as they are not audited by anyone for accessibility.
Web accessibility and your workflow
Web accessibility isn’t just about meeting legal requirements—it’s about providing a better web experience for everyone. Ensuring web accessibility is an ongoing process. Make it automatic by following these three steps:
- Become familiar with WCAG guidelines and practices.
- Build a checklist into your workflow to make sure new content meets accessibility needs.
- Scan and update existing content.
By following WCAG, using assistive technologies, and employing the right accessibility tools, you can create digital content that everyone can use, regardless of their abilities or disabilities.
Web accessibility checkers will give you an idea of your starting point. From there, you can organize a plan of attack that will make your site open to all users, or at least as many as possible. Any step you take in the right direction is a good step. Remember: accessible websites benefit everyone—users, businesses, and society as a whole.
Frequently Asked Questions (FAQs) about web accessibility
Here are some frequently asked questions about web accessibility and building an accessible website.
1. Is WCAG certification possible?
There is no official "WCAG certification" by the W3C. However, you can claim WCAG conformance if your website meets the criteria of WCAG 2.0, WCAG 2.1, or WCAG 2.2 at a certain level (A, AA, or AAA). Some third-party organizations offer assessments or certifications, but these are not formal W3C endorsements.
2. How do I know if my website is ADA compliant?
To check if your website meets ADA and WCAG requirements:
- Review the Web Content Accessibility Guidelines (WCAG).
- Use accessibility evaluation tools (see below).
- Conduct manual testing (including with screen readers and keyboard navigation).
- Consider professional accessibility audits.
3. What tools can I use to test web accessibility?
Numerous accessibility evaluation tools can help you identify accessibility issues:
- WAVE (Web Accessibility Evaluation Tool)
- axe by Deque
- Lighthouse (built into Chrome DevTools)
- NVDA (screen reader for Windows)
- JAWS (screen reader for Windows)
- VoiceOver (screen reader for Mac/iOS)
- Color Contrast Analyzer
- Siteimprove Accessibility Checker
- Tenon.io
- Accessibility Insights
These tools can check for missing alt text, low color contrast, incorrect headings, keyboard accessibility, ARIA issues, and more.
4. How can I improve the accessibility of my website?
Here are some accessibility solutions and best practices:
- Use semantic HTML markup: Proper use of headings, lists, links.
- Provide alternative text for images: Describe images for screen readers.
- Ensure sufficient color contrast: Use tools to check contrast ratios.
- Make all functionality keyboard accessible: Ensure users can navigate and interact using only the keyboard.
- Label form fields: Use clear labels and instructions.
- Use ARIA (Accessible Rich Internet Applications) attributes: For dynamic content and advanced UI controls.
- Provide captions and transcripts for multimedia: Videos, audio clips.
- Structure content logically: Use headings, lists, and landmarks.
- Avoid flashing content: To prevent seizures.
- Test your site: Use both automated tools and manual testing with assistive technologies.
5. How can I make my website more accessible?
Accessible design should be part of every stage of web development:
- Plan for accessibility from the start.
- Follow web accessibility guidelines (like WCAG 2.1).
- Train your team on accessibility best practices.
- Regularly test and update your site to fix new accessibility problems.
- Consider accessibility in your apps, web applications, and all digital content.
Further Resources:
- W3C Web Accessibility Initiative (WAI)
- WCAG Overview
- Section 508 of the Rehabilitation Act
- European Accessibility Act (EAA)
