Drag-and-drop interfaces
Drag-and-drop interfaces let people sort, plan and upload content directly. Every function also works with a keyboard and buttons.
Use cases
Page and form editors with components
Kanban boards and planning views
Sorting lists, products or menus
Assigning people, resources or tasks
Uploading several files with a progress indicator
Accessibility
Done badly, drag and drop shuts out anyone who does not use a mouse. WCAG 2.2 therefore requires a simple click or tap alternative to any dragging movement. Every function we build also works by keyboard and with buttons. Screen readers announce the position and the result.
Technology
Pointer events make mouse, touch and pen work equally well. In large lists, the browser builds only the visible entries. Changes are saved immediately and can be undone.
Approach
We test prototypes early with real users, because drag and drop has to work without explanation. Where people hesitate, we adjust drop zones and previews. Via APIs, the interface can also be added to existing systems.