Accessibility testing is the process of evaluating that a software application, website, or digital content is usable to people with special needs or unique challenges due to physical, sensory, cognitive, or developmental impairments. The goal of accessibility testing is to identify and address barriers or obstacles in the application that can prevent these individuals from effectively using and accessing the digital product.
Accessibility testing promotes inclusivity in the digital world. It requires developers to adopt design practices tailored for marginalized populations, fostering a digital environment where all users can engage, participate, and benefit from the technology provided. As a result, quality assurance professionals must also employ accessibility testing to check for these inclusive functionalities.
In this article, we will deep-dive into the importance of accessibility testing, everything you need to know to perform accessibility testing for your application, and how
Accessibility testing rose along with the demand for inclusivity in product development. For example, almost all cars with a stick-shift system are designed for right handed people who account for 90% of the world population, leaving out the left-handed. Recently, many car manufacturers have replaced the stick-shift design with an interactive touch screen, reflecting a user-centric approach. With new technology comes the need for accessibility testing to evaluate its quality.
The software industry underwent the same trend. Several technologies designed for accessibility in software include:
Visual Impairments:
Motor or Mobility Impairments:
Hearing Impairments:
Cognitive or Learning Disabilities:
Color Vision Deficiencies:
Speech Impairments:
These technologies require a unique approach to testing, hence a separate category for it in the software quality management world.
Accessibility standards have been established long before the Internet, but have been revised to also apply to web-based products. These standards ensure that individuals with disabilities have equal access to information, services, and opportunities provided by digital platforms. It has positive economic and societal impacts by challenging old stereotypes and promoting a more accepting mindset.
Several notable accessibility standards in software development and software testing include:
There are many country-specific regulations that accessibility testers should know to include in their test plan, ensuring that their applications are compliant with the law.
More than just legal compliance, incorporating accessibility testing best practices aligns your strategy with social responsibility values, contributing to a more equitable and progressive society by removing barriers that hinder users from accessing modern technology and digital resources on the Internet.
Social responsibility means a lot to all parties. It is a unique way to promote a healthy brand image while providing great value to an underserved user base, and research shows that corporate social responsibility does impact employee satisfaction. It instills employees with a sense of purpose in creating inclusive products and applications.
Accessibility testing future-proofs your software and encourages innovation to accommodate for the ever-evolving standards as well as the need for customization. Through accessibility development and accessibility testing, you create products and services that are usable by everyone. This allows your organization to stay ahead of the competition in the market and explore niche, emerging markets, capitalizing on the opportunities they present.
Let’s take the example of a job portal website. Despite being a prominent online employment website, they faced challenges with the accessibility and usability of their job portal application. After conducting a survey, they noticed that about 10% of their customers are physically challenged, and they reported difficulties in using the application.
Recognizing the importance of accessibility and inclusivity, they adopted accessibility testing to address the issue. The testing reveals that the software is not yet friendly for people with visual impairments in several aspects; for example, many images don’t include an alt text which enables screen readers to read the information about the image for the benefit of a person with a complete lack of sight, who is visually impaired, or many other reasons.
Similarly, for the complex dropdown menus in the job filter section, they also realize that delays should be introduced to ensure that the menus remain open long enough for users with motor or cognitive disabilities to select their desired option. Quick-closing menu is quite challenging for individuals who need extra time to read and understand the filter options.
Keyboard accessibility is also important, since many visually impaired people rely on their keyboard to navigate around the website, not their mouse. Web developers of the job portal site have to make sure that important interactive elements (links, buttons, forms, etc.) are fully accessible via keyboard, or any assistive technology that simulates keyboard input.
Here we first need to understand the concepts of “focus” and “focus indicator” in web development.
“Focus" is the state of an interactive element when it is currently selected or interacted with by the user. When a user interacts with a website using a keyboard or other input device, they move the focus from one element to another to navigate through the interface and trigger actions.
The "focus indicator" is simply a visual cue that indicates which element currently has the focus. It helps users with visual impairments or those who rely on keyboard navigation to understand their location on the page and which element is active. The focus indicator is typically represented by a highlight, border, or change in color around the focused element.
So what makes these 2 concepts so important in accessibility design? People with visual impairments can’t identify web elements as easily, and they need a special form of signal to navigate around. Accessibility testing revolves around testing if these focus indicators provide enough information for disabled users:
<nav role="navigation">
<ul>
<li><a href="#" aria-label="Home">Home</a></li>
<li><a href="#" aria-label="About">About</a></li>
<li><a href="#" aria-label="Services">Services</a></li>
<li><a href="#" aria-label="Contact">Contact</a></li>
</ul>
</nav>
</a></li></ul> </v>
There are 2 approaches to accessibility testing: manual testing vs automation testing. Automated accessibility tests utilize specialized software to analyze websites and identify common barriers that could impact individuals with disabilities. On the other hand, manual testing involve human testers who personally interact with the website and generate detailed reports based on their firsthand experience. These reports typically encompass insights on WCAG conformance issues and suggested remediation strategies.
You can do accessibility testing yourself with a little bit of configuration and computer skills.
You can enable high contrast mode to highlight the content of the website. Simply go to high contrast mode through the search box or settings. Select the high contrast theme from the drop-down menu. You should see your screen turning into one similar to an inverted color screen like this:
Alt text is only displayed when the image is not loaded properly. To do this, testers must temporarily disable image loading to see if the content remains readable.
In Google Chrome, go to Settings > Privacy and Settings > Site Settings. Upon scrolling down you should see the “Image” tab. Click on it and you’ll see under the Default Behavior section there is a “Don’t allow sites to show images”. This will disable images and replace them with alt text.
In Internet Explorer, you can uncheck "show pictures" in the advanced settings, while in Firefox, type "about:config" in the search bar and adjust the value of "permission.default.image." from 0 to 1, with 0 being the default usual images and 1 means blocking image loading.
This type of test focuses on accessing the website using only the keyboard, without relying on mouse interaction. Try navigating through the website using the "Tab" key to move the focus between links and interactive elements. Use "Tab" + "Shift" to move the focus backward to where you were previously. After browsing around the web with your keyboard, you should have a better understanding if the functionality and content can be accessed and operated using keyboard navigation alone, benefiting users who may have difficulty using a mouse.
You can verify if the content remains readable and does not become distorted or lose functionality on the website with the font size set to "large" or increased in size. Most users use the Ctrl and +/- shortcut to quickly zoom in/out on Windows or the ⌘with +/- for Mac. In some cases, the images or letters don’t enlarge even when you zoom in, which can be quite a frustrating experience for any user interacting with the site.
Katalon is a modern, comprehensive AI-powered automation solution designed to automate tests for web, API, desktop, and mobile apps, all in 1 place. It is a powerful tool to create, execute, and manage your testing activities with low-code features such as Record-and-Playback where you can record your activities and turn that sequence into a test script, or use the prebuilt list of keywords to craft a test script with just a few drag-and-drops.
You can easily automate accessibility testing at scale by combining Katalon’s low-code automation features with Axe’s accessibility testing tool thanks to the Axe-core library integrated in Katalon Studio.
To automate accessibility testing in Katalon, first download our free Katalon Studio along with the axe-core library. After you have successfully logged in to Katalon, navigate to the menu: Project > Settings > Library Management.
After you added the axe-core library .jar file, you can run your accessibility test with a custom keyword. Go to File > New > Package to create a Keyword Package. We’ll name it “accessibility”
Next go to File > New > Keyword to create a Keyword called AxeKatalon. It’ll be placed in the package you’ve just created.
Add the script below to your keyword file.
import com.kms.katalon.core.util.KeywordUtil
import java.text.SimpleDateFormat
import com.kms.katalon.core.configuration.RunConfiguration
import com.kms.katalon.core.webui.driver.DriverFactory
import com.deque.html.axecore.selenium.AxeBuilder;
import com.deque.html.axecore.selenium.AxeReporter;
import com.deque.html.axecore.selenium.ResultType;
import com.deque.html.axecore.results.Results;
import com.deque.html.axecore.results.Rule;
import static com.deque.html.axecore.selenium.AxeReporter.getReadableAxeResults;
@Keyword
def checkAccessibility() {
Results results = new AxeBuilder().analyze(DriverFactory.getWebDriver())
List<Rule> violations = results.getViolations()
if(violations.size() == 0){
KeywordUtil.logInfo("No Violation Found")
}
String AxeReportPath = RunConfiguration.getReportFolder()+ File.separator
String timeStamp = new SimpleDateFormat("yyyy_MM_dd_HH_mm_ss").format(new java.util.Date())
String AxeViolationReportPath=AxeReportPath + "AccessibilityViolations_" + timeStamp
AxeReporter.writeResultsToJsonFile(AxeViolationReportPath,results)
KeywordUtil.logInfo("Violation Report Path"+ AxeViolationReportPath)
if(getReadableAxeResults(ResultType.Violations.getKey(),DriverFactory.getWebDriver(),violations) ){
AxeReporter.writeResultsToTextFile(AxeViolationReportPath,
AxeReporter.getAxeResultString())
}
}
}
You now have an entire keyword that can be reused across any test cases you want! You can add the keyword as a test step in your test case. The other steps used in this case (Open Browser, Navigate to URL, etc.) are all built-in keywords, and you can immediately access them at the Built-in Keywords folder. It takes a few minutes to craft a test case that can be automatically executed on any browser that Katalon Studio supports (Chrome, Mozilla Firefox, Edge Chromium, Safari). You can use this keyword for different pages on the website depending on your navigation flow.
After you execute the test, the accessibility test reports are generated in TXT and JSON format in the Katalon Studio report folder.