We all know that personalized and streamlined customer experiences are crucial to the success of any digital strategy. Customers expect high-value interactions wherever they spend their time shopping. But how do we know if our customers are experiencing the type of...
Why Should Your Website be Accessible? And How to Get There
What is ADA and section 508?
ADA means Americans with Disabilities Act. ADA was enforced by the US Equal Employment Opportunity Commission, or EEOC for short, and designed to prohibit discrimination against people with disabilities and provide equal opportunity. Section 508 is specific to information technology or digital accessibility. Like ADA, Section 508 puts a legal framework in place for citizens with disabilities to achieve remediation.
Here are some quick numbers for you to see why ADA/508 is so crucial to your website and possibly your sales if you belong in the world of eCommerce. There are over 4.57 billion internet users. In the US alone, users spend approximately $517.36 billion online; $490 billion of that is from users with a disability of some kind (no hearing, no mouse, no sight, low or tunnel vision, or cognitive disability). If your website is not accessible, you may be excluding 60 million Americans. You could be losing 69% of your customers with disabilities instantly by not meeting their needs, and 80% of customers with disabilities have stated they are willing to spend more on a website that can.
What are some guidelines for meeting compliance?
There are levels and guidelines you’ll want to meet. The best resource for detailed information, including successes and failures, on all guidelines, are the WCAG 2.1 Guidelines.
Here you’ll follow POUR (perceivable, operable, understandable, robust).
- Perceivable: Content is presented in an easily perceivable manner.
- Operable: Navigation is easy to operate.
- Understandable: Content is easy to understand.
- Robust: Your website content can be interpreted by various devices and platforms.
There are 3 levels of accessibility acceptance to meet customers’ needs and keep your website compliant.
- Level A – this meets minimum requirements
- Level AA – acceptable compliance (this is what you want to strive for)
- Level AAA – optimal compliance (while this is desirable, it is often hard to reach)
Changes you can make now to meet compliance.
Clean, semantic HTML for screen readers
Screen Readers read in the order in which the HTML is written. Divide the page into page sections (H1-H6), landmarks (complementaries, navigations, etc.), and ARIA labels (an accessibility attribute, and used in cases where a text label is not visible on-screen).
When using images, video, or audio – create alt tags. Alt tags are used to describe content users may not be otherwise able to view. Alt tags were literally created for accessibility meaning “alternative to the image,” and to work together with screenreaders.
Include a Skip Navigation link
A “Skip Navigation Link” provides a way for users to skip over navigation entirely and go straight to the main content; they are hidden until the user hits the tab key. Without this option, you’ll leave users tabbing through numerous navigation options to be able to finally get to their main content. Can you imagine a user tabbing through Amazon’s navigation? Yikes. Weather.com does a really great job at its use of the Skip Navigation link. The best part for developers is that this implements relatively quickly with a small snippet of code you can find here.
Prioritize color contrast and typography
Given the number of tools that exist to help check these items, there is really not a huge case to not have these items already compliant; these items have more to do with visual impairments and are easy to check. For text, a user should be able to increase their browser size by 200% and still reliably use your website. For color contrast (including text), a contrast ratio of 4.5:1 or higher should be met for text over background (4.47:1 is not 4.5, please do not round up). Text ratio should be at least 7:1 ratio to be unmistakable legible.
Here are a few tools you can use to check color contrast (click here for a complete list):
- STARK (integrates with XD, Figma, and Sketch). This can scan your mockup to make sure everything is at least meeting Level AA requirements. Free for minimum features, $60 annually for all features (with more to come).
- If your website has a live space – check out Toptal’s color filter. This will allow you to see variations in different levels of colorblindness, and it’s free.
- Analyze color contrast ratios by using Color & Contrast Picker. It’s free.
Provide transcripts for video and audio content
With video and audio content on the rise, it’s more important than ever to make sure everyone has equal access to it. According to HubSpot, 72% of customers would instead consume learning about their new product or service through video. A couple of reasons you should provide transcripts for audio-video are not everyone can see and hear videos or podcasts, and COVID-19 raised the stakes for more people shopping online, doctor visits, and online social events. It has now become the standard to provide captions and written transcripts.
Stay tuned for an upcoming blog on how you can make your social media more accessible!
Start the Conversation
BlueSky’s unmatched commerce expertise allows us to help our clients understand how to utilize omnichannel and business solutions to reach, attract, engage, and grow customers.
Composition Culture I have two teenage boys who are REALLY into music. One plays drums and sings. The other plays bass and lead guitar. They get their talent from their mother for sure. I do not have a musical bone in my body. Don’t get me wrong, I love music. I just...
Gaining Traction: Five Ways Nonprofits Can Leverage eCommerce Strategies to Catapult Their Fundraising Outcomes
There is likely no better industry to adopt digital strategies than the not-for-profit industry. And now is the time nonprofits should begin looking at their digital transformation strategies as they head into year-end fundraising activities. By integrating digital...
According to CNN Business, the US economy added 943,000 jobs in July and the unemployment rate fell to 5.4%. This was the biggest job gain since last August. Additionally, CNN reports the June jobs gains were revised upwards to 938,000 jobs added. To coincide with...