Manual web accessibility testing is an important step in the testing of a web application. As we discussed previously the first step in testing a web site is to run automated tests with tools. After which the HTML can be cleaned up to match W3C standards. Next you will need to start testing using the keyboard. Manual web accessibility testing helps identify locations where keyboard only user will have difficulties using the web page.
Use Tab and Shift+Tab
The key to keyboard testing is to find places where a user who is using only a keyboard might get caught or won’t be able to tab too. Typically users will get caught in places like poorly formatted menus or pop up content. Equally bad, users will not be able to tab to elements that aren’t tabbable, but can be easily accessed by a mouse. The main tabbable elements are links, form elements and buttons.
When you are testing tabing you should be able to tab to all the links, form elements and buttons within the page. It is important that you can get to the bottom of the page simply by tabbing. It is also important that the last tab should bring focus back to the top of the page or browser, this helps users access content from the beginning. When doing shift-tab you should be able to hit all the same elements in the opposite order, so starting at the bottom of the page and getting back to the top.
If you lose track of focus or the focus jumps out of place you have likely identified an issue with the keyboard accessibility. When problems like this arise it is important to inspect the code and try to identify the problem. You should resolve these issues so that keyboard only user can continue to navigate your site the same way a mouse user can. Keep in mind, that problems with tabbing order are not only a nuisance for disabled users, but all your users.
If these problems persist a keyboard only users may lose access to your content and leave your site for a competitor.
Don’t Disable Focus Outlines
The best way to keep track of focus and where it is moving is to watch what gets outlined. All browsers by default have focus outlines, so it is important not to disable this feature or change its display. Focus outlines are extremely helpful to low-sight users, but they also help with testing and keeping track of where you are.
In addition, typically screen readers will read the text that is in focus, so when content gets highlighted with an outline it is read by the screen reader. This is helpful as it will give you a sense of what a screen reader with say without having to use one. For this reason the focus outline will be invaluable in testing the accessibility of your web application.
It is important to ensure that you can tab through your web applications and not get lost or forced to jump around to different places. This is a critical issue for low-sighted users, but it is also helpful for everyone else who uses your site. Proper tab order is a great way of showing that your website has been coded properly and linearly.