Imagine it’s sometime in the future. Covid-19 has been somewhat contained where you are, and many people have decided to go back to the office on some days, and you’re one of them. Imagine that part of your commute to work involves a walk, and your walk takes you through various neighborhoods.
You pass a bus stop on your walk, and hear one person asking another how to find out when the next bus is coming using the app. Neither of them can figure out how it works. …
What is accessibility?
Accessibility is the degree to which a product, device, service, or environment is available to as many people as possible. The Canadian National Institute for the Blind (CNIB) defines accessibility as:
The ability for everyone, regardless of disability or special needs, to access, use and benefit from everything within their environment.
People can have a variety of disabilities that would prevent them from using a website with a mouse pointing device. A full 16% of the US population has a disability, and would benefit from keyboard and screen reader navigation features on a website. This is a significant population of about 35 million people. …
Why aren’t more digital experiences accessible?
Web accessibility means that digital experiences are designed and developed so that people with disabilities can use them. When digital experiences are not accessible, then online content and services are unavailable for a huge population of disabled users.
There are already plenty of articles about how most digital experiences are not accessible. All you need to do is Google that topic. This post is about why most digital experiences are not accessible, and how we can change that on our teams.
Nobody wants to exclude people
Nobody wants to exclude people from accessing content based on how they access it. Nobody is out there saying, “I don’t want keyboard users to buy my products.” Nobody says, “I would like to exclude screen reader users from learning about my company’s services.” …
Accessible eStore recap
The Accessible eStore is an interactive prototype of an accessible e-commerce storefront. It launched on Global Accessibility Awareness Day, May 16, 2019. Follow this link to read more about the eStore launch.
We created the store because the web needs more examples of accessible experiences. In this article, I will share some development features meant to help keyboard and screen reader users navigate the eStore. Open the store in a separate window and try out the features as you read this article.
If you haven’t already, please read part one of this series first!
The difference between keyboard and mouse pointer navigation
A mouse pointer user can click anywhere on the page whenever they want. But when you navigate using your keyboard, you can’t arrive at content mid-way down the page without tabbing through every single node on the page. Unless someone builds in shortcuts. This article talks about all of the shortcuts we created for keyboard users in the Accessible eStore. …
Accessible eStore recap
The Accessible eStore is an interactive prototype of an accessible e-commerce storefront. It launched on Global Accessibility Awareness Day, May 16, 2019. Follow this link to read more about the eStore launch.
We created the store because the web needs more examples of accessible experiences. In this article, I will share some development features meant to help keyboard and screen reader users navigate the eStore. Open the store in a separate window and try out the features as you read this article.
Defining page template structure is a collaborative effort
It is a common misconception that developers are responsible for web accessibility. Actually, developers must collaborate with experience designers to make experiences accessible. Experience designers provide specifications to developers. These specifications should outline how the experience works with a mouse and keyboard. They should also describe what the screen reader should announce. …
On Global Accessibility Awareness Day (May 16, 2019), Publicis Sapient is launching the Accessible eStore, an iterative, interactive prototype of an e-commerce storefront. Read on for more details…
The State of Accessibility in E-Commerce
Last year I published an article on Medium on the State of Accessibility in E-Commerce. It described the results of a series of automated and manual accessibility tests performed on some popular and successful e-commerce retail stores. The results were depressing. Most of the sites had significant barriers to accessibility. Please check out that article then come back and read this one.
I did the same tests again this year, and am glad to report some significant improvements. Keyboard accessibility has improved. There are fewer instances of animations that cannot be paused. More link labels are descriptive. More form error messages are reported by the screen reader, and forms are a bit easier to fill out. I grade the experiences using a letter grading system that is popular in Canada, where percentages are translated into letter…
Why test automotive websites for accessibility compliance?
In July of 2018, one of my automotive clients requested an analysis of their competitors’ website accessibility. With this request, my client demonstrated an understanding that users can have a variety of disabilities that would prevent them from using a website with a mouse pointing device, but would not prevent them from reviewing, selecting, or purchasing a vehicle online, or even driving a vehicle. A full 16% of the US population has a disability, and would benefit from keyboard and screen reader navigation features on a website. This is a significant population of about 35 million people.
According to the Canadian National Institute for the…
At the end of February, 2018, I had the opportunity to present on the state of e-commerce and accessibility at the annual meeting of one of the biggest names in e-commerce.
It was very exciting to have the chance to present this topic to the e-commerce team of an organization that is one of the top e-commerce names of all time.
Did you know that there is no truly accessible e-commerce storefront online today? (If you think you have found one, please let me know in the comments). Online retailers are effectively “closed” for audiences who require an accessible experience.
There are so many reasons for organizations to make their e-commerce storefronts…
It is common for online forms to contain accessibility issues. This post will address 5 common form issues and provide suggestions to avoid them. Also check out my accessible form demo.
Common form issues:
Common form issue #1: Not providing a required field indicator as part of a field’s label
It is important to provide a required field indicator as part of a field’s label. For example, a common way required fields are indicated is to include an asterisk as part of the label. For example,
First name*:
Most screen readers will read this label as “First name star”. Historically, asterisks have been used as required field indicators for so long that users of assistive devices have learned that “star” means “required.” …
This article is part of an ongoing series of accessibility tips for experience designers. It discusses how to design a carousel or slider that is accessible for people navigating the page with a keyboard.
What is a carousel or slider?
Some people call them carousels, some people call them sliders. A carousel or slider is a content display paradigm in which a list of related content items are presented in panels as a horizontal slideshow. The slideshow is usually navigated by “next” and “previous” arrow keys. Usually each item has a graphic, some text, and an associated link. Carousels can have one or multiple panels in the viewable area. …
About
