Example of accidentally pressing a button
Image description: 3 buttons that say “Like, Comment, Subscribe" with a pointing hand clicking on the “Like” button. A green speech bubble above says, "Oops! I meant to just scroll passed."

This page is in progress -

If you would like to contribute or make a case to prioritize this page, please fill out the form below.

Why This is Important

Preventing accidents while interacting with things is accessible to a diversity of disabilities and situations.

Blind and visually impaired people use screen readers to interact with websites and apps. A screen reader is a type of assistive tech that converts things on screen to audio and/or braille. It's important that things are understandable and interactive to screen readers.

Keyboard accessibility is essential for people who do not use a computer mouse (which might be because they have unpredictable or very specific movement due to a motor disability). Many Blind and visually impaired people also use keyboard interactions in order to use their screen reader.

Error support is accessible to people with a diversity of disabilities. A cognitive disability might affect how a person perceives and understands things. A physical disability might lead to unpredictable movement. Other factors such as environment, stress, and multi-tasking may also lead to errors.

In order to be accessible, gestures and interactions must account for people with physical and motor disabilities, who might have unpredictable or very specific movement.

Pointer input refers to actions such as clicking with a mouse or pressing your finger on a touch device. It's important to prevent and help people recover from errors.

This references to WCAG criterion 2.5.2 Pointer Cancellation (Level A).

Level AAA compliance is considered more difficult to meet because it requires more resources to fulfill. It also might encompass conflicting access needs (meaning what is accessible to some might be inaccessible to others). Use your best judgment of your target audience and your team's capabilities to determine if this is a pragmatic goal to reach.

How to Implement This

WCAG recommends that at least one of the following is true in order to be compliant:

  • No Down-Event - The down-event of the pointer is not used to execute any part of the function;
  • Abort or Undo - Completion of the function is on the up-event, and a mechanism is available to abort the function before completion or to undo the function after completion;
  • Up Reversal - The up-event reverses any outcome of the preceding down-event;
  • Essential - Completing the function on the down-event is essential.

No Down-Event

The down-event refers to the action of pressing down on a button (or other component). The up-event refers to lifting up from a button. WCAG recommends that it is more accessible to activate the button on the up event (for example, hitting the "Send" button will send the email on the up-event only).

illustration of down and up event
Image description: Illustration of a down-event, which shows a finger pressing down on a red button, and an up-event, which shows a finger lifting up from the button. The up-event is labeled, "Executes the function."

Abort or Undo

The option to abort or undo should be made available on the up event. This refers to when the mouse or finger presses something accidentally. People should be able to move their mouse or finger away from the target area and lift up, in which case nothing happens. This can be especially helpful for scrolling on touch devices, which requires touching the screen.

Image description: Illustration of a finger pressing a button on a down-event, then moving to the side and lifting on the up-event in a different area.

Up Reversal

Up reversal refers to when the down-event triggers an event that the up-event can reverse. For example, if you press-and-hold a button to go off mute and speak into a microphone, the up-event reverses that action and mutes you again. This is also applicable to drag-and-drop, for example if you drag an object somewhere and drop it in an ambiguous area, the up-event returns the object to its original location.

Illustration of unmute on down-event and mute on up-event
Image description: Illustration of a finger pressing a button on the down-event, which unmutes a microphone and allows them to speak, and then mutes on the up-event when the finger lifts up


While WCAG recommends the above 3 techniques as the more accessible interaction, they make an exception if executing the function on the down event is essential. This may be relevant to musical instrument applications, such as the drums or piano, where you expect the music to play on the down-event instead of the up-event.

What to Do

The standard recommendation is:

  • Use the up-event instead of the down-event to execute the function
  • If the down-event does execute a function, provide a way to reverse or undo that function

Implementing these techniques can be handled through javascript using pointer events such as mouseDown and mouseUp. See Eloquent Javascript - Handling Events.

Further Documentation

How to Test This

Manual Test
Semi-Automated Test
Automated Test
  • Interact with the buttons on the website/app.
  • Make note of the pointer input behavior. Make sure that the up-event executes the function, or that there is a way to reverse or undo the function.


No credits yet. But this could be you!
No items found.

Contribute and Give Feedback

If you would like to provide feedback or contribute content on this resource, please fill out the form below.

Thank you, your submission has been received!
Oops! Something went wrong while submitting the form. Please check your internet connection and try again.

If you continue to encounter issues, please reach out to alexyingchen(at)gmail.com.