At Web Ascender, we strive to build websites that everyone can use and enjoy equally. Building an accessible website means all users, including those with hearing, vision, mobility, or dexterity limitations, can use and understand your site. In this blog post, I’ll explain more about web accessibility, and outline some of the key components to building an accessible website. By following these guidelines, website visitors with disabilities will be able to enjoy your content, products, and services.
What is Web Accessibility?
When I talk about accessibility, I am talking about creating a website or application that can be used by anyone, including users with a disability. Generally this means having difficulties hearing or seeing content or being unable to use a mouse. The goal of accessible web design with respect to those with vision loss is to be able to interact with the website using voice commands and a screen reader. For those that are deaf, it means that any audio or video content must also be transcribed and have appropriate captions. For those unable to use a mouse, it means making the site usable with assistive technologies (AT), which function similar to a keyboard.
Take control of your website’s accessibility. Download the step-by-step web accessibility checklist.
Why is it important to build an accessible website?
Building an accessible website is important so that everyone can enjoy the content, products and services that you provide. Just like so many of us, people with disabilities also use the internet to answer questions, solve problems and learn more about the world. They have a right to access the same information, and should be able to access and use the same systems that everyone else does.
If you need another reason, then you can read about the specific laws that were created to help ensure this equal right. Typically when accessibility is discussed as it pertains to regulation and compliance, these are the most common terms you will hear:
- Section 508
- ADA compliance
- Web Content Accessibility
- W3C Accessibility Standards
- WCAG 2.0 AA
Let’s take a look at some of these in more detail:
Section 508
The Rehabilitation Act of 1973 was amended in 1998 to include an updated Section 508. It was then updated in 2017 to take new technology into account. Section 508 requires Federal agencies to make their electronic and information technology accessible to people with disabilities.The overall idea is that systems shouldn’t be created in such a way that makes them unusable to individuals with disabilities such as hearing or vision loss. Essentially, it states that all individuals have equal rights and need to access technology
Americans with Disabilities Act (ADA)
The Americans with Disabilities Act (ADA) of 1990 covers many standards that must be complied with in order to meet accessibility standards. This document contains specifics about physical limitations such as curbs and ramps, as well as technological compliance for tools like ATMs and accessibility in telecommunications.
The ADA is particularly significant because it requires accessibility for all public entities, not just government. This includes nearly all businesses of all sizes. When the ADA was originally made in 1990, web accessibility was not a known issue, therefore the ADA does not explicitly mention it. However, in recent years, thousands of lawsuits against small and large businesses with non-accessible websites have cited ADA non-compliance. Though the spirit of the ADA is to make public resources equally available to all, the letter of the law in regards to websites remains unclear. As a result, some of these lawsuits have ruled in favor of disability advocate groups, others for businesses.
W3C Accessibility
The Web Accessibility Initiative (WAI) was designed to enable all people with disabilities to be able to participate equally on the web. It is an initiative from the World Wide Web Consortium (W3C), which develops key standards to encourage uniformity, security, and functionality across the web. Governments, businesses, and individuals from all over the world, including the U.S., use many W3C standards for rule-making and best practices online.
WCAG 2.0 AA
The Web Content Accessibility Guidelines (WCAG) are developed by WAI and W3C to outline specific measures and recommendations about web accessibility. Though WCAG 2.1 is the most recent standard, it builds on WCAG 2.0, which is considered the bar for web accessibility compliance for most countries. It outlines three levels—A, AA, and AAA—with Level AA being the most commonly used. WCAG 2.0 AA standards are referenced in accessibility compliance rules and laws in most of the world. It is the most common standard used for building accessible websites, software, and other technologies.
Is my website accessible?
Put yourself in the shoes of someone who is visually impaired or deaf, and you can start to build accessible websites more easily. The good news is that there are many accessibility tools you can use to re-enact how someone with a disability might interact with your website, and fix any issues that you find.
For Vision Loss
If you are on a Mac with OS X, you can enable VoiceOver. This is going to read information on websites and applications to you as you interact with them. By using VoiceOver, you can see if it is skipping critical information on your site and if it is moving through your content in a logical way. If it’s skipping around or you are unable to navigate with the keyboard or by tabbing around the site, you may need to reconsider changing some things. To this day, the most popular screen-reader for Windows is still JAWS.
For Hearing Loss
When inspecting how your site interacts with those that have issues with hearing, it’s a little easier to turn your sound off and use your site to simulate how it would operate for those with hearing loss. The primary concerns are video and audio components of your site. Can you still use your site and understand your promotional videos without sound?
Good Practices
In both situations, you want to make sure that critical information is available on your site in a plain text format that your visitors and screen readers can understand. After you go through this process a handful of times, you will start to recognize issues before they become issues. That means, when you enter the testing phase, you’ll need to make fewer changes.
It’s helpful to follow a process or website accessibility checklist to ensure you test the right things. This also helps to instill good habits in new employees who may not be as familiar with accessibility as some of the veteran web developers.
Important elements to build accessible websites
The best way to ensure that your website or application is user-friendly for everyone is to go through a checklist. I have outlined an easy to follow website accessibility checklist that will catch a majority of your website’s accessibility issues. You’ll want to review this list before you start your project and also at the end to make sure everything has been reviewed and tested. Here are some of the items the checklist covers:
- Non-text media has a text equivalent using an “alt” or “longdesc” tag.
- Video productions have synchronized captions.
- Provide sufficient contrast between elements, usually 4.5:1. This is important for users with colorblindness.
- Style sheets are used to format your text and are not critical to the functioning of your website. If the visitor viewed your website with CSS turned off in their web browser, the site must still be readable and usable.
- Data tables use appropriate semantic markup including <th> elements.
- Frames have title tags.
- The site should not flicker or have any repeating rapid movement that might induce a seizure.
- Be conscious of how you use scripting and javascript to ensure interaction with a screen reader can still trigger necessary elements. Dynamically hiding or showing content can be an issue if the content is pulled remotely via AJAX.
- Form fields have descriptive labels and appropriate markup.
- Don’t override or have specific auto-focus on form fields as it may interfere with assistive technology.
How can I validate web accessibility?
I mentioned above how you can manually do a lot of accessibility testing on your own. However you don’t have to take this on by yourself; there are also specific tools available to test many website accessibility issues quickly, and provide ongoing testing. Keep in mind that web accessibility is not a static thing, but rather changes as you add, remove, or change content on your site. Blogs, new images, design changes, new functionality and much more can bring your site out of accessibility compliance. Accessible Metrics will test your entire site automatically every month for many of the most common accessibility issues. Sign up for the private beta here.
Chances are your website isn’t going to be 100% accessible, which is not always a big deal. The biggest problem with most sites is the lack of “alt” text on images. It’s helpful for the user to know what images are on your site if they convey a true intent or point. However, many images are just supplemental to the content and actually do not provide any additional value to the visitor. So the occasional missing alt tag on an image isn’t the end of the world.
Ultimately, remember that your goal is about functionality and usability, not necessarily 100%, 0-error compliance. When building an accessible website, the point is to provide equal opportunity to all users. As long as all the critical content and functionality on the site is easy to access and interact with, then it is accessible.
Please note: Accessible Metrics is a tool to help you implement and maintain accessibility on your site, but does not guarantee accessibility compliance. Accessibility compliance according to the ADA, WCAG 2.0, or Section 508 are the responsibility of the site owner.