Sometimes new areas as knowledge-based, analytical and trendy as web design and marketing seem to still have a fondness for urban legends.
Accessibility is like that relative nobody wants to talk about during a family dinner — some people are afraid to mention it as an issue that haunts sales and traffic in a way that nobody wants to admit.
But other skeptics don’t believe in ghosts at all, so there you have those brands and businesses that say accessibility is only for a very small part of the population. Why would they spend piles of money in navigation improvements, if it is very unlikely that many blind or deaf users will visit their sales channels?
Well, not much will change if brands can’t gauge accessibility as a benefit for everybody.
According to recent numbers, there are 1.2 billion people with some kind of disability in the world, and by 2025 the number will rise to 1.9 billion. Taking a peek into the digital world, we see that only around 20% of online content is adapted for people with accessibility needs. Clear evidence that something needs to change.
And it’s more important, and way more cheaper, than you might think.
Does an online design that could tick all the boxes for every type of user really exist? We have contacted some digital marketing and e-commerce experts to see this through and weigh up the true relevance of accessibility for any site performance.
Table of contents
- What is accessibility for an e-commerce website?
- The benefits of accessibility for all types of websites
- The ADA Compliance: How it affects e-commerce sites?
What is website accessibility?
It’s curious that the most common answer from the experts is — “But what exactly do you mean by ‘accessibility’?”.
A precise SEO that makes any website appear in the first search results? A url that is impossible to misspell? Offering PayPal in the checkout process? This confusion reveals how little attention we pay to the accessibility issue and how easily we get common users’ problems muddled up with the real obstacles faced by users in special circumstances.
The World Wide Web Consortium, or W3C, directed by Tim Berners-Lee, works hard, regularly updating the recommendations for an Internet that anybody can use in the same conditions, but not every business feels compelled to follow those standard rules. That means that most websites are not designed for a universal purpose, but for a very specific niche that nevertheless is dismissing potential customers and a commitment that could improve any brand image that offers an advantage over the competition.
What are the different types of website accessibility?
First of all, any website should be adapted to all types of accessibility needs, but these are more diverse and complex than just adding some subtitles for deaf users.
According to the A11Y Project, there are four types of disabilities that we can also identify as website accessibility categories:
Visual
This affects all type of users with partial or total visual impairments, from low vision users and elder people with eye strain to non-sighted users.
- Myopia & Astigmatism
- Colour blindness
- Glaucoma, trachoma
Auditory
Surveys indicate that most users turn off the sound on their devices while surfing the Internet or using apps, but sounds are still useful for notifications, marketing materials and video, and this is a problem for users that suffer from hearing problems such as:
- Deafness
- Presbycusis (age-related hearing loss)
- Acoustic trauma
- Auditory processing disorder
- Otosclerosis
Motor
The Internet is often defined as a visual and musical medium, but we couldn’t make much use of it without our hands and fingers. Voice search commands and voice assistant devices are changing this scenario, but there is still much more to accomplish. Users with motor impairments use special keyboards and technology, but the code and navigation system in a website can still be a labyrinth in cases such as:.
- RSI
- Cerebral palsy
- Parkinson’s
- Muscular dystrophy
Cognitive
Not every problem occurs on the outside — some disabilities could have cognitive or neurological origins: accessible websites must also take into account users that have difficulties processing information, specially complex processes and pages with lots of stimuli, elements and counterintuitive navigation.
- Down’s syndrome
- Autism
- Global developmental delay
- Dyslexia
Adapting websites to all these needs is a blessing in disguise as the improvements are not only for people with permanent illnesses or problems, but also for users with temporary disabilities and elder people that have a hard time processing how the Internet works.
Most importantly, it’s a way to take care of SEO and UX at the same time, making possible that any website is reachable, understandable and useful for everybody, not just for a portion of the audience.
As Mike Wittenstein, Founder and Managing Partner of StoryMiners points out, by going the extra mile and adapting your site to others (so that they don’t have to exert extra effort to adapt), you send a powerful message that your business cares about them.
→ Related: User Experience | All the skills you need to master
Accessibility for e-commerce websites
Do all the people mentioned above need to buy things and would visit an online shop to buy a teddy bear for a niece’s birthday that is really hard to find in stores? Absolutely yes.
Most brands would think that people with disabilities rely on assistants or use websites specifically adapted for them — why can’t everything be useful for everybody? A blind person might also want those comfortable Converse trainers, and elder people would definitely stock their organic granola in your online shop if they could zoom the list of ingredients displayed in such a tiny bulleted list.
Shopping online is an activity that is increasing in popularity for everybody, because it’s also super-convenient. Think of people that can’t leave the house or lives alone — the ability of ordering something online and having it delivered to the front mat is a dream come true. Businesses are neglecting an audience that is also willing to pay and, bingo!, to become loyal to those scarce brands that offer a truly accessible navigation in their websites.
That does not mean that navigation for other types of users will change — no strange alterations, gigantic fonts or features that could slow down website response and load times. From very simple changes that anybody can make, like zoom tool in text and images, descriptions and subtitles in videos, to more complex code arrangements that could also offer long tail benefits for online sales.
"The job of a company's e-commerce site is to make its products and services as easily accessible as possible for as many potential customers as possible. The benefit of going direct-to-consumer is that it opens up that opportunity and so focusing on maximizing that accessibility will allow your brand to achieve its goals at the highest level.” Erik Huberman, Hawke Media CEO
The benefits of accessibility for all types of websites
Let’s see why websites and online shops need to bite the bullet and start improving accessibility.
-
It increases target audience: In case you missed it, there are 1.2 billion people that non accessible websites are leaving out of the picture. For starters, the most common issues are visual impairments, as according to The World Health Organization 1.3 billion people have some visual impairment and 36 million people are blind. The Color Blind Awareness organization says that there are 1 in 12 men and 1 in 200 women affected by colorblindness, and that is 12.8% of population just in the USA, according to the latest study performed by the Institute on Disability of the University of New Hampshire. It seems a tiny number, but it means 40.7 million of users.
-
Reinforces SEO: Taking care of the text and structuring a website properly has a positive impact on positioning and traffic. Better titles, descriptions or metatext lead to a simpler and faster navigation for everybody, as all types of users expect accurate information that is also easy to locate and understand.
-
Helps build better UX: As we have pointed out before, accessibility improvements are not only useful for specific people — they make navigation easier for everyone, because along the way you can correct errors and problems that were discouraging all types of users, like a complicated menu, an unreliable payment process, blurry images, poor product details and descriptions, or search categories that were a total mess. As the Digital Strategist Shane Barker says, accessibility makes the whole customer purchase journey easier and it also improves the overall shopping experience.
-
Improves brand image: It sounds narcissistic, but this is a collateral effect of working for the greater good, not the goal itself. An accessible website offers good reputation, because it shows that it cares about an often disregarded community, and it gives a boost to word-of-mouth. To make matters worse, website with no accessibility adaptations could also face legal complications in some countries or if some association makes a complaint.
“Wouldn’t you want to do business with the company that proves it truly cares more about you than others?On top of that, people who are differently abled tend to speak with each other and frequently share work-arounds. If someone finds your site easy to navigate and purchase from, you can be sure they’ll tell their friends online. That can mean more business for you.” Mike Wittenstein, StoryMiners Founder and Managing Partner
Actions for website accessibility
The list could be endless. If you check THE WAI-ARIA or WCAG 2.0 guide, it looks pretty discouraging. Most websites score low in digital accessibility, but the most powerful brands are taking the lead. Amazon is already at an estimated 75% of accessibility level — are you going to miss the chance of securing yourself a spot in the fierce online competition?
The road ahead is long, but every tiny action can make the difference for lots of users. You don’t need to apply every accessibility recommendation in a website at the same time — make a start from those things that are urgent for most users or your type of content, depending on the site. Does it show a lot of video content? Is it an e-commerce channel? Do you use HTML or JavaScript?
If this seems too complicated for you or your design team, there are professionals specialized in developing accessibility improvements for websites, as some of these recommendations can be expensive and difficult to implement.
And if you want to avoid biting off more than you can chew, you can start with some extensions like NoCoffee for Chrome that let you see how any website could appear to people with different impairments, and get an idea about what needs improvement.
Code
It doesn't really matter if you write the code of your website with HTML, JavaScript, Ajax or CSS, but do it with accessibility in mind. Everything should be reachable from the keyboard.
Designers should consider that lots of features that seem very cool and useful for the majority of users can be a perfect storm for some people. For example, the common drag-and-drop functionality is not available to users who can only use a keyboard.
ARIA
You are thinking about a cool Game of Thrones character, right? Well, this is way cooler, and could it be a coincidence that, *spoiler alert*, the character goes blind for a while?
WAI-ARIA is the Accessible Rich Internet Applications, some guidelines that try to make web content more accessible to people with disabilities. Dynamic content, user interface controls and other technologies are some of its main working areas, and ARIA also provides a framework for adding attributes to identify features, technologies to map controls and live regions, and a way to provide keyboard navigation.
ARIA is a great encyclopedia of standards that let design teams and websites adapt complicated elements like accordion menus, breadcrumbs (lists of links), checkboxes, combo boxes, grids, menu bars, sliders, spinbuttons, toolbars, tabs, tree views, tree grids, window splitters…
Sometimes you don't realize how many things can be an impediment to a user until you put yourself in their shoes… or on their screens.
Alt attributes
We take a leap into easier steps that are also essential actions for any kind of website improvement.
Using [alt] attributes gives users with disabilities an alternative text for visual elements like pictures they can’t see (you can skip it in just decorative elements), but it also contributes to your SEO. Alt-text can improve the positioning in image searches and in the increasing use of voice description to find images that match a text, phrase or description.
Social media images should also have their alt-attributes checked out, especially in multichannel or omnichannel strategies. Remember that this can be quite handy for non-disabled users that have slow connections or some image blockers in their navigation system or apps.
Meta tags
This is not rocket science either — properly using the meta tags in the code text allow users to use essential functions like zoom image or scalable fonts. Meta tags may not have a big impact on search results rankings anymore, but they are still a critical point for accessibility.
Meta titles, description and keywords are useful for making any page easy to find in search engines, and they provide alternative information for people with disabilities that can’t see screens as other people do.
Associated labels
These <label> elements allow users to identify controls like drop-down menus, text fields and checkboxes. Associated labels are essential for users with disabilities that want to fill an online form or follow some instructions in a website.
“Even the brands that invest heavily in marketing often forget about accessibility and website optimization. Just because you have placed an ad or promoted your products on social media does not necessarily help with conversions. You need to put in that extra effort to ensure that the shopping process is as easy for customers as possible.” Shane Barker, Digital Strategist
Clear buttons, links and urls
Every website should use interactive elements with accessible names, like short words on buttons and call to action banners that anyone can identify at a first glance — this goes for every type of user. But remember to add ARIA-label attributes to explain each button function if it’s not clear enough.
Accessibility also means to write clear links and page urls that can be easily find in online searches and that are not too long and difficult to dictate or write.
Semantic tags
We enter the visual design realm, but some choices that seem purely aesthetic can also have an impact on accessibility.
For example, an <h1> tag marks that an element is at the top of the page’s hierarchy, and provides information about the page’s structure to users. Semantic tags are therefore important to identify which elements are more or less relevant in a page and allow users with visual impairments rapidly find sections, categories and have a general impression about the page’s design.
Easy steps
A clear structure and a simple layout are fundamental for any website and all processes involved in it, from a shopping cart to how to reach customer support.
This tends to be a problem to many users, but add an extra of difficulty for users that also can’t identify a hamburger menu or a checkbox at a first glance.
Voice search optimization
Yes, this is key for blind people, but its popularity is growing among all types of users. Siri and Alexa are just at the top of a new way of searching the Internet that will continue to expand in the next years. Websites must be prepared for this, optimizing their text and visual contents for voice searches by making everything more natural, simple and adapted to the way people talk.
There will be more specifics involved in honing voice searches, like speech analysis, pronunciation, and the level of grammar and lexicon used by the user, but you don’t need to wrap your head around those things yet.
Alternative elements
Finding a website design that works for all is not hard — it’s impossible. Thinking about what the majority likes best is the laziest solution, and any website can develop some alternatives that support users with special needs.
For example, a website can offer the option of changing its colour palette for users that have color blind anomalies. You can check any current website with tools like ColorOracle, which simulates all types of colorblindness.
Other useful additions are sounds notifications for visual impaired users, like when they make an error or when they need to complete an omitted field in a form. Subtitles and captions in videos are also a must, but try not to generate automated subtitles that have very low quality, and incorporate captions for sound effects or even a person that speaks sign language, although that’s the most expensive solution.
Minimal visuals
Did you ever see those old disclaimers for Pokemon watchers, saying that some visuals could cause epileptic attacks? Part of it became an urban legend, but it’s true that repetitive flashing elements can cause seizures among users with visual or neurological problems.
Some tools let you measure for photosensitive epilepsy in website pages, but you can easily solve this problem by reducing the amount of flash animations, differentiated background and foreground elements. High-contrast color schemes, and texture and shapes that distinguish very similar colors are better, but you can also give the option of changing the colors on your site to the user.
Websites also need to be adapted for screen readers that help users with visual impairments read texts, like screen magnification systems, braille displays or speech synthesizers.
Understandable copy
This should be a sacred commandment for any marketer and copywriter: no complex phrases or strange words unless it is necessary for industry terminology, please.
Finding neat and comprehensible texts in a website is a blessing for any type of user, but it makes things easier for people that have some cognitive problems. They can’t understand texts as fast as other people, and they can miss the point of common idioms, metaphors or funny catchphrases. Just be clear and make a long story short.
Performance metrics
You can’t call it a day yet — a website needs to be audited constantly for accessibility just like for SEO performance. Luckily there are lots of tools that help you on this front, like Google’s Lighthouse, a powerful analysis that shows charts about website accessibility, or ChromeVox or WAVE made by WebAIM, though this one doesn’t check Javascript source.
The ADA Compliance: How it affects e-commerce sites?
“ADA” stands for The Americans with Disabilities Act, but Ada was also the so called ‘mother of programming’. Ada King, Countess of Lovelace, was the woman that took the first step into using maths for creating a computer algorithm. She was also a sickly child, she needed to walk with crunches and suffered from severe headaches, but that did not stop her from learning.
What would Ada Lovelace think about her computer science dream going totally wrong for people with special needs, like herself?
The ADA act was created in 1990 in order to guarantee an equal access to disabled people in the USA. This applies to lots of areas, but in recent years some standards about accessible design in the Internet and mobile apps have also been developed, because “poorly designed websites can create unnecessary barriers for people with disabilities, just as poorly designed buildings prevent some people with disabilities from entering”.
Basically, the recommendations are those compiled in the Web Content Accessibility Guidelines (WCAG) by W3, and websites of B2C, retail and any public business should have a minimum grade A compliance, though grade AAA is the highest score.
After some recent new regulations (under Title III), penalties don’t apply to online content that has not been modified since January 2018 — if you have revised, created or upgraded something since that date, then your website is obligated to comply with the ADA guidelines or it could face a lawsuit.
It’s no joke: famous brands like Nike, Burger King, H&M, Urban Outfiters, Coach, Glossier, Hugo Boss or Pandora have already received complaints about this matter. The Winn-Dixie grocery stores chain lost its ADA lawsuit and was forced to adapt its website for blind users. In the first quarter of 2018, nearly 300 ADA website lawsuits were filed just in New York city.
Usually, claims come from individuals and not collectives, but they are gaining more repercussion, and there are ethics and reputation involved. A headline, a little press piece, some angry tweets and rants in public forums or Reddit can cause more damage to a brand’s reputation than investing some money in making websites accessible for everybody.
What happens if you are not an American based business?
You may not be legally obliged to comply with the ADA compliance, but as we live in a global market where brands aim for international sales, it’s useful to know and respect these guidelines regardless of a brand being from another country or continent.
Conclusion
People with disabilities exist in all parts of the world, and working for better online and digital accessibility is a universal improvement that regulations like ADA subscribe as a fundamental right.
It may look inappropriate to highlight the collateral benefits of making an accessible web for everybody, but we can’t forget that this is all gravy — users traditionally living on the margins are getting the attention they deserve, and businesses are taking care of new types of consumers, enhancing their reputation and brand image, and applying online improvements in the customer journey.
