What are accessibility overlays good for?
Accessibility overlays have come in for some serious criticism in recent weeks, but are they as bad as everyone says they are? If you are considering using one, you might find this perspective useful.
What is an accessibility overlay?
“Overlays are a broad term for technologies that aim to improve the accessibility of a website. They apply third-party source code (typically JavaScript) to make improvements to the front-end code of the website.”
https://overlayfactsheet.com/#what-is-a-web-accessibility-overlay
When you look at the criticism there is one theme that comes up repeatedly and that is how they are being sold. But that’s not the point of this article as I believe overlays have their place, and that is what I’m going to explore.
Let’s start with three points about accessibility in general.
Firstly, there is a common misconception that to be accessible all you have to do is be compliant with the WCAG guidelines. The WCAG guidelines are full of really sensible things researched and shaped by clever and knowledgeable people, but the guidelines are a work in progress so they have holes, and it is very possible to build a fully compliant website that has major usability and accessibility problems. Bureaucrats and lawyers like WCAG because it is fairly measurable and you can tick things off against it, but reducing the complexity of people to a checklist, no matter how sensible it is, will always be reductive.Things like effective font choice, rich caption UX, cognitive design and several other things WCAG has not yet fully got to grips with. Remember, as well as resolving access barriers, users also need usability through designed experience, and you need to not only design with that in mind, but also check that what you have delivered works for everyone.
Secondly, there are no one-stop-shop overlay solutions to either compliance or accessibility. WCAG is all about compliance and therefore you need to use WCAG to be compliant. None of the overlays on the market cover everything in WCAG. Also some features like the auto-generation tools of alternative text for images that are really important for people with vision impairment are terrible. They do not give users what they need because any description should be about the intent of the use of the image. What did the person who chose the image intended to convey? Even if there are AIs or computer-generated algorithms to identify objects in images doing the work, there is no artificial intelligence out there that can read the mind of the person who chose an image. Humans struggle to read each other’s intent so machines have no chance. The best solution is to make sure the person who chose the image, writes the textual equivalent.
Thirdly, accessibility is deeply rooted in UX design. If a product isn’t designed to work for the broadest possible group of users, you should have no reason to expect it will. Accessibility specialists spend most of their time fixing broken UX, which is what an overlay tries to do also. But overlays can’t make judgement calls, can’t fix usability, and are far more broad-brush in what they can do. They are a blunt instrument, however if they are the only tool you have available, in certain circumstances, they can be better than nothing.
Keep these three things in mind whilst we have a look at what the opportunities are for using a tool that claims to improve (let’s ignore the word ‘fix’) the accessibility of a website.
I’ve thought about this and have so far only come-up with four situations where an overlay could work. Beyond these reasons I have been struggling to justify why you would use one. If you think it is about compliance, then cross your fingers as you could be in for a bumpy ride. If you just want to treat 20+% of your customer base as a box ticking exercise, then that is a whole other issue and a missed-reach opportunity.
1. Small Organisations with Existing Websites
For this I am thinking about independent retailers, schools, charities, not-for-profits etc. who need a web presence, but have a very limited budget.
If your organisation or agency doesn’t have much in the way of accessibility skills, and budgets are tight, you can still make a few improvements. In fact do everything you can because the better the underlying code is, the more an overlay can do. Overlays are not magic bullets. If you have an existing website that you want to improve but can’t afford an audit, or the cost of a re-build, before you integrate an overlay you can make some small but significant changes:
Colour Contrast. Have a look at all the words on your site and use this simple tool from TPGi to colour-pick foreground and background colours. You can then adjust the values in your design relatively easily by simply changing values, then re-testing. This makes a huge amount of difference to many people with moderate to severe vision impairment, and if your site is accessed by mobile users, you are also supporting keyboard user behaviour. Just about everyone turns the brightness on their phone or tablet down to preserve battery. This impairs their view of any website or application and high contrast enables them to access your service.
Link Text. Again this is not just about accessibility but core usability. A link takes you to another page or an external resource so it should describe its destination when read in isolation. All links should not be able to be confused with content. Make sure they stand out. They should be a different colour blind friendly colour to other copy on the page and if possible ensure they are underlined too. Make sure none of them just say things like; more info, continue reading or learn more, and lastly ensure that every link’s text on a page is unique.
Alternative Text for Images are really important and some overlays claim to be able to provide this text automatically. It is true they can generate text but the majority of it is useless to the users. Alternative text is not about providing a literal description of an image, it is about conveying the intent of the use of an image. What does it tell the viewer? There is only ever one person who can accurately convey that intent, and that was the person who chose the image in the first place. This video on how to Tame Alternative Text from Jamie Knight at the BBC gives you the basics. It’s actually much easier than you think so if you do use anything to generate this text, check that what it generates is what was intended.
Captioning is something that has become a mainstream requirement with Facebook reporting that over 80% of all videos are watched with the sound off. So if you are not captioning, then you are missing out on a huge reach potential. YouTube has some excellent captioning tools if you simply embed YouTube videos into your site. Transcribe your video first, then upload the transcription, and then edit the timings. It’s not that hard to do. There’s a useful introduction to captioning by vidIQ that will help you get started. If you don’t use YouTube, there are plenty of captioning software packages out there to help you. One thing to remember is not to rely on auto-captioning. It’s OK for creating the first draft of a script for editing, but it can be highly inaccurate. This work will give an overlay a much better chance, although this will not give you a compliant website, but more people should be able to use it. If you are still not sure, seek feedback from users.
Pay some disabled people (preferably 20+ people) who use assistive technologies to try your service out and perform all of the main tasks on the site. You don’t need to go through an agency, so contact local charities and community groups or reach out using social media. The main thing you need to ensure is that people can independently access your service.
Only after you have done this work should you start considering using an overlay. From the feedback, think about what your site is still struggling with and match the functionality of the overlay to your user needs. Again, don’t get your hopes up that this is perfect, but it will be many times better than it was, and everyone will appreciate the effort.
2. Small Organisations Building New Websites
If you are building a site from scratch there are several reasons why an overlay might be helpful. Again I would never apply these to any government or medium to large commercial organisations as they can all afford to deliver accessible products and services, but for very small companies, not-for-profit organisations, local education and charities, this is not an option. But to get the most out of your project, start with an hour’s training for yourself, your developers or supplier, if you are using one.
For starters this video from Jamie Knight at the BBC will give you three things to consider: Colour, Keyboard and Labels.
For developers who are new to accessibility, especially for those building a retail site, the BingO Bakery 5 min video will again help you make significant improvements. If you would like to take it even further the BBC’s Guide to Accessible HTML, their documentation on accessible components — along with Heydon Pickering’s Inclusive Components should be a great place to start from.
If you are the person who is commissioning a small agency and this seems all too technical, then you can use Google Lighthouse to help. Add to your contract that the score must be green and over 90% for performance, accessibility, best practices and search engine optimisation. This won’t give you full accessibility, but it should mean that an overlay stands a better chance of being performant.
If your agency or designer says that accessibility will negatively impact your website in any way, then you need to find someone new to work with. Accessibility improves everything.
Again, please remember that this will almost certainly not make your website fully compliant, even with a overlay, but it will be a lot more inclusive in terms of its audience, and with a bit of paid user feedback (20+ participants), you should know where most of the problems are and can think about what future improvements you need to make.
So before you choose an overlay, use the advice from disabled users you have already paid for. If there is anything you or your agency can easily fix, do that, but if there are still gaps, match these with what an overlay can do. I’ll list all the overlays at the end of the article.
3. An Interim Solution Before a Rebuild
If accessibility is something new to your organisation, depending on the scale and complexity of your challenge it can take time to get on top of what needs doing. It can also be something that can be hard to retrofit accessibility effectively as accessibility needs to be designed and integrated from the start of a project. It’s essential to the way a product is designed and built and not something that can be sprinkled on at the end.
Integrating accessibility in that way is also one hell of a lot cheaper to do. If you ever hear the phrase, “we can’t afford accessibility”, that is because it has previously been badly managed, usually left to the end and as such caused a large amount of refactoring of both UX and code. This is incompetence and not accessibility that has caused any unreasonable costs.
So if you have overcome the myths about cost and process and as much as could be done on a website has been done, but it still isn’t great, then an overlay can possibly improve accessibility in the interim.
This is by no means a permanent solution and ideally you should plan to switch it off at the point the new website goes live.
Some overlays have been designed specifically for this task:
If you need external help with your re-build, then you might need to talk to a specialist agency. There are many and they all have different strengths, so take a little time to decide what the problems are and go to them with questions about how they would help you resolve those issues. Here’s a great list of resources from The Law Office of Lainey Feingold.
4. Legacy Content
This is a problem where accessibility overlays really come into their element. Many organisations carry a long tail of content that can’t be retrofitted for accessibility. Accessibility should always be forward facing and your core products and services, and key pages, should always be your priority. However organisations who have a relatively long web history can have tens, if not hundreds of thousands of findable pages of legacy content.
Sometimes these are flattened or turned into inaccessible and unsearchable PDFs, which is where web pages go to die, but often they are still live and continue to be problematic.
The cost for dealing with this could be astronomical or you could use an overlay to try to improve them as best you can.
You should have a public accessibility statement or policy and if you intend to do that, explain there why some pages have overlays. It is always important to convey your approach so people understand that your intent was to improve accessibility and usability, and not to avoid it.
Paid Feedback
After you have done what you need to do, seek feedback from users, and remember to pay them. They are doing you the favour not the other way round and they are experts in their conditions and the technologies they use, so you are paying for expertise. If you do this then make sure you do not store any personal information or medical data. This is especially relevant if you do an online survey. Make sure it is accessible.
Also focus on gathering data against barriers instead of demographics. People with similar conditions can have very different lived experiences, whereas barriers experienced are consistent, intersectional and can also be transient for all users. That data in general is a lot more useful to identifying and resolving user experience issues.
So Which Accessibility Overlay Should You Use?
This all depends on what you are wanting to achieve.
If this is all about compliance then you have to remember that no overlay delivers this, no matter what they claim. If you are building a new website and you simply don’t care about accessibility but would like to look like you do, you won’t fool anyone by simply slapping on an overlay.
But if you genuinely want to improve customer experience in any of the previous scenarios, then an overlay might help you go some way to achieving that.
I am not going to make any recommendations. So if you still want to use an overlay please don’t be swayed by any of the sales tactics, wild claims or emotive promotional videos you come across. Be objective in your decision making. Find out what all the overlays do. Seek feedback from some users about your current site after you have made any improvements you can. Then think about what you need from an overlay, if you still need one, and then make your decision. If you feel like you’re being pressured by any overlay provider, or if they try and use legal scare tactics, tell you that the overlay is 100% compliant with the ADA, WCAG, EU Directive, The UK Equality Act or any other disability standard or law, or make your feel guilty in any way, strike them off your list immediately. If a product needs a hard emotive sale then it will be lacking in some way.
The following overlays are the ones I knew about at the time I wrote this article. They are all different and all have strengths and weaknesses, so take the time to consider if the use of an overlay is appropriate and if so, what you need it to do before making any decisions.
#a11y #accessibility #UXdesign #productmanagement #websites #designresearch #UXresearch #design #internet #diversity #ux
