A glossary of web accessibility terms

The accessible name of an element is the label by which it can be referred. For example, it provides users of assistive technology with a label for the element.

Web browsers transform markup into an internal structure known as the DOM tree. This tree contains objects that represent all the elements, attributes, and text nodes present in the markup. To make the content accessible to assistive technologies like screen readers, browsers generate an accessibility tree based on the DOM tree. This second tree is based on the DOM tree and is specifically designed to be understood by assistive technologies.

The accessibility tree helps assistive technologies work smoothly with the webpage, making it easier for people with disabilities to access and interact with the content.

ARIA (Accessible Rich Internet Applications) is a specification by W3C. Its purpose is to enhance HTML by incorporating semantics and additional metadata, making web content more accessible.

An umbrella term for technologies that support people (with disabilities). The term is broad and hard to scope. Examples include glasses, wheelchairs, walkers, crutches, prosthetic limbs, screen readers, braille displays, magnification software, custom keyboards and many more.

Not everybody uses a mouse, so you shouldn’t test with just a mouse. The most universal device to test with is a keyboard. A lot of people either use a keyboard, or use something that interacts with your creation like a keyboard.

Something is programmatically determinable when it is communicated in code. For example, a state is not just communicated visually with an icon or color, but also as an HTML5- or ARIA-attribute.

Software that reads the screen (hence the name) and communicates it to the user (usually in speech but can be braille as well). It also enables the user to use a device without seeing its screen. Screen readers depend on non-visual information.

A link placed before a block of content that enables users to skip the content.

The link is often visually hidden (until focussed), the first item on a page and used to skip (repeated) navigation. It can also be used to skip other blocks of content with lots of tab stops like carousels.

Further reading

• https://www.w3.org/TR/UNDERSTANDING-WCAG20/navigation-mechanisms-skip.html

When using the tab-key on the keyboard to navigate, every spot you reach (usually every interactive element) is a tab stop.

Something is visually hidden when it is not shown on screen, but is still available in the accessibility tree (and for screen readers). This is usually achieved with a CSS-class.

Further reading

• https://www.a11yproject.com/posts/how-to-hide-content/

The Web Content Accessibility Guidelines (WCAG) are an international standard for digital accessibility. It is an established standard that is referenced in many laws, and is often implied when talking about accessibility.

Further reading

• https://www.w3.org/WAI/standards-guidelines/wcag/
• https://en.wikipedia.org/wiki/Web_Content_Accessibility_Guidelines