In this article, we provide a complete guide to accessibility testing for the benefit of our readers. Let’s get started.
First, let us know what is Web Accessibility?
The web is open to everyone and being a tester, it is our responsibility to check if it is accessible to all the users. This, in turn, will contribute a lot towards the success of the business as we work to get the application accessible to each and every user.
This will also increase the user’s satisfaction and our business too.
List of Tutorials in this Series
- Accessibility Testing Guide (This Tutorial)
- Accessibility Testing Tools – A Complete List
- WAT (Web Accessibility Toolbar) Tutorial
- WAVE and JAWS Accessibility Checking Tools
Table of Contents:
- Accessibility Testing
- What is Accessibility Testing
- Accessibility and the Law
- Recommended Tool
- Myths about Testing Website Accessibility
- Challenges of Accessibility Test
- Importance
- How Web Accessibility is Measured
- Universal Web Design Principles To Follow
- How to Perform Accessibility Testing – A step-by-step guide
- Accessibility Test Checklist/Test Cases/Scenarios
- Conclusion
- Was this helpful?
- Recommended Reading
Accessibility Testing
For most of the users, Internet usage over the web is easy. But this is not the case when we are looking at a different demographic set with challenges. It is imperative that websites be accessible, usable and useful to this group of users as well and it should not differentiate users based on language/culture/location/software/physical or mental ability.
What is Accessibility Testing
Testing a web application in order to make sure that each and every user can easily access the website is known as Accessibility Testing. The specialized and dedicated branch of testing that helps ensure that websites are indeed effective in this area is called “Web Accessibility Testing”.
Most importantly, there are certain laws and guidelines for accessibility testing that are to be followed as well.
Accessibility and the Law
- Americans with Disabilities Act: This law states that all domains like public buildings, schools and organizations should make technology accessible to everyone.
- The Rehabilitation Act, section 504 and section 508: Section 504 accommodates all people with disabilities to access the workplace, education & other organization and section 508 accommodates access to technology.
- Web content accessibility guidelines: These guidelines suggest ways that can help improve the accessibility of a website.
Recommended Tool
#1) QualityLogic
QualityLogic is hands-down one of the best accessibility testing service providers you can approach to achieve WCAG 2.1 AA and AAA certification without hassle. They are known for being home to qualified WCAG test technicians who perform automated, manual and regression tests, after which they reward you with a certificate that attests to your site being completely WCAG compliant.
Features:
- Visually-impaired QA engineers are an integral part of QualityLogic’s website accessibility audit teams.
- Leverage automated testing tools to discover errors like HTML bugs, structural issues, etc.
- Manual testing is done by skilled WCAG test technicians.
- Generate a compliance report containing a summary of errors.
- Regression tests were performed to ensure complete WCAG 2.1 AA and AAA compliance.
Price: Contact for a quote
#2) Userway
UserWay offers a comprehensive suite of accessibility testing solutions that can help you easily comply with ADA and WCAG regulations. Its AI-powered Widget, for instance, integrates seamlessly with CMS platforms and can help you adjust various facets of a website automatically to enhance its accessibility. You also have the accessibility monitor that can perform 30000 scans within an hour.
Features
- AI-Powered Widget
- Accessibility Monitor
- Accessibility Audits
- WCAG and ADA Compliance
- Customizable UI
Price: The accessibility Widget starts at $490/year. The accessibility monitor will cost you $990/year. The custom bundle starts at $12000/year.
Myths about Testing Website Accessibility
Myth 1: It’s expensive.
Fact: Precaution is always better than cure, so we can think of accessibility issues at the design stage itself and reduce the cost.
Myth 2: Converting an inaccessible website to access is a time-consuming one.
Fact: We can prioritize things and just work on basic needs.
Myth 3: Accessibility is plain and boring.
Fact: Accessibility doesn’t mean that a website should only contain text. We can also add images and make it more attractive but the critical factor is that it should be accessible for all.
Myth 4: Accessibility testing is for blind and disabled people.
Fact: Software is useful for all and hence this testing is for all the users.
Challenges of Accessibility Test
The following are some common challenges or difficulties that the accessibility guidelines try to address:
Type of Disability | Disability Description |
---|---|
Vision Disability | – Complete Blindness or Color Blindness or Poor Eyesight – Visual problems like visual strobe and flashing effect problems |
Physical Disability | Difficult to use a keyboards or mouse |
Cognitive Disability | Learning difficulties or poor memory |
Literacy Disability | Reading problems, find words difficult |
Hearing Disability | – Auditory problems like deafness and hearing impairments – Difficulty to hear well or hear clearly |
Importance
- Easy and efficient access to users with disabilities or challenges.
- Increases market share and audience reach.
- Improves maintainability and efficiency.
- Satisfied existing and future legal requirements and helps follow ethics.
- Support internationalization.
- Assists in access for low-bandwidth users.
Ultimately, everything just translates to “better business – more money”.
How Web Accessibility is Measured
Accessibility to the web can be measured with the help of web accessibility standards created by the W3C known as Web Content Accessibility Guidelines (WCAG). A few other departments have also developed their own guidelines but these too follow the Web Accessibility Initiative (WAI) Guidelines.
Evaluating the Accessibility of a Website
There are a number of factors that play a part in this, such as:
- Content
- Size
- Code
- Mark-up languages
- Development tools
- Environment
As always, it is good practice to implement web accessibility techniques in the initial stage of the project. Fixing in-accessible websites requires additional efforts.
A few simple example techniques are:
- Verification of page title
- Image text alternatives (“alt text”)
- Headings
- Contrast ratio (“color contrast”).. etc.
We can also determine the accessibility with the help of “Evaluation Tools”- to a certain extent. There are few things such as whether the alt text is appropriately written for the image or not, cannot be fully evaluated but they are effective for the most part.
Read Also => 30+ most popular web testing tools.
Universal Web Design Principles To Follow
The website should be universally designed in such a way that it should follow usability and accessibility principles. Everyone has their own learning and processing style, hence the site/product should be designed regardless of this.
Given below are some basic standard principles of website design
#1) Co-ordination
Every activity and each person included in the project should coordinate with each other. One should keep in mind that a website should be designed according to their own and as well as W3C standards.
#2) Enforcement
Being a responsible organization you should hold yourself responsible for creating an accessible site. Instead of users holding themselves responsible for an accessible site, we should do so.
#3) Leadership
Everyone should be aware of these principles and must inform if they are facing any issues while accessing the site.
#4) Consideration of access
We need to follow the standards, along with it we can consider the standards followed by the organization for specially-abled people.
#5) Technical dimensions
A website should be designed by considering all the technical standards.
#6) Educational research
We have to do research on accessibility and the issues faced while accessing the website. With the help of this, training should be given to the staff to make them aware of the standards and issues.
#7) Social inclusion
All humans should be treated equally not only in an online mode but in the physical world too.
Along with this building, a POUR website is necessary.
Now the question arises as to what POUR stands for and the answer is given below:
Perceivable: Presentation of the web suite should be perceivable. Content should make sense from the perspective of all the users.
Operable: One can say that the site is operable if a user is able to navigate the site easily.
Understandable: Everything present on the website must be understood by any type of user. In short, the language should be easy and not a complex one.
Robust: Regardless of the changing technology and the type of users, the content should be robust.
How to Perform Accessibility Testing – A step-by-step guide
This can be done using Manual as well as Automation testing method.
Manual Method
There are many tools that are available in the market for accessibility testing, but there might be some issues like lack of skilled resources, budget etc. In this case, we can go with manual testing.
Given below are a few ways to test website accessibility manually
#1) We can use high contrast mode
Using high contrast mode we can highlight the content of the website. When we turn the high contrast mode, the content of the website gets highlighted automatically as it turns white or yellow and the background turns black.
In order to turn on the high contrast mode, search for the high contrast mode in the search box.
Here, you will get an option to choose a theme and select the high contrast theme from the drop-down.
The browser will look as shown below after making the changes in the settings.
After this, we can see if the content is properly visible or not.
#2) By not accessing the Images
Temporarily for the time being, you can turn off access and see if the text-justify the content as some people may not have access to it or sometimes it takes too long to load the images.
You can turn off access to the browser in the following ways:
Internet Explorer: Tools->Internet Options->Advanced->show pictures (do uncheck).
Firefox: Open Firefox and type about:config, in the address bar and you will get the output as shown below.
After getting to this screen, you have to search for ‘permission.default.image’ and adjust the value from 0-1.
#3) Checking for captions: Check if a caption is available and make sure it is pretty much descriptive. Many times we come across links on the Facebook page where the images or videos may take a long time to display but the captions will help us a lot.
#4) By turning off the cascading style sheet (CSS): CSS is basically used to describe the presentation of the document. By turning this off we can check for the background color, text style, and text presentation style.
#5) Try to use the keyboard: If you are a gamer or excel expert, then this test must be easier for you. Try not to touch the mouse and access the website with the help of a keyboard.
You can use the “Tab” key to switch between links.
“Tab”+”Shift” will take you to where you were before.
#6) Use field label: It is useful while filling out the form, field label is what you will see while viewing the template. By using this, one can fill out the necessary information while signing up or ordering something online.
#7) Changing the font size to large: Use large font size and continuous accessibility checking.
#8) Skip navigation: This may be useful for people with motor disabilities. By clicking Ctrl + Home you can move your focus to the top of the page.
#9) PDF document: Try to save the PDF file in the form of text and check if the order for the content is maintained or not.
#10) By disabling the style: Disable the style and check if the content of the table is properly lined up or not.
#11) Content scaling: Try to zoom out the image and check if it is readable.
Automated Accessibility Testing
As automation is spreading quite widely in the testing field, we can go with automation for accessibility checking as well. We have a variety of tools for automated testing.
#1) aDesigner: It is developed by IBM and is useful for testing the software from the perspective of visually impaired people.
#2) WebAnywhere: It acts as a screen reader and requires no special installation.
#3) Vischeck: This tool helps us to reproduce the image in various forms so that we can imagine how it will look when it is accessed by different types of users.
#4) Color Contrast Analyzer: It checks for color combination and analyzes the visibility.
#5) Hera: It checks for the style of the application and comes with a multilingual option.
#6) Firefox Accessibility Extension: Firefox allows you to extend its functionality.
You can add it to open Firefox->Add-ons->accessibility extension. This will help you test the report, navigation, link text, etc.
After clicking on the extension, you will get the option to search for add-ons.
#7) TAW online: It gives you the option to test and check if the software is developed as per the guidelines of WCAG 1.0 or WCAG 2.0. It also has the option of selecting the level of analysis.
#8) PDF Accessibility Checker: This checks for the accessibility of a PDF file.
=> For the Complete list, check out this Accessibility Testing Tools post
Accessibility Test Checklist/Test Cases/Scenarios
Given below are a few points that need to be checked while doing this type of testing:
- Whether the labels are correctly written and placed or not.
- If the audio/video content is properly audible/visible or not.
- Whether the color contrast ratio is maintained or not.
- If the control actions for the video are working fine or not.
- If the short keys are provided for the menu then you need to check if all of those are working fine.
- Need to check for tabs if navigation between tabs is an easy task.
- Whether or not the application has followed all the principles and guidelines.
- If the heading is unique and conveys the meaning & structure or not.
- If the link text is written with content description instead of creating ambiguity.
- Whether a meaningful multimedia caption is provided or not.
- If the instructions are clearly given or not.
- Whether the content is clear, concise and understandable or not.
The following are the key points that the website should satisfy for accessibility:
- Link text should be descriptive. Visually disable user access web page by clicking on the tab button from the keyboard and move from link to link. So it’s essential that the description of the links is properly defined. Make sure the hyperlinks are accessible using the tab key.
- Provide appropriate pictures where possible. A picture speaks louder than words. Try to add appropriate pictures for the text whenever possible. Pictures can describe the content of the website for Literacy challenged users.
- Use simple language. The cognitively disabled user has learning difficulties, it is very important to make sentences simple and easily readable for them.
- Consistent Navigation. Consistent navigation throughout the pages is also very important for users with cognitive disabilities. It is good practice to maintain the consistency of the website and not to modify the pages on a regular basis. Adjusting to the new layout can be time-consuming and can become difficult.
- Ignore the pop-ups. Users who use a screen reader to read the web pages, pop-ups can be really inconvenient for them. The screen reader reads out the page from top to bottom and when a sudden pop up arrives the reader will start reading it out first before the actual content. It can confuse visually disabled users.
- CSS layout. CSS based websites are more accessible than HTML code based websites.
- Divide large sentences into small simple sentences. Visually disabled users listen to the information on the webpage and try to remember it. By dividing the large sentence into a small simple sentence can help recall things easily.
- Don’t use marquee text. Avoid shiny text and keep it simple.
In short, we need to check if the application is developed according to the W3C guidelines, website design principles and accessibility principles and for this, we must be aware of all these principles.
We can summarize the above checkpoints by verifying and validating the written content, design and development method of the website/application.
Also read => Web testing complete guide.
Conclusion
Accessibility testing explains how easily one can navigate, access and understand software. This is for all kinds of users. The tester should include everyone’s perspective while performing the testing.
Just like any other type of testing, this testing can also be done manually as well as with the help of automation tools. A Tester’s aim should just be to check if the guidelines are fulfilled or not and how easily and friendly a user can use the software.
Recommended reading =>> Top Accessibility Testing Service Providers
In the next part of this tutorial series, we will introduce you to a few more web accessibility testing tools and techniques, so make sure to check it out.
Please don’t forget to post your queries, suggestions, and experiences in the comments section below. We would love to hear from you.
Hi!
I LOVE your blog (if that is what it is..(?) I have used it countless times for up-to-date Software Testing Info! Your second to NONE! 😀 Thank you so much for your assistance! I am a senior QA engineer.. (sometimes QA Manager) and even I don’t know all of the things you do! Your a tremendous help. Keep up the great work!! ~Joanne
We are a team of blind and visually impaired users just beginning testing. A real pain point is not the testing itself, but the logging. Do you know of any easy to use, screen reader friendly ways of logging accessibility issues while testing?
Appreciated the way and simplicity you presented the topic
how can we make our own web accessibility testing tool.
superb guide with all details. waiting for the next one.
Online Front is a full-scale Digital Marketing Company in Delhi, India. We mix our years of experience and knowledge of our expert team to create best web solutions for our clients which are not only performance driven, but also creative and result oriented. We are running kick-ass digital campaigns for our clients to help brands to grow and make their place in online market by performing multiple functions like SEO, Web Design and Development, SMM, PPC, E-mail marketing and many more.
We are developing and testing a product that checks whether the website that we are using is accessible by impaired persons , try this wallyax.com
Thanks, great information
What are the relevant metrics for this testing ? where can i get those details ?
508 compliance, image alt tags, link names, iframes & embedded media, ADA compliance, color contrast, proper HTML markup, tab-index analysis. We know this is a lot and it can be difficult to figure out if your site is accessible on your own!
Is there any tool for testing “video” accessibility ? (offline, meaning not a video on a website)
This tool is not allowing to copy data from the message box, so I think it would be difficult for the user to type the URL manually.
I would request to lay stress on how to read those messages and take action
Simply superb!! in 20 mins anyone can learn what is web accessibility. Thank you.
Where to find more information on Automated Accessibility testing?
What steps can be taken moving career towards the Accessibility expert?
Good beginning to the very vast topic.
Whats Cloudy Direction (in Alpha Testing)?? can anyone please answer it?
Thanks all for commenting.
This is a great insight into accessibility checking, a very vast topic on its own…
As more importance is given to users and user experience, accessibility test is emerging as the next new wave in program development that helps businesses maintain compliance and supports users with special needs.
There is some great level of detail you have covered here.
Although this is a good list of resources on the topic of web accessibility (and we need more of those) it’s hardly a step by step guide for a few reasons:
– You present Manual and Automated testing as 2 different ways to conduct accessibility testing while they are in fact complementary. There is currently no way to ensure a website is accessible with automated testing alone. You should start there, but you can’t stop there.
– Axe v4.1.0 from Deque detects over 100 accessibility violations on this page alone. For a page about testing and accessibility, that’s not pretty. Some of those are basic violations outlined in this article such as missing ALT text on images.
I hope this feedback is helpful because you clearly put a lot of thought and effort into this post and I respect that.
Gaurav Khurana please help us to understand which tool are you talking about?