March 27, 2014
Accessibility Testing Tools and Techniques
Why Accessibility Testing Matters
With each passing day, the web is assuming greater significance in our lives, be it e-commerce, e-payments, Internet banking, e-paper, social media, etc. So it becomes important to make available all electronic and information technology tools to everyone, especially for people with some kind of disabilities.
Web Accessibility testing ensures that individuals with disabilities will be able to use the system. Accessibility Testing helps to comply with legal obligations and make products usable across millions of people who have one or multiple forms of disabilities.
Web Accessibility Guidelines
Web Accessibility Guidelines are a set of defined rules to make web contents accessible to people with disabilities. There are number of guidelines defined by different countries. Section 508 and WCAG guidelines are popular accessibility standard guidelines in use today.
1. Section 508- Section 508 is the accessibility standard defined by the US government, to make sure that all US government websites can be accessed by people with disabilities. As per section 508 guidelines all electronic and information technology should be accessible to disabled users.
2. WCAG- Web Content Accessibility Guidelines or WCAG define the standards for accessibility for individuals, organizations and governments worldwide. WCAG 2.0 has been accepted as an International Standards Organization (ISO) standard, and many countries have adopted WCAG 2.0 as their legal standard for web accessibility. Web Content Accessibility Guidelines: Includes both WCAG1.0 and WCAG2.0 specifications.
Manual Accessibility Test
Following is the list of manual tests which can be executed on different browsers (IE, Firefox, Chrome etc.) to perform Accessibility testing:
1. Valid HTML- Use the HTML Validator Service by W3C to validate your code.
Open the W3C HTML Validator site. Enter the URL of application in Address and click the Check button.
2. Headings- In the W3C HTML Validator under More Options, select the “Show Outline” option and validate the application to check that headings are present and in the right order.
3. Large Fonts- In your browser window change the text size to 'Largest' to test the large fonts. For instance, to activate large fonts in Internet Explorer, open IE>navigate to the View menu>Text Size>Select “Largest”. Verify text size is increased. Also verify text size of form fields is also increased.
4. High Contrast- To set the high contrast in windows, open the Control Panel> navigate to “Ease of Access Center”> click on “Make the computer easier to see”. Under “High Contrast” section, select a High Contrast color scheme.
High Contrast can also be turned on or off using keyboard shortcut keys, press left ALT + left SHIFT + PRINT SCREEN> a pop up to turn on High Contrast is displayed>click on Yes button to enable High Contrast.
After changing the color scheme to High Contrast, verify that all contents are displayed as per the color changes and important information is not disappeared from page.
5. Alternate Text- Text associated with an image is Alternate text. Images should include Alt Text in order to make these images accessible especially for people with visual disabilities. Screen readers can read text associated with images for the people who cannot see. In Internet Explorer, hover the mouse over each image; the Alt text will display for the image as tool tip.
6. Captions and Transcripts - Captions and Transcripts allow the web audio and video content to be accessible to people who have hearing disabilities and who cannot access to audio or video. Check that your videos recordings have captions and transcripts accompany audio.
7. Skip Navigation- Skip navigation links make web pages easily accessible for people with certain mobility impairments. In order the verify that, press Ctrl+Home keys to move focuses to the top of the page. Use the Tab key to start moving through links. Make sure that "Skip to Content" link is visible near the top.
8. Tab Order & Link Text- Make sure that all the fields and links are accessible using Tab key in right order. Text associated with each link should be unique and understandable.
9. Form Labels- To make sure that each form label is accessible, put the mouse on label of each form field; flashing cursor should appear to the associated field. Check that each form field has a label. If a field does not have a label, hover the mouse over the field and confirm that it has an appropriate title attribute, which will appear as a tool tip.
10. Keyboard Operations- Make sure that all the dynamic elements (drop-down menus, tab pages, Flash interfaces, etc.) are accessible using keyboard. Use the Tab key, up/down arrows, space bar, etc. to check the accessibility of all the dynamic elements.
11. PDF Documents- Open PDF document and click on File> Save as Text>Save the text file. Open the saved text file and make sure that all text of pdf file is present in text file in the correct order.
12. PDF Forms- Make sure that each form field is accessible through keyboard. To confirm that each form field contains label, put the mouse over each form field and check that a label displayed for each field as a tool tip.
13. Disable styles and linearize tables- Disable the styles using WAVE or with the "Web Developer toolbar" extension for Firefox. Make sure that contents without style are displayed in order and understandable.
14. Test content scaling- To check the test content scaling, increase the font size in web browser to 150% and make sure that page is readable and usable. In order to enlarge the images, zoom the web page and check text in images is readable.
Accessibility Testing using Screen Reader
JAWS (Job Access with Speech)
As the name suggests, JAWS is a screen reader which allows users with partial and complete visual disability to read the screen. Test with a screen reader is to focus on navigations, forms, and dynamic contents.
JAWS is developed by the Blind and Low Vision Group of Freedom Scientific, St. Petersburg, Florida, USA.
JAWS can be downloaded from “https://www.freedomscientific.com/downloads/jaws/jaws-downloads.asp” that allows user to run JAWS for 40 minutes without any limitations. After the 40 minutes JAWS have expired, system needs to be rebooted to continue testing with JAWS.
Note: System reboot is required to run JAWS, not just restart.
Prerequisite to Run JAWS
- Num Lock should be off.
- Browser window should be maximized.
- Screen reader users usually do not use a mouse try using only the keyboard.
- Most of the shortcut keys of Internet Explorer will work when running JAWS.
- There may be a case when you are not able to use the scroll up or down feature on the page and contents are not visible to user, JAWS will read the contents which are not visible on the screen.
- We used JAWS on Internet Explorer.
Accessibility Testing Tools
Below is the list of number of freeware tools used for accessibility testing:
1. AChecker (Accessibility Checker) - Accessibility Checker is a Web accessibility evaluation tool. It is very useful tool as web accessibility can be examined from AChecker by entering web page URL or by uploading its HTML file.
AChecker provides option to select an international accessibility guideline for accessibility check:
- WCAG 1.0 (International)
- WCAG 2.0 (International)
- BITV 1.0 (Germany)
- Section 508 (U.S.)
- Stanca Act (Italy)
It also gives the option to choose report format (View by Guideline and View by Line Number).
AChecker is an open source tool which can be accessed online as well downloaded and installed.
2. Accessibility Valet - Accessibility Valet is a web accessibility test tool which is designed to conforma accessibility by analyzing markup for W3C Web Content Accessibility Guidelines (WCAG) or Section 508 accessibility compliance. In free subscription one URL can be verified at a time. For unlimited use paid subscription is required.
Installation is not required for this tool. It can be accessed through URL “https://valet.webthing.com/access/url.html”
3. WAVE – WAVE is very useful web accessibility tool. There are several option provided by WebAIM to use WAVE:
a) URL can be entered on the WAVE webpage WAVE will show the original web page with icons and indicators which reveals the accessibility of the page. URL can be entered in https://wave.webaim.org/ or “https://wave.webaim.org/report#/YOUR+URL+HERE”.
b) WAVE provide the option to upload a file can be uploaded or enter HTML code to check.
c) WAVE toolbar is also available to run the WAVE reports in Firefox. WAVE toolbar can be downloaded from “https://wave.webaim.org/toolbar/”.
WCAG 1.0 and Section 508 guidelines are used by WAVE for the webpage evaluation.
4. Web Accessibility Toolbar for Internet Explorer - Web Accessibility Toolbar is used to manually validate the web pages for various aspects of accessibility. Major functions of Web Accessibility Toolbar are:
- To identify components of a web page
- Provide access to alternate views of page content
- Facilitate the use of third party online applications
Web accessibility toolbar follow the WCAG 1.0, Section 508 and BITV guidelines. Web Accessibility Toolbar can be downloaded free from “https://www.paciellogroup.com/resources/wat-ie-about.html“
5. The Color Contrast Analyser – Color Contrast Analyser allows checking the color contrast (foreground/background color combinations) and color visibility. It checks the color contrast against WCAG 2.0 color contrast criteria. It also provides the feature to simulate some visual conditions such as color blindness and cataract. This tool helps to determine that contrast ratio between two colors can be read or not by visually challenged people. Color Contrast Analyser can be downloaded free from https://www.paciellogroup.com/resources/contrastAnalyser”
6. EvalAccess 2.0 – EvalAccess2.0 is developed by the University of the Basque Country in Spain. This tool can evaluate a single web page as well as an entire website for WCAG 1.0 and Section508 compliance.
EvalAccess provides following methods to test web accessibility:
- Evaluate Single URL- To use this method user needs to enter the URL of every page and evaluate it.
- Evaluate Website- Using this method entire website can be evaluated.
- Evaluate HTML source- This method is used to evaluate the HTML source code. Enter the HTML source code and evaluate it.
For these methods some options are configurable as per the user requirement.
Installation is not required for EvalAccess2.0.
7. FAE (Functionality Accessibility Evaluator) - FAE evaluates web page.
The results of the evaluation are broken into 5 categories: Navigation and Orientation, Text Equivalents, Scripting, Styling and HTML Standards.
FAE can be accessed using "https://fae20.cita.illinois.edu/"
8. AccessColor – AccessColor checks the color brightness, color combinations and color contrast between colors. It assures that color contrast is sufficient for people with visual impairments.
AccessColor also helps in finding appropriate color combinations within HTML and CSS documents in order to test the contrast between each colour combination.
AccessColor provide the option to only errors and warnings in report or view full report with details.
AccessColor checks the color combinations against WCAG 1.0 guidelines.
9. Hera (Version 2) - Hera is a web-based system that performs the accessibility test as per the WCAG1.0 guidelines. It does some automation testing and guides users through tests which need to be done or confirmed manually. The fact that it is multilingual qualifies as one of its major advantages. It gives buttons for different languages and using them language can be changed. Default language is English.
Hera can be accessed using “https://www.sidar.org/hera/”.
10. Firefox Accessibility Extension - Firefox Accessibility Extension is an add-on available for Firefox which make it easier for people with disabilities to view and navigate web page contents. To download the Accessibility Extension open Firefox and navigate to Tools>Add-ons>Accessibility Extension. A new menu bar “Accessibility” is displayed with number of features:
- Reports(Accessibility Issues)
- Navigation (Title, Headings, Links, Forms, Data Tables, Language Changes etc.)
- Text Equivalents (List of Images, List of Objects, List of Abbreviations etc.)
- Scripting (Focus Inspector, List of ARIA Widgets, Disable Scripting etc.)
- Style (Colour Contrast, Text Flow, Text Sizing, High Contrast View etc.)
- Validators (W3C Specifications, HTML Validator, CSS Validator, Link Checker etc.)
- Tools (FAE, WebAIM WAVE, Cynthia Says, WebXact, TAW etc.)
- Keyboard (Keyboard Shortcut Options, Disable Access Keys etc.)
Options (Commands and styling changes will affect current page e.g. Help and About)
11. TAW Online – As the name suggest, TAW (Web Accessibility Test) is an online tool for the accessibility test of web sites based on the W3C Web Content Accessibility Guidelines. It gives the option to select a guideline WCAG1.0 or WCAG2.0. It also gives the option to select Level Analysis(Level A, Level AA and Level AA). As per the selected WCAG guideline standard and level, it tests the web site.
It also provides to option to select between Spanish or English languages.
TAW can be accessed from here.
12. PDF Accessibility Checker (PAC) – PDF Accessibility checker is a freeware windows tool to check the accessibility of PDF files. PAC is recommended by W3C for checking the accessibility of PDF files. PAC does not require installation. In order to use it, open the “PDF Accessibility Checker 2.0.exe”, PDF Accessibility Checker will be start. Browse the PDF file and click on Start button. Accessibility check result will be displayed. Click on Report button to view the detailed report in order to analyze the specific errors in the PDF file.
PAC can be downloaded from “https://www.access-for-all.ch/en/pdf-lab/pdf-accessibility-checker-pac.html”.