Skip to main content
WCAGrules
Quick navigation

abstract role

role="range"

Groups the roles that carry a value inside a known span, such as sliders and progress bars.

Never put this one in your markup. It is an abstract role, and ARIA says authors must not use abstract roles in content. Nothing dramatic happens if you do. A browser ignores a role it cannot map and falls back on the element's own meaning, so a div carrying this still reads as a plain div and a button carrying it still reads as a button. You get nothing, which is the problem, because you wrote it expecting something.

What role="range" collects

range collects the roles that carry a value inside a known span, which is where aria-valuemin, aria-valuemax, aria-valuenow and aria-valuetext come from. meter, progressbar, scrollbar, slider and spinbutton inherit from it.

Abstract roles belong in the specification, not your markup

These twelve roles exist so the specification can group related roles together and describe what they have in common. Every role you can actually use inherits from one of them, and that inheritance is where a role gets its global attributes and much of its shape.

So they are real, and they matter, and not one of them is for you to write. Three sit directly under roletype, which are structure, widget and window, and the other eight hang below those. Reading up a role's ancestry is often the quickest way to see why two roles that look unrelated behave alike.

The mistake always has the same shape. A name from the taxonomy reads like it describes the thing you are building, so somebody writes it. ARIA in HTML uses role="select" as its worked example of exactly that.

Where role="range" sits in the model

Inherits from
structureroletype
More specific roles below it
meter, progressbar, scrollbar, slider, spinbutton
States and properties it supports
aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext

The normative definition stays with the W3C, so it cannot go stale here. range in the ARIA specification.

How a checker tests role="range"

One rule catches this directly. A checker tests that the role attribute names a role that is not abstract, so an abstract role in your markup is the exact thing it reports. It reports it as an invalid value, which is worth knowing, because the finding will not say the word abstract. These are the published test rules that apply.

The other abstract roles

  • command Groups the widget roles that do something when you activate them.
  • composite Groups the widget roles that contain and manage other widgets, such as tablists and listboxes.
  • input Groups the widget roles that collect a value from someone.
  • landmark Groups the roles that divide a page into navigable regions.
  • roletype The base role every other role inherits from, and the source of the global attributes.
  • section Groups the structural roles that form a distinct part of a document.
  • sectionhead Groups the roles that introduce and label whatever follows them.
  • select Groups the widget roles that offer a set of choices.
  • structure Groups every role that describes content rather than controls.
  • widget Groups the roles that represent interactive controls.
  • window Groups the roles for content layered over the page.

All 94 ARIA roles · ARIA explained · How accessible names are computed · Scan your own pages

Go somewhere useful

Find tools, resources and your workspace.

29 destinations