Exploring the challenges in creating an accessible sortable list (drag-and-drop)

The accessibility team at GitHub has developed a more accessible "one-dimensional drag-and-drop" system, aimed at addressing issues experienced by visually impaired users who rely on screen readers. Some problems faced included setting up an interactive model for keyboard navigation and determining whether a mouse or keyboard event was triggered during drag-and-drop. These issues were addressed by implementing the role='application' function, separating keyboard and mouse functionality, and slowing down move announcements. A dialog system was also created with instructions for keyboard operation of drag-and-drop, which could be easily found yet not prove a constant distraction. Finally, "move dialog" was created for voice controlled assistive tech users to move items without traditional drag-and-drop. The accessibility improvements were tested thoroughly with users reliant on screen readers and their feedback was used to refine and implement role='application' correctly.