Drag and Drop Doesn’t Have To Be a Nightmare
In this post, Maxwell Ivey discusses the challenges of drag-and-drop functionality for screen reader users — and shares three examples of companies that provide accessible alternatives.
As someone who runs a website and spends plenty of time online in my daily life, I feel like I have a responsibility to help bring understanding between developers and visually impaired users.
One of the things I often talk about with sighted business owners and developers is the lack of a mouse when using a screen reader.
I can’t tell you how frustrating it is to be unable to submit a form or buy something online because I can’t check a box. Or how disappointing it is to install a new piece of software only to discover that I can’t use it because the program depends on clicking a mouse.
I also find it aggravating when something critical has to be done and I end up going to my brother or nephew to help me finish the task.
Yes, people who use screen readers and keyboards to navigate the internet can sometimes simulate a mouse click — but it isn’t reliable. And like many aspects of digital accessibility, it comes down to how a site was designed.
Three Examples of Drag and Drop Done Right
Since I don’t have reliable access to a mouse, I cringe whenever I hear that I have to use any sort of drag-and-drop movement on a website.
However, that doesn’t mean there aren’t ways to make drag-and-drop accessible:
- WordPress lets people rearrange blocks of text on a post or page by pressing “up” and “down” buttons on their site’s content editor.
- LinkedIn allows users to move featured items or top skills around the screen with the press of a button.
- Less Annoying CRM (LACRM) lets users adjust the order of fields on a form or workflow with simple keyboard commands (i.e., pressing the spacebar to pick up or drop items, and using the arrow keys to change the order of an item).
Each of these examples work because they give screen reader users (in addition to people who lack the fine motor skills to easily control a mouse) an easy alternative to the dragging motion that can be a source of so much frustration.
As you consider your own website, it’s important to be mindful of any interaction —whether it’s uploading a file or sorting a list — that requires users to drag their cursor across the screen.
If you don’t provide an accessible alternative, you run the risk of not conforming with accessibility standards like the Web Content Accessibility Guidelines (WCAG), which has guidelines addressing keyboard accessibility and drag-and-drop functionality.
Worse, you could be leaving potential customers behind.
Inclusivity Is Good Business
I have given a talk about positivity. In it, I tell people that finding the positive in their lives is like finding anything else. You decide it is there somewhere, and you keep looking until you find it.
If you own a business, I want to challenge you to seek out solutions that can help you make your websites and apps more accessible and, as a result, more inclusive.
When you take all users into account when developing a product, you make it better for everyone. And the more people that can engage with your business and benefit from your products and services, the more customers you can attract and keep.
It seems like basic business sense, but I wish more companies would come to this realization.
Have you discovered any accessible products or services more people need to hear about? Do you have any experiences to share? Let me know what you find. I look forward to helping more companies understand the value of digital accessibility.
Thanks for listening, Max
Facing My Fear of Walmart.com
Learn what surprised one screen reader user about shopping for groceries on Walmart.com
May 05, 2023
For Assistive Technology Users, Website Updates Often Mean New Hurdles
For many assistive technology users, website and app updates just mean new accessibility barriers to overcome.
April 26, 2023
6 Tips for Making Forms Accessible
Learn about the importance of form accessibility for screen reader users — and what to watch out for.
April 12, 2023