Accessibility rules, explained

The 70 automated checks Rampsight runs on every page, each mapped to the WCAG 2.2 success criterion it belongs to. Every one of them is a failure a browser can prove, with a fix you can apply today.

ARIA

ARIA attributes must be allowed on their role — aria-allowed-attr
Braille labels need a plain-text equivalent — aria-braille-equivalent
ARIA buttons, links and menu items need a name — aria-command-name
Some ARIA attributes contradict the native element — aria-conditional-attr
Deprecated ARIA roles no longer work — aria-deprecated-role
The page body must not be hidden from assistive technology — aria-hidden-body
ARIA input fields need a name — aria-input-field-name
Meters need a name — aria-meter-name
Progress bars need a name — aria-progressbar-name
Some elements cannot carry an ARIA name — aria-prohibited-attr
Some roles require their own attributes — aria-required-attr
Some roles require specific children — aria-required-children
Some roles require a specific parent — aria-required-parent
aria-roledescription needs a role to describe — aria-roledescription
ARIA roles must exist and be spelled correctly — aria-roles
Tabs need a name — aria-tab-name
Switches, radios and checkboxes need a name — aria-toggle-field-name
Tooltips need content — aria-tooltip-name
ARIA attribute names must be valid — aria-valid-attr
ARIA attribute values must be valid — aria-valid-attr-value

Colour and contrast

Text needs enough contrast against its background — color-contrast
Links in text need more than colour — link-in-text-block

Forms

autocomplete must use the standard tokens — autocomplete-valid
One field, one label — form-field-multiple-labels
Form fields need a label — label
Select elements need a name — select-name

Keyboard

Give people a way past the navigation — bypass
Do not remove an iframe from the tab order when it has content — frame-focusable-content
Do not nest interactive controls — nested-interactive
Scrollable areas must be keyboard-reachable — scrollable-region-focusable

Page language

The page needs a language — html-has-lang
The language code must be valid — html-lang-valid
lang and xml:lang must agree — html-xml-lang-mismatch
Inline language codes must be valid — valid-lang

Names and roles

Hidden elements must not stay keyboard-reachable — aria-hidden-focus
Buttons need a name — button-name
Input buttons need a value — input-button-name
Links need a name — link-name
Disclosure summaries need text — summary-name

Markup

Ids used by ARIA must be unique — duplicate-id-aria
Remove <marquee> — marquee

Semantics

The accessible name must contain the visible text — label-content-name-mismatch
Styled paragraphs are not headings — p-as-heading

Visual cues

Do not block zoom — meta-viewport
Touch targets need to be big enough — target-size

Structure

Text spacing must not be locked with !important — avoid-inline-spacing
Do not lock the page to one orientation — css-orientation-lock
Definition lists need the right children — definition-list
<dt> and <dd> must sit inside a definition list — dlitem
Lists need list items as children — list
List items must sit inside a list — listitem

Tables

Use a real caption — table-fake-caption
Data cells need headers — td-has-header
headers must point at cells in the same table — td-headers-attr
Headers need data cells to describe — th-has-data-cells

Text alternatives

Image map areas need alternative text — area-alt
Every page needs a title — document-title
iframes need a title — frame-title
Frame titles must be distinct — frame-title-unique
Images need alternative text — image-alt
Image buttons need alternative text — input-image-alt
<object> needs a text alternative — object-alt
Elements with role="img" need a name — role-img-alt
Replace server-side image maps — server-side-image-map
SVG images need a name — svg-img-alt
Video needs captions — video-caption

Audio and video

Audio needs captions or a transcript — audio-caption
Remove <blink> — blink
Do not refresh or redirect the page on a timer — meta-refresh
Do not autoplay sound — no-autoplay-audio

Automated checks find failures a browser can prove. They cannot judge whether a caption is accurate, whether an alt text is useful, or whether a page can be operated end to end with a keyboard — those need a person.