e-Commerce accessible single-page checkout

Published July 20, 2022

The average abandoned cart rate hovers around 70 percent. This means only a little over a quarter of customers will purchase the items they add to their carts. Brands that can decrease their abandonment rates by even a few percentage points can potentially see thousands of dollars more in sales each year. 

One way to decrease the abandonment rate is with a single-page checkout form. Instead of asking customers to click on different pages for shipping, billing, and order review, the platform can load all of this information on one page. This process is easier for most customers and more accessible for shoppers with disabilities. 

Here are a few reasons why considering a single-page cart for eCommerce checkouts is crucial to the bottom line and how it can make shopping websites more accessible.

Minimize bounce rates

The longer customers spend in a cart environment, the more likely they are to leave without buying something. Even a few extra seconds can give customers time to reconsider whether they want the products or whether they should keep shopping around. 

Look at the speed at which customers can buy a product on Amazon. The app and website are developed to add items and quickly allow one-click buy options. Based on browser settings, customers' information can be stored for future orders, shipping information is filled in automatically, and purchases can be completed in a few clicks.

When multiple pages are required to navigate a shopping cart, it slows down the checkout process. Each time the page loads to move from one part of the checkout process to the next, customers have more time to reconsider their purchase decisions.  

These additional pages could have even more significant implications for customers with disabilities. They have to spend more time navigating the website, which can be a cumbersome process for some, especially if waiting for accessibility features to load. 

Tag structure hierarchy

Assistive tools rely on heading tags, or H-tags, to create a hierarchy for the page. They organize site content based on the tags H1, H2, H3, etc. Heading 1 tag provides information on the main topics of the page, heading 2 tags provide subheads, and heading 3 tags appear underneath the subheads. Different screen readers and assistive switch buttons can scan a page to read the material. 

On an e-commerce site, assistive tools process these tags and use them to present information to shoppers. Without these tags, the message could come out jumbled, out of order, or could be challenging to understand. 

A single-page checkout will sort information based on the heading hierarchy and product category labels. Each link or button should also have built-in alternative titles that explain their purpose. 

A single-page cart limits the amount of overdesigning. Developers should focus on making the required fields easy to see and navigate to turn shoppers into customers. Digital accessibility techniques are becoming more commonplace, and following these guides will keep a website compliant. 

Simple forms

It’s understandable to want to learn as much about customers as possible. However, do not let this lead to the creation of lengthy forms that are challenging to fill out and frustrating for shoppers who just want to finish the purchase process. 

All form fields (like shipping and payment information) need proper labels and error messaging. Think about which ones will be required for anything beyond shipping and payment. Organizing form fields is crucial for visually impaired customers who use screen readers. 

W3C Web Accessibility Initiative (WAI) explains that screen readers speak one cell at a time. If a form is made using nested tables and each table has cells that contain a header and footer, a screenreader runs a high risk of reading content out of order. If the content is not read in order, the shopper could become frustrated while trying to checkout, leading them to abandon their cart altogether.

Consider sending out an optional survey after customers complete their orders as an alternative way to collect customer data. 

Tip: Add customer service information on every page

Another way to make a cart more accessible is to include customer service information on each page. A customer service contact method could be an online chatbox, a clickable phone number, or an email address. If customers have trouble buying products, using the website, or getting their questions answered, they should be able to ask for help quickly. 

Providing multiple ways to access customer service is a step toward increased website accessibility. Not everyone will be able to call your customer service phone line for help. Not every customer will want to go through a chatbox. Giving customers options will allow them to go with what they are most comfortable choosing.

Improve your cart at Accessibility Plus 2022

If you want to improve your eCommerce website to make it more usable for customers with disabilities, consider attending Accessibility Pluss 2022. 

Register for Add to Cart: Creating an Accessible E-Commerce Experience, amongst other beneficial sessions. Learn more about our upcoming events and mark your calendars to make your website accessible to the next level.

 

Accessibility Services for Small to Medium-Sized Businesses - Free Online Event!

Join us on Wednesday, May 1st, at 1 PM ET for a free online event to explore how to evaluate and select accessibility services for your small to medium-sized business. Click here to learn more about this event and to register.

Click here to see our Events Calendar.

Accessibility.com's 2024 events will utilize the Zoom Events platform, offering a virtual expo hall for attendees to meet with prospective vendors. If your company is interested in being part of the expo hall, don't hesitate to get in touch with Amanda@Accessibility.com.

Vendor Directory

Accessibility.com offers the premier impartial listing of digital accessibility vendors.  Search for products and services by category, subcategory, or company name.  Check out our new Vendor Directory here.

Comments