Bust inaccessible websites in less than a minute
You are not a technical person, but you’ve been given the task of having a website built by a vendor. You have of course specified that the website must be accessible - but how do you know if what you receive truly is?
Whoops accessibility
The Norwegian Parliament has unanimously adopted that all websites must be accessible for anyone to use. Prior to the election in 2017, the Agency for Public Management and eGovernment, in Norway known as Difi, ran an accessibility test on all the political parties’ websites to check whether they stood by their own requirements. Not one of them passed.
This legislation was exactly the reason we ordered a new website in 2015.
– Confused communication manager
The response from the politicians was that they in fact had ordered accessible websites, and were very surprised to hear that they weren’t. And for once, I actually believe them. How can they, without any knowledge of web development, know whether a website is accessible or not? I have the same feeling every time I pick up my car from service. They show me a long list of what they have done, but it tells me nothing.
So how do you know?
The method you should test with is called keyboard navigation. It’s easy to learn, and it takes you less than a minute to find out if it works or not. It’s not a bullet proof method that discloses every WCAG violation, but it can tell if the web agency has even tried to make the website accessible.
All you have to do is to hit the tab key to jump between the links and controls on the page. If you need to jump backwards, hold the shift key when you hit tab. When you operate controls like drop down boxes or radio buttons, you use the arrow keys. Use enter to click on links and buttons.
While you navigate, you should clearly see which element is active. By default, Chrome provides a clear blue outline on active elements, while other browsers, like Firefox, use a thinner outline. If you don’t see anything, it’s most likely that some clever designer has decided that the outline is too ugly, and instead of making it prettier has decided to remove it. A far too common mistake, I’m afraid.
If you can see where you are, but miss some of the elements, the developers have probably used non-interactive elements instead of interactive ones like a-tags or form elements. Another common mistake.
Anyway, if there are any functions you are not able to perform without picking up the mouse, you have busted an inaccessible website. Easy, right?
Digging deeper
Still got time left? If keyboard navigation works OK, you can check how it works with a screen reader. Screen readers are used by people with visual impairments or reading difficulties, and they are already installed on your device. Just take a look in your accessibility settings. Screen readers have different names depending on your device; on all Apple devices — look for VoiceOver, on Android — TalkBack, and on Windows — Narrator.
It takes more time to learn to use a screen reader, but they are extremely effective to bust accessibility flaws. Personally, I find it easier to use screen reader on the phone. Once you have selected the right language and reading speed, you just swipe forwards and backwards with your finger, and double-tap to open apps and click on links. You don’t have to close your eyes to test how it works for blind people, just make sure that what you hear makes sense. I can guarantee you, that it won’t take long until you find another error.
Return to sender
Once you have tested with these two methods, your vendor will be busy for a few more days. You haven’t tested all aspects of accessibility, like colour contrasts and scalability, but your vendor have learned that they cannot just tell you that the website you pay for is accessible and get away with it.
