Every change Shuttlebase makes to your website is built to be accessible. When an experiment adds something new to your page, such as a button, a banner, a form field, or a pop-up, it works with screen readers and can be used with a keyboard alone. Shoppers who rely on assistive technology get the same experience as everyone else.
- Images have text descriptions, and decorative icons are hidden from screen readers.
- Buttons, links, and form fields have clear labels that screen readers announce.
- Everything can be used with a keyboard, in a logical order, without getting stuck.
- Pop-ups move focus inside when they open and close with the Escape key.
- Tooltips appear on keyboard focus as well as on hover.
- Messages like “added to cart” are announced to screen readers.
The Web Content Accessibility Guidelines (WCAG), published by the W3C, are the international standard for web accessibility. Level AA is the level most accessibility laws and policies require, and it is the standard most often referenced for websites under the Americans with Disabilities Act (ADA). It is made up of 55 success criteria.
Shuttlebase follows all 55 criteria for the elements its experiments add. The full list is below for teams that need it. The full text of each criterion is in the WCAG 2.2 specification.
| Success criterion | Level | What it means |
|---|
| 1.1.1 Non-text Content | A | Non-text content has text alternatives, and decorative content is hidden from assistive technology. |
| 1.2.1 Audio-only and Video-only (Prerecorded) | A | Prerecorded audio-only and video-only content has an equivalent text or audio alternative. |
| 1.2.2 Captions (Prerecorded) | A | Prerecorded video with sound has synchronized captions. |
| 1.2.3 Audio Description or Media Alternative (Prerecorded) | A | Prerecorded video has an audio description or a full text alternative. |
| 1.2.4 Captions (Live) | AA | Live video with sound has real-time captions. |
| 1.2.5 Audio Description (Prerecorded) | AA | Prerecorded video has an audio description of its important visual information. |
| 1.3.1 Info and Relationships | A | Structure shown visually, such as headings, lists, and form labels, is also defined in code. |
| 1.3.2 Meaningful Sequence | A | When order affects meaning, the reading order is reflected in the code. |
| 1.3.3 Sensory Characteristics | A | Instructions do not rely only on shape, color, size, position, or sound. |
| 1.3.4 Orientation | AA | Content works in both portrait and landscape orientation. |
| 1.3.5 Identify Input Purpose | AA | Fields that collect personal information declare their purpose so browsers can autofill them. |
| 1.4.1 Use of Color | A | Color is never the only way information is shown. |
| 1.4.2 Audio Control | A | Audio that plays automatically for over three seconds can be paused, stopped, or muted. |
| 1.4.3 Contrast (Minimum) | AA | Text contrast is at least 4.5 to 1, or 3 to 1 for large text. |
| 1.4.4 Resize Text | AA | Text can be enlarged up to 200 percent without losing content or functionality. |
| 1.4.5 Images of Text | AA | Real text is used instead of pictures of text, except for logos. |
| 1.4.10 Reflow | AA | Content fits a screen 320 pixels wide without scrolling in two directions. |
| 1.4.11 Non-text Contrast | AA | Controls and meaningful graphics have at least 3 to 1 contrast. |
| 1.4.12 Text Spacing | AA | Nothing is lost when users increase line, letter, and word spacing. |
| 1.4.13 Content on Hover or Focus | AA | Content that appears on hover or focus can be dismissed, hovered over, and stays visible. |
| Success criterion | Level | What it means |
|---|
| 2.1.1 Keyboard | A | Everything can be operated with a keyboard alone. |
| 2.1.2 No Keyboard Trap | A | Keyboard focus is never trapped. |
| 2.1.4 Character Key Shortcuts | A | Single-key shortcuts can be turned off, remapped, or only work on focus. |
| 2.2.1 Timing Adjustable | A | Users can turn off, adjust, or extend any time limit. |
| 2.2.2 Pause, Stop, Hide | A | Moving or auto-updating content can be paused, stopped, or hidden. |
| 2.3.1 Three Flashes or Below Threshold | A | Nothing flashes more than three times in one second. |
| 2.4.1 Bypass Blocks | A | Users can skip content repeated across pages, such as the main navigation. |
| 2.4.2 Page Titled | A | Each page has a title that describes its topic. |
| 2.4.3 Focus Order | A | Keyboard focus moves in an order that makes sense. |
| 2.4.4 Link Purpose (In Context) | A | The purpose of each link is clear from its text or context. |
| 2.4.5 Multiple Ways | AA | There is more than one way to find a page, such as search or menus. |
| 2.4.6 Headings and Labels | AA | Headings and labels clearly describe what they introduce. |
| 2.4.7 Focus Visible | AA | A visible indicator shows which element has keyboard focus. |
| 2.4.11 Focus Not Obscured (Minimum) | AA | A focused element is never completely hidden, for example by a sticky banner. |
| 2.5.1 Pointer Gestures | A | Multi-finger or path-based gestures have a simple tap alternative. |
| 2.5.2 Pointer Cancellation | A | Actions trigger on release, or can be aborted or undone. |
| 2.5.3 Label in Name | A | A control’s accessible name includes its visible label. |
| 2.5.4 Motion Actuation | A | Actions triggered by device motion also have an on-screen control. |
| 2.5.7 Dragging Movements | AA | Anything done by dragging can also be done without dragging. |
| 2.5.8 Target Size (Minimum) | AA | Click targets are at least 24 by 24 pixels or have enough space around them. |
| Success criterion | Level | What it means |
|---|
| 3.1.1 Language of Page | A | The page’s main language is declared in its code. |
| 3.1.2 Language of Parts | AA | Passages in another language are marked with their language. |
| 3.2.1 On Focus | A | Moving focus to an element never triggers an unexpected change. |
| 3.2.2 On Input | A | Changing a setting never causes an unexpected change unless users are told first. |
| 3.2.3 Consistent Navigation | AA | Repeated navigation appears in the same order on every page. |
| 3.2.4 Consistent Identification | AA | Components that do the same thing are labeled the same way. |
| 3.2.6 Consistent Help | A | Help options, such as contact details or chat, appear in a consistent place. |
| 3.3.1 Error Identification | A | Input errors are identified and described in text. |
| 3.3.2 Labels or Instructions | A | Labels or instructions are provided wherever users enter information. |
| 3.3.3 Error Suggestion | AA | When a fix for an input error is known, it is suggested. |
| 3.3.4 Error Prevention (Legal, Financial, Data) | AA | Important submissions can be reversed, checked, or reviewed before finalizing. |
| 3.3.7 Redundant Entry | A | Information already entered is filled in or selectable, not retyped. |
| 3.3.8 Accessible Authentication (Minimum) | AA | Logging in does not require memorizing or solving puzzles without an alternative. |
| Success criterion | Level | What it means |
|---|
| 4.1.2 Name, Role, Value | A | Every control exposes its name, role, and current state to assistive technology. |
| 4.1.3 Status Messages | AA | Status messages are announced to screen readers without moving focus. |
