Dragningsrörelser

Vad det kräver

Om en funktion kan utföras genom att dra — ordna om objekt, justera ett reglage, panorera en karta, signera på en signaturplatta, skjuta ett upplåsningstoggle — måste det också finnas ett sätt att utföra samma funktion med ett enkelt pekarklick som inte är ett drag. Trycka på en knapp, klicka på en pil, skriva ett värde, välja från en meny: något av dessa uppfyller framgångskriteriet.

Regeln gäller oavsett om draget är horisontellt, vertikalt eller fritt. Undantaget är när dragning är nödvändig för funktionen — rita i en ritapp, dra den analoga spaken på en virtuell joystick.

Hur du uppfyller det

• Sorterbara listor: lägg till upp/ner-pilknappar bredvid varje objekt, eller en “Flytta till position…”-meny. Drag fungerar fortfarande för musanvändare; knapparna täcker alla andra.
• Reglage: leverera <input type="range"> (eller role="slider" med piltangentsstöd) så att värden kan ställas in med tangentbordet eller genom att skriva ett tal i ett koppat inmatningsfält.
• Kartpanorama/zoom: lägg till synliga zooma-in/zooma-ut- och panoreringsreglage, eller acceptera ett sökfält för direktnavigering.
• Karuseller: tillhandahåll Föregående/Nästa-knappar utöver svep.
• Pris-/intervallfilter med dubbla reglage: komplettera med två nummerfält.
• Drag-för-att-stänga-banderoller och modaler: lägg till en synlig Stäng-knapp.
• Signaturinsamling: erbjud ett alternativ för “skriv ditt namn”.

Vanliga fel

• Trello-liknande kanban-tavlor där det enda sättet att flytta ett kort mellan kolumner är att dra det.
• Ordningshandtag på inställningar eller spellistor utan tangentbords- eller knappaltrnativ.
• Dubbelhandtagsreglage som kräver att båda ändarna dras och saknar min/max-inmatningar.
• Bildkomparationsreglage (före/efter) utan knappar för att flytta avdelaren stegvis.
• Färgväljare där det enda sättet att justera nyans/mättnad är att dra inuti väljaren.
• “Dra för att bekräfta”- eller “dra för att låsa upp”-kontroller utan tryckalternativ.
• Anpassade datumintervallväljare som kräver dragval över kalenderceller.

Varför det spelar roll

Dragning är svårt eller omöjligt för användare med begränsad finmotorik, tremor, enanvändning av telefon, munpinne- eller huvudpekare-användare, och alla med en trackpad vars hand krampar efter ett par drag. Det är också ett problem för många switch- och röstkontrollanvändare — det finns inget uppenbart röstkommando för “dra det tredje kortet till den andra kolumnen.” Framgångskriterium 2.5.7 är nytt i WCAG 2.2 och har omformat hur produktteam designar omordnings-UI: de flesta moderna designsystem levererar nu pilknappssalternativ som standard. Förvänta dig att det här kriteriet är ett vanligt fynd i granskningar av instrumentpaneler, projektverktyg och alla gränssnitt byggda kring sorterbara listor.