Secret Recipe for Accessible Website Implemented Painlessly
Accessible online presence becomes crucial for every business going digital. But there is still a mystery about how to do it most effectively. If you too feel like you need some guidance, read our 7 tips on how to implement an accessible website destined for success.
Accessibility is a term that has gained popularity in the digital industry in the past years. As the world becomes more welcoming for all people and inclusivity is more and more important for everyone, an accessible online presence becomes essential for every business going digital. But let’s start from the beginning…
💡 Web accessibility
(or “A11Y” - which is a numeronym, with 11 representing the count of letters between the letter “A” and the letter “Y”. in the word accessibility) is a practice of making websites, digital tools, and technologies, designed and developed to be usable for as many people as possible. It means making sure that users can perceive, understand, navigate, and interact with the web with no obstacles.
But how to make it happen? The organization called World Wide Web Consortium (W3C) developed a set of shared rules that should be followed in order to provide an accessible digital experience. The standard is called WCAG - Web Content Accessibility Guidelines - and has three levels: A (minimum level), AA (mid-range), and AAA (most restrictive). Following WCAG rulebook is the best and the easiest way of making your website usable for all users.
Accessible Web impacts more people than you think
Note the “all users” part of the sentence. Many people think that accessibility standards are made only for people with permanent disabilities. It is a major misconception of the term. Everyone could be at some point in a situation where accessible features would be beneficial while performing daily tasks.
Think of people who are currently commuting and have trouble focusing sight on small letters and tiny buttons on mobile devices. Or parents taking care of their children while looking for some info online - they need content that is straightforward, and easy to perceive. Someone who suffered an accident and stays in a hospital bed is also using the web differently from the “usual” audience. Not to mention the elders!
Making an accessible website, besides being the most inclusive and ethical choice, can also benefit your organization in multiple ways. From expanding your audience and reaching new customers to strengthening your brand, or improving SEO (yes, accessibility also helps search engine algorithms understand the content better, improving searchability and search engine scores.)
Accessible design makes you stand out against your competitors and reach your full market potential. And as you already decided to make accessibility a part of your digital strategy, let’s dive into details on how to implement such a website painlessly and successfully.
1. The one and only question
You probably noticed that most “pro tips” publications about business decisions start with “ask yourself why.” Well, it’s the same this time.
Why do you want to have an accessible website? Are you doing this to broaden your market share? Comply with laws and avoid lawsuits? Or maybe (hopefully) to provide the best digital experience for all users, including people differently-abled.
Choose wisely. Depending on your answer, you will be estimating the fitting budget, accessing the right time frame, hiring proper experts, and choosing things that you absolutely have to implement and things that can be postponed at this moment.
Remember, that probably you will need to compromise your ideas of the perfect website. What I mean is, reaching all WCAG 2.1 A or AA success criteria with the first deployment might not be possible. And it’s absolutely fine because making a website accessible is a process.: Do you recall the set of rules that should be followed to achieve accessible websites that I mentioned above? Yes, it’s called WCAG and the newest version of this standard is WCAG 2.2, scheduled to be completed and published in May 2023 (well, or later).
2. Start with getting to know the topic by yourself
You might say “but I want to hire people for this job, I don’t want to go through all this knowledge by myself.”
Yes, you can just hire someone and become completely dependent on what they say. And I can assure you, there are companies that are perfectly aware, their customers know nothing about accessibility, and take advantage of that. So if you don’t want to lose a lot of money for non-existing features that just “have to” be done, better know at least some common accessibility solutions. Even the basic set of rules and good practices will make you much more confident about your decisions.
❗️ Remember that
It’s a lot easier to start implementing accessibility while still planning a final outcome, rather than first starting a website and then “adjusting” it to accessibility guidelines.
The latter approach would consume a lot of resources and time reorganizing code and design to accessibility standards. In different words: the job is done twice, and you pay for it triple. You can compare it to the “mobile first” approach. Everyone by now knows that this is the most efficient way to build most modern websites.
So after this bit of preparation, yes, the next step would be actually hiring someone to make the project happen. And don’t worry, as you already dove into the topic a bit, it will be much easier to find suitable people and organizations to collaborate with on your accessibility project.
3. Find a design agency experienced in accessibility
I hope you sit comfortably because I am gonna quote some dreadful statistics from The State of Digital Accessibility: 2022 Survey Report.
73.0% of Design / UX professionals reported that accessibility was part of the design requirements on their last project. However, 37.0% of those people did not understand how to meet those requirements.
Are you still there? Good. So now you understand why choosing a design agency based on a “they do great stuff, visually” attitude, might not be enough.
Putting effort into finding your designers will profit in the future. Some might not want to admit it, but the party that plays the most significant role in accessibility website implementation is not the development team. The major responsibility lies on the shoulders of User Experience (UX) and Accessible User Experience (AUX) experts (however the latter expertise is not that common - yet!). If you find the right ones, the rest should go smoothly. If not, you will get a hell of a headache answering accessibility concerns from the development team.
But how would you know that you found the right people?
- They already have accessible projects in their portfolio.
- They ask you about who your primary users are and what are their needs, before determining the baseline for your website.
- If you don’t have sufficient data, they carry out appropriate research by themselves.
- They will discuss the level of accessibility you strive for - is it WCAG, Section 508, EAA, or maybe you have a definition of your own?
- They will never say anything close to “we can do it either accessible or pretty”. Accessibility and stylish design are not exclusive.
4. Connect with the best-suited development studio
To be frank, the quote from above applies (more or less) to developers as well. Studies show that 36.6% of developers that had the opportunity to be involved in a project with accessibility requirements did not understand how to meet those requirements. And 46.4% rated their development team’s accessibility knowledge only as "Elementary."
They can’t be blamed. While the Web Content Accessibility Guidelines (WCAG) 1.0 were established over 20 years ago, the legal obligation to comply with national laws under severe penalties is quite new. The knowledge in the industry is still fresh, slowly finding the right way to the minds of tech specialists.
It takes a looooot of effort to get to know the deepest details of A11Y recommendations, good practices, and W3C interpretations of each WCAG success criterion. But implementing YOUR accessible website can not depend on an inexperienced team. Be careful selecting the right software studio, so the project will not last much longer than you expected or you don’t end up with a product that only looks like accessible.
But most importantly, remember - there is no magic wand as plug-ins or ready-made solutions that will “fix your accessibility problems.” These kinds of products are just a poor attempt to show the world that you care. However, they rarely break any accessibility barriers and often make websites even less functional.
5. Prepare the right content
Ok, we have the design and development part checked. Have you thought about content? Who will create, implement and then keep updating it on a daily basis?
An accessible website is not "only" good UX and clean, semantically correct code. It is also, if not most, the proper content, which includes:
- Clear and concise copy, using plain English.
- Keeping the right page structure and hierarchy, e.g. by consciously using HTML section headings.
- Enriching media with accessible names and descriptions for assistive technologies.
- Straight-forward and consistent CTAs.
- Descriptive, meaningful text for links..
- Unique page titles.
And the list can go on!
Remember that to meet all WCAG 2.1 AA requirements, you need to properly prepare not only your textual content but also the media, whether it is a photo, icon, gif, video, or audio. For example, all pictures should have well-tailored alternative text, and multimedia should have either a caption, transcript or extended subtitles.
Again - it is no child’s play. If you don’t have content management skills within your organization, don’t hesitate to hire UX Writers or Plain Language specialists. It will pay off in the future - not only benefiting users but also your Google search position.
6. Use tools 🛠️ instead of trust
Imagine that some time has passed and you already have your brand-new website ready to go live. But… wait a second. How would you know that the delivered project meets basic standards and requirements?
Partially, you can review it on your own by surfing the website with just a keyboard or by following our beginner's accessibility checklist. However, this approach can be time-consuming and not always entirely effective. To improve your assessing process, you may want to try out some testing hacks.
💡 Download the Beginner's Accessibility Checklist
We've prepared a useful checklist, that you can freely download and use to check your site's compliance with WCAG A and AA.
Here comes the automatic testing tools list. There are plenty of useful browser extensions, color-checking programs, or web applications that can help you assess the accessibility level of your website.
Commonly used and recommended tools:
- ARC Toolkit - free extension, a set of accessibility tools that helps in identifying accessibility problems and features for WCAG 2.0, WCAG 2.1, EN 301 549, and Section 508. Very practical and multifunctional.
- Accessibility Insights for Web - an extension for Chrome and the new Microsoft Edge that helps find and fix accessibility issues in web apps and sites.
- AXE - accessibility toolkit with a great community. Good choice if you are willing to invest more in your accessibility team and dive deeper into A11Y testing. Free version is also available.
- Lighthouse - already in your Chrome browser. You can run it in Chrome DevTools, from the command line, or as a Node module. Offers a quick overview of accessibility issues, however, is not as accurate as the tools listed above.
- W3C HTML Validator - thanks to this tool, you can evaluate the code quality without knowing much about HTML. Validates HTML files for compliance against the W3C standards and best practices.
Not all WCAG requirements can be checked automatically with proper accuracy. Automatic test results will give you a general idea of the implementation quality but will never give you the certainty that your page meets all the WCAG guidelines. Their purpose is more to help you and your team define areas that need to be improved or maintained.
If you look for objective and reliable confirmation, you should contact accessibility experts familiar with your local laws or certified accessibility testers (eg. with DHS Trusted Tester Certification, IAAP Certification).
7. Don’t you dare… stopping here
Accessibility is a process. Having an accessible website is not something that you do once and then just scratch off from your “to-do” list.
Let’s be frank, you will probably not meet all WCAG AA requirements at the first website launch (but of course, I hope you will). Especially when your website is complex, with multiple subpages, frequently changing content, and lots of media. It takes time to get everything ready and that’s completely fine. Keeping the baby steps pace might be a good idea.
Other than that, I am sure you will soon want to expand your website, change content, tweak the design a bit, or add a few new features. All above will require adjusting accessible practices to the upcoming changes. And as time goes by, accessibility guidelines are being updated. Soon the next WCAG version will be released so there will come the need for, again, more adjustments.
Nevertheless, the most important thing is that you took the first step towards making the Internet a better, more welcoming, and inclusive place for all. Thank you for that!