Whole page
Carousel to test with the keyboard
WCAG 2.2 success criterion 2.2.2 Pause, Stop, Hide (Level A)
- WCAG 2.2
- 2.2.2 Pause, Stop, Hide
- Also maps to
- 2.1.1 Keyboard
- Level
- A
- Default severity
- Needs review
- Available in
- Free
Updated for Lumtera 1.2.2 and Lumtera Pro 1.1.1.
Why does it matter?
Sliders are one of the most common accessibility problems on WordPress sites. Slides that move on their own pull attention away and take text away before slow readers finish it, and hidden slides left in the tab order send keyboard focus somewhere invisible.
Who it affects: Keyboard, screen reader and low-vision users — every visitor meets the page title, language, landmarks, keyboard focus, target sizes and zoom settings on every page.
What does Lumtera flag?
Found by the widget tests (review mode's Keyboard tab, "Test menus and pop-ups"): each Swiper, Slick, Splide, Glide or Owl Carousel slider, or element with aria-roledescription="carousel", is listed for review, up to five per page, as a reminder to try it with the keyboard. It does not watch whether the slider moves.
Check ID page-carousel, as shown in review mode and saved results.
How do I fix it in WordPress?
Try the slider with the keyboard: the previous, next and pause buttons should be real buttons with names, slides out of view should be skipped by Tab, and slides that move on their own should stop with a pause button. Most slider plugins have autoplay and pause settings; if autoplay has no pause control, turn it off.
Example
<div class="swiper"> … </div> <!-- autoplay on, no pause button -->
<div class="swiper" aria-roledescription="carousel" aria-label="Featured products">
<button type="button" class="slider-pause">Pause slides</button> …
</div>
How do I check the fix?
- Reload the page in review mode and run the Keyboard tab again (or Test menus and pop-ups for menus, dialogs and tabs). The finding disappears once the page passes.
- Load the page and press Tab: a "Skip to content" link should appear first, and you should always see where focus is, even under a sticky header. Pinch-zoom on a phone, and check the browser tab shows a meaningful title.
Check your pages with Lumtera
This check is free. Open any post, choose Accessibility in the admin bar, then the Keyboard tab: Lumtera numbers every Tab stop and checks the page with the keyboard, theme, menus and footer included, one page at a time. Lumtera Pro's Page checks screen (Lumtera → Checks → Page checks) runs the same tests at desktop and phone width and adds "Carousel moves on its own", which at desktop width watches up to three sliders per page for six seconds and presses their pause button; scheduled checks do not run either.
Related checks
-
WCAG 2.5.7 · AANeeds review
Dragging may be the only way to use this
-
WCAG 2.2.2 · ANeeds review
Moving video cannot be paused
-
WCAG 2.2.2 · AError
Scrolling or blinking text
-
WCAG 2.2.2 · ATip
Check that the slider can be paused
-
WCAG 2.2.2 · ANeeds review
Animated image may need a way to pause
-
WCAG 2.4.2 · AError
Page title is missing or generic
Start with the free plugin today
All 69 content checks and 33 whole-page checks, fixes you approve with undo, and the site report — free, with no account and no page limits.