Drag-and-drop-Oberflächen
Drag-and-drop-Oberflächen machen Sortieren, Planen und Hochladen direkt greifbar. Jede Funktion bleibt auch per Tastatur und mit Schaltflächen bedienbar.
Anwendungsbeispiele
Seiten- und Formular-Editoren mit Bausteinen
Kanban-Boards und Planungsansichten
Sortierung von Listen, Produkten oder Menüs
Zuordnung von Personen, Ressourcen oder Aufgaben
Uploads mehrerer Dateien mit Fortschrittsanzeige
Barrierefreiheit
Schlecht umgesetzt schließt Drag-and-drop Menschen aus, die keine Maus verwenden. WCAG 2.2 verlangt deshalb eine Alternative mit einfachen Klicks oder Tippen. Jede Funktion setzen wir auch per Tastatur und mit Schaltflächen um. Screenreader erhalten Ansagen zu Position und Ergebnis.
Technik
Pointer Events sorgen dafür, dass Maus, Touch und Stift gleichermaßen funktionieren. Bei großen Listen baut der Browser nur die sichtbaren Einträge auf. Änderungen werden sofort gespeichert und lassen sich rückgängig machen.
Vorgehen
Prototypen testen wir früh mit echten Nutzern, denn Drag-and-drop muss ohne Erklärung funktionieren. Wo Nutzer zögern, passen wir Ablagezonen und Vorschauen an. Über APIs lässt sich die Oberfläche auch in bestehende Systeme einfügen.