Is your website accessible for your entire audience? Website accessibility is not only mandatory, but vital – here’s how to achieve it.
Subscribe to our blog
The words website accessibility have been thrown around a lot over the last two years. But the reality still looks very different – which is a chance for you to stand out.
The term itself seems easy to understand: something can be accessed easily. For many years, society has been reconstructing public areas to be accessible for many types of disabilities. In some places, individuals who are hard of hearing can get visual announcements in public transport stations; those who are blind or have vision impairment can make use of pedestrian areas with tactile paving; and stairs have been modified into ramps for wheelchair users. The time to include websites in this list is now!
Why invest resources in website accessibility?
Why worry about website accessibility? The short answer is: it’s mandatory. The European Union, for example, introduced a set of regulations in 2018 that should be applied to websites in the public sector.
By the second half of June 2022, any ecommerce site must adhere to the same rules, as defined in the European Accessibility Act.
But this regulation should not be your main motivation to actively make your website accessible. Roughly one out of five people in Europe have a disability, whether temporary or permanent. Translated to an actual number: 89.5 million. In other words, your business misses out on 89.5 million people in the European Union if your website is not accessible.
Where to begin with website accessibility
Accessibility is not something you can do overnight. It calls for a different way of thinking and working when you set up your website. And it's something you should consider before even developing it.
To start with, awareness comes before action. The following examples show how more awareness of accessibility can go a long way:
Let’s look at Anna for our first instance. She has a visual impairment and needs to order something from your site. For this reason, she will not be able to read the website like some other people do. Instead, she'll use reading software. In this situation, the visual layout of the website is less important than the content, including alt text.
To be aware about different needs for different situations, you can refer to the Inclusive Design Principles. They are about putting people first and making a website equally accessible for everyone, independent of individual challenges.
Another audience to account for are those with a color vision deficiency. For this group, contrast is of the utmost importance. Imagine Jim, who has color blind type Protanopia. He cannot see the full red-green spectrum of colors and will most likely see it as grey or yellow. If you were using a grey background with green text, he'd have difficulty reading your green tinted text.
By adapting to needs such as the examples listed above, you can structure the design in a way that invites everybody to your website.
Website accessibility tips for developers
The last pillar on the way to building an accessible website is the development phase. Most developers are familiar with the term accessibility, but don’t have much experience in implementing it.
A good starting point is semantic HTML. When developers begin building a new website, they come across different elements to define the content. These are standard components of the HTML language and work as a very good starting point to make the website more accessible, and it takes almost no effort to implement them.
Speaking software can help make best use of these elements, by giving more context to the customer. They represent a logically structured way of reading your website. For example: A header of a website contains a navigation. The navigation contains elements to access certain pages.
A developer might get the header and navigation parts right, but not the elements in the navigation. If you rephrase this to a list of elements, they'll immediately start using the UL (unordered list) of OL (ordered list) elements of standard HTML, rather than an unknown element.
In short: think about the structure of your website and consider whether HTML has some default elements that describe what content you are putting on it.
Website accessibility using AEM
The Adobe Experience Manager (AEM) can set the tone for making accessibility less complicated for content authors and developers with out-of-the-box features that help them add more information to a certain element of the website.
Let’s start with images. Digital Asset Management (DAM) in AEM provides a central storage component for all digital media on your website. Any image in AEM is an asset in the DAM. And the DAM provides not only the image itself, but also the metadata that comes with it.
This metadata can be edited in a form and adapted without changing the implementation on the website. And the best part of it all, you can change the asset's defaults when putting the site together, depending on the context of the page where you place it.
For this reason, content editors should make sure to provide meaningful information when explaining the asset in the DAM, while developers should be aware that they need to use the metadata from the DAM for their implementation code.
Web Content Management (WCM) core components are standard building blocks for websites in AEM, ready to use. These components were built with accessibility in mind. If you look at the tab component of this project, you 'll see that these elements are using the Accessible Rich Internet Applications (ARIA) attributes to add more detailed information about the elements of the tabs. Generally speaking, ARIA should come into play whenever HTML cannot assure the accessibility.
Website accessibility is becoming a requirement for any web applications and will add more aspects to web development. This doesn't imply more cost in the website building process – as long as you implement it from the beginning. You can look at it as a different way of working and even as a different way of thinking.
The key message: Just do it, for everybody!
About the author
Dries Vanbilloen is an AEM consultant for Amplexor Belgium. He has worked for Amplexor since 2018, where he has worked on multiple projects with various Adobe products, such as Adobe Experience Manager, Adobe Launch and Adobe Analytics. His passion lies with creating good website experiences for everybody.