Dragging Movements

In brief

Dragging asks you to press, hold, move and release, all at once and with precision. It is hard for people with tremors, for people who use a trackball, a head pointer or eye-gaze, and for anyone who cannot hold a button down while moving.

This criterion, new in WCAG 2.2, requires that all functionality that uses a dragging movement for operation can be achieved by a single pointer without dragging, unless dragging is essential or the functionality is determined by the user agent and not modified by the author.

What does it cover?

• What is dragging: The pointer engages an element on the down-event, the element follows the pointer, and the movement ends on the up-event. It includes drag and drop, sliders, resizing and map panning.
• The alternative: A single click or tap does the same job: tap the slider track or type in a field, select an item and then a button, choose a destination from a menu, press arrow buttons to pan.
• Dragging vs path-based: In a drag, only the start and end matter. If the exact path matters, it is a path-based gesture, covered by 2.5.1.
• Exceptions: Dragging that is essential, and dragging handled entirely by the user agent, such as the browser scrollbar, touch scrolling and pull-to-refresh, unless the page replaces that behaviour.
• Keyboard is separate: A keyboard alternative does not meet this criterion by itself, because pointer users still need a way to act without dragging. Keyboard operation is 2.1.1.
• Typical examples: Reordering lists, moving cards between columns, range sliders, cropping and resizing, uploading by dropping files, and moving a map.
• Out of scope: Gestures that follow a path are 2.5.1. Target size is 2.5.8.

Who does it affect?

People with tremors or limited dexterity who cannot press, move and hold at once. People who use a trackball, a head pointer, a mouth stick or eye-gaze, where dragging is slow, tiring or error-prone. People who control the pointer with voice commands or switches.

In the EAA and EN 301 549

The European Accessibility Act (Directive (EU) 2019/882) applies to in-scope products and services placed on the market after 28 June 2025. Recital 47 names four principles for websites and mobile applications: perceivable, operable, understandable and robust. Pointer operation without dragging is part of "operable".

The technical counterpart is the standard EN 301 549, which incorporates WCAG 2.5.7 by reference and turns it into separate clauses for each kind of ICT.

Because this criterion is new, check clauses 10 and 11 of V4.1.1 for the rows that apply to documents and software. Clause numbers follow the "9. + WCAG number" pattern of EN 301 549. In V3.2.1 the software clause is divided into further subclauses for open and closed functionality. Check the exact numbers in the standard when you cite them.

Standard version: Criterion 2.5.7 is new in WCAG 2.2, so it is not part of EN 301 549 V3.2.1, which is based on WCAG 2.1. It appears in EN 301 549 V4.1.1 (September 2026), the first version prepared specifically for the EAA. V4.1.1 has not yet been cited in the Official Journal of the European Union, so for now it is best treated as a voluntary technical route to the EAA's requirements. Once cited, it will give a presumption of conformity. It is a Level AA criterion.

A note on EAA scope: Article 2(4) of the Directive excludes certain content from the requirements, for example office file formats published before 28 June 2025 and archives that are not updated after that date. Content you publish or change after that date is not covered by these exclusions.

Directive (EU) 2019/882, EUR-Lex, opens in a new tab

Code examples for the web

1. A slider that can be set with a click or by typing

Native range inputs also let users click along the track. A number field beside it is the clearest alternative.

Volume

2. Reorderable list with move buttons

Add buttons that move an item up or down.

Task A
 

  Task A
  ↑
  ↓

3. Kanban cards with a move menu

Let users pick a destination column from a menu.

Fix bug

  Fix bug
  Move to
    
      To doIn progressDone
    
  

4. A map that can be panned with buttons

Provide up, down, left and right controls.

…
 

…

  ↑
  ←
  →
  ↓

5. File upload

A drop zone needs a normal button to choose files.

Drop files here

Drop files here, or
  choose files
  

6. Resizing a panel

A drag handle needs a click or tap alternative, such as buttons for preset sizes.

Make panel wider
Make panel narrower

Code examples for mobile

Native apps use reordering handles, sliders and crop frames. Add a tap-based alternative, and make it available to screen reader users as well.

iOS (SwiftUI)

import SwiftUI

struct TaskList: View {
    @State private var tasks = ["Write report", "Review code", "Plan trip"]

    var body: some View {
        List {
            ForEach(tasks.indices, id: \.self) { i in
                HStack {
                    Text(tasks[i])
                    Spacer()
                    // Tap alternatives to drag-to-reorder
                    Button { move(i, by: -1) } label: { Image(systemName: "arrow.up") }
                        .accessibilityLabel("Move \(tasks[i]) up")
                    Button { move(i, by: 1) } label: { Image(systemName: "arrow.down") }
                        .accessibilityLabel("Move \(tasks[i]) down")
                }
            }
            .onMove { tasks.move(fromOffsets: $0, toOffset: $1) } // drag remains
        }
    }

    private func move(_ i: Int, by d: Int) {
        let j = i + d
        guard tasks.indices.contains(j) else { return }
        tasks.swapAt(i, j)
    }
}

Android (Jetpack Compose)

import androidx.compose.foundation.layout.Row
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.ArrowDownward
import androidx.compose.material.icons.filled.ArrowUpward
import androidx.compose.material3.*
import androidx.compose.runtime.Composable

@Composable
fun TaskRow(title: String, onUp: () -> Unit, onDown: () -> Unit) {
    Row {
        Text(title)
        // Tap alternatives to drag-to-reorder
        IconButton(onClick = onUp) {
            Icon(Icons.Filled.ArrowUpward, contentDescription = "Move $title up")
        }
        IconButton(onClick = onDown) {
            Icon(Icons.Filled.ArrowDownward, contentDescription = "Move $title down")
        }
    }
}

How to test

• List the drags: Find every place that uses dragging: sliders, sortable lists, kanban boards, file drop zones, resize handles, maps and crop tools.
• Do it without dragging: Use only single clicks or taps. Can you complete each task?
• Check sliders: Can you set the value by clicking the track, or by typing in a field?
• Check reordering: Is there a button, menu or other tap-based way to move an item?
• Check uploads: Is there a normal "choose file" control next to the drop zone?
• Check the exceptions: Is any remaining drag essential, or controlled entirely by the browser?
• Check mobile: Can reordering, sliders and crop frames be operated with simple taps, and by TalkBack and VoiceOver?
• Use a checker as a starting point: Automated tools cannot detect drag interactions. A person must test the interface with single clicks only.

Common mistakes

• Drag-only sortable lists: The most frequent failure (F108).
• Sliders that need a drag: No click on the track and no input field.
• Drop zones with no file button: Users cannot add files without dragging.
• Drag-only map panning: Provide pan buttons.
• Treating the keyboard as enough: Pointer users still need a tap-based way.
• Drag handles with no alternative: Resizing, splitting and cropping.
• Forgetting calendar and scheduler drags: Moving an event by drag only.
• Replacing browser scrolling with custom drag: The user agent exception does not then apply.

Sources

• Understanding SC 2.5.7: Dragging Movements (W3C), opens in a new tab
• G219: Ensuring that an alternative is available for dragging movements that operate on content (W3C), opens in a new tab
• F108: Failure of Success Criterion 2.5.7 Dragging Movements due to not providing a single pointer method that does not require a dragging movement (W3C), opens in a new tab
• Directive (EU) 2019/882, European Accessibility Act (EUR-Lex), opens in a new tab
• EN 301 549 V4.1.1 (ETSI), opens in a new tab
• The European accessibility standard EN 301 549 has been updated (AccessibleEU), opens in a new tab

Standard version: EN 301 549 V4.1.1 (2026-09), WCAG 2.2. This page is for informational purposes only and is not legal advice. For binding requirements, refer to the official texts of the European Accessibility Act (Directive (EU) 2019/882) and EN 301 549.