Accessibility, compliance, and your winery website

Greetings, friends, and welcome to another Must Read. This week, I’m handing the reins back to Michael to give us the lowdown on Accessibility compliance, why it’s a must, and why a solution that looks too good to be true, generally is.

In the last DBAD series, we talked about site speed. What it is, why it’s important, and how business owners are shooting themselves in the foot and turning away customers in the name of vanity.

Today’s topic follows suit perfectly with that. Today we’re going to talk about accessibility, why it matters, and why it’s good for every single one of your customers.

But first, let’s recap some laws.

There are none.

What?!

Better put, there are little to no laws written specifically for websites, nor are the existing laws written well enough to know if they apply to a digital place of business vs a physical place of business.

Does this mean you’re safe? Hell no. You can still be sued. And the laws are catching up, quicky. This isn’t a flash in the pan concern like Y2K. This is the new norm, and you’d better prepare for it.

So what rules apply to you?

ADA: Americans with Disabilities Act. Prohibits discrimination against individuals with disabilities. https://www.ada.gov/

WCAG: The Web Content Accessibility Guidelines. Part of a series of web accessibility guidelines published by the main international standards organization for the Internet (W3C). They are a set of recommendations for making Web content more accessible, primarily for people with disabilities—but also for all user agents, including highly limited devices, such as mobile phones. WCAG 2.0, was published in December 2008 and became an ISO standard, ISO/IEC 40500:2012 in October 2012. WCAG 2.1 became a W3C Recommendation in June 2018. https://en.wikipedia.org/wiki/Web_Content_Accessibility_Guidelines

A11y: Accessibility is often abbreviated as the numeronym a11y, where the number 11 refers to the number of letters omitted. You may also see references to the A11y Project, which is a community driven effort to make accessibility easier. https://twitter.com/A11YProject

Section 508: Section 508 was made part of the Rehabilitation Act of 1973 in 1998. Its purpose is to “…require Federal agencies to make their electronic and information technology accessible to people with disabilities.” The guidelines affect all federal agencies and vendors, contractors and partners of those agencies operating in the United States or abroad. https://www.section508.gov/

Not in the USA?

Don’t count your chickens just yet. Most countries have their own laws.

In the EU, you need to read up on the EU Web Accessibility Directive: https://axesslab.com/web-accessibility-directive/

In Canada, your government just unanimously passed bill C-81, The Accessible Canada Act, which awaits royal ascension and will more than likely enforce WCAG standards on all Canadian business websites. https://www.parl.ca/DocumentViewer/en/42-1/bill/C-81/first-reading

Why does any of this matter?

Like my previous series clearly spelled out, this isn’t an arbitrary measurement of success based on an audit. This is you, as a business, delivering a better experience to all of your users. Accessibility equates to usability.

And I want to make it very clear. An accessible website is a better website, for everyone.

Who is the target of an accessible website? You will often hear stats about how many people live with a disability, how many are color blind, blind, hearing impaired, movement impaired… I’m not here to repeat those stats. The number isn’t small. But not all disabilities are permanent. What about someone with a broken arm who can’t use a mouse? An eye injury and they can’t focus on text very well?

I know this all too well. Earlier this year, I found myself gliding across a phantom sheet of ice on the road. I lost that fight, broke my finger, and had my right hand in a cast for 4 weeks. I’m right handed. Over the next 4 to 6 weeks, I was navigating the web with my left hand, either awkwardly with a mouse, or with my keyboard. It can be difficult for people to truly empathise with a situation prior to being in it themselves, but I assure you, I definitely do now. Keyboard navigation on the majority of sites I visited was a pain to say the least. It was non-functional in some cases, leaving the website completely unusable for me.

When’s the last time you tried to use your own website without a mouse? Or with your screen turned to grayscale? Or with a screen reader?

Try it. Please.

Accessibility isn’t a feature. A website that isn’t accessible is literally preventing someone from accessing the data like anyone else could, which is discrimination. Let’s start fixing that.

So how does this apply to your winery website?

Most people begin with the basics:

Can a user read your text, see your images, and visually distinguish links on your site, without the assistance of colors?
Do your images have alt text that accurately describes what the image is portraying?
Can a user navigate your entire site without a mouse? How about with only a screen reader?
Do your links have clearly written text, so that the user knows the action they are taking vs a generic “click here”?
Is the site’s language defined in the HTML code?
Can a user skip repetitive content, like headers and footer, thereby saving themselves from a screen reader reading the same text over and over, or having to tab through dozens of links?
Is your text size large enough to read on all devices? (hint: never go smaller than 16px on any screen size)
Are your form fields clearly labelled? Do form errors tell the user what they did wrong?
Are your HTML tables scoped and do they degrade properly?

But it goes much deeper than that…

Can a user add to cart and purchase your products on your website using a screen reader only?
Can a user zoom in on desktop and still have a function site?
Can a user pinch to zoom on mobile?
Are you using semantic HTML?
Do your headings follow structural rules and appear on page in logical order?
Is your audio transcribed? Is your video closed-captioned or transcribed?
Does the tab order of your site follow both the visual order and DOM order?
Does keyboard focus get placed in new contexts like sub menus and modals?
Do landmark elements appear the same across the site and behave predictably?
Do all your digital communication follow these guidelines, like emails and PDF downloads?
Do focused links and buttons have an outline to show they’re actually focused?

But wait, there’s more…

Does your DTC provider have fully accessible sites?
If you’re using a 3rd party solution for e-commerce, is that experience fully accessible?
Who’s liable if it isn’t? (hint: you are)

Overwhelming? It doesn’t have to be.

What you can do about it.

If you have yet to build a website, or you’re going to rebuild, make sure you’re working with someone who understands web accessibility, is committed to making your site accessible, and doesn’t talk about it like a “feature” or “upgrade”. Building an accessible site is no more difficult than building an inaccessible website, it just requires different methods.

If you already have a website, it needs to be properly audited. There are many tools available online, for free, than can help you find the low hanging fruit of accessibility errors. But these tools are incomplete, and do not cover all of the aspects of true WCAG compliance.

“But my automated scan said I’m in the clear!”

As I said, these are incomplete scans. They cover low hanging fruit. Just ask GNC: https://www.levelaccess.com/federal-court-decision-gomez-v-gnc-highlights-importance-choosing-experienced-accessibility-expert/

“According to his report, Dolegowski tested the GNC website with two automated accessibility checkers, both of which are available free online. When the test results returned no errors on the website, Dolegowski concluded there were no known accessibility issues.

Gomez, on the other hand, retained a third-party digital accessibility consulting firm, which concluded after an audit of the GNC website that it contained accessibility issues that would prevent individuals using a screen reader from adding products to their shopping cart and completing a purchase.”

A proper accessibility audit involves manually checking every single page of your site for errors in compliance. These take time. We tell wineries to estimate for 1 hour of time per page on their site.

“But this other agency offers a flat rate package for full ADA compliance!”

Then they’re either outsourcing the work for a very low wage, or they’re not doing a proper audit. Or they’re working for free. Which seems the most likely to you?

Often our advice to wineries is that a full rebuild from the ground up is cheaper than a full audit and repairs, and this is why. Some sites are so poorly coded that fixing them will simply take longer than replacing them.

“But what about this other 3rd party service that provides ADA compliance with a widget?”

I call this the band aid approach. Overlays. Widgets. Whichever name you use, you’re probably familiar with the little “accessibility icon” floating on the bottom of some web sites.

But there’s a huge problem: You’re not fixing your accessibility errors, you’re adding a script to the page that tries to provide accessibility tools to users in order to circumvent your lack of ADA compliance in the first place. These tools are not a good long term solution. We’ve seen some that didn’t even pass accessibility audits, and the winery still paid money for it. We’ve also seen some of these overlays add so much scripting to your site that it actually slows it’s load times down considerably, and could even slow down a users computer or phone if it’s not capable of handling non-stop scripting on a site.

“Accessibility overlays do not make your site accessible.”
Michael Bourne

Skeptical? Don’t just take my word for it:

How does any of this improve the user experience for all my users?

I told you earlier that accessibility was good for every one of your customers, and I mean it. These aren’t niche fixes that only affect a small subset of your users. These are user experience enhancements that everyone can and will benefit from. And that has its own rewards that aren’t found in technical data, such as higher user satisfaction.

Just like site speed, we need to think of accessibility as a way of doing business and presenting our brands, not as an afterthought or a feature we add on.

When should you take action?

Now. Find the budget, make the changes, and do it before you find yourself in a lawsuit that will ultimately need to be settled financially, and you still have to make these changes.

From Eric Bailey on Smashing Magazine: “Much like traditional user testing, being too close to the thing you created may cloud your judgment. Empathy exercises are a good way to become aware of the problem space, but you should not use yourself as a litmus test for whether the entire experience is truly accessible. You are not the expert.” https://www.smashingmagazine.com/2018/09/importance-manual-accessibility-testing/

Not sure where to start? Give us a call at 5forests.

Resources

Wave Accessibility Tool: https://wave.webaim.org/

Natural Reader Text to Speech: https://chrome.google.com/webstore/detail/natural-reader-text-to-sp/kohfgcgbkjodfcfkcackpagifgbcmimk?hl=en

JAWS: https://www.freedomscientific.com/Products/software/JAWS/