A11Y Area51

ARIA Attributes

ARIA-labels can guide the way,

But use them right, don’t go astray.

Be clear, concise, don’t overwrite,

Real context keeps the flow just right.

Status

July 17, 2025: This is a new feature. Set-up for testing: in progress.

Recommendations

Yes, further down the page.

Test elements

Separator (horizontal ruler)

Set to aria-hidden. Works correctly.

Buttons

Testing in progress.

WP Core button

Greyd Buttons

Read more

Navigation

Test if menu name is being overwritten by aria-label

Announce checkmark meaning

included in single

Content box

Content of the content box

Recommendations

I would not make all labels available to everyone. Below I categorized them:

For Content Creators and Editors

AttributePurpose
aria-labelAdds an invisible label for screen readers
aria-labelledbyUses visible text elsewhere as a label
aria-describedbyAdds extra info or context for screen readers
aria-hiddenHides decorative elements from screen readers

For developers

AttributePurpose
aria-disabledMarks something as visually present but functionally disabled
aria-readonlyMarks content as uneditable but still visible
aria-requiredMarks form fields as required
aria-expandedIndicates whether a widget (like a menu or accordion) is open or closed
aria-checkedIndicates checked state of checkboxes or radio buttons
aria-selectedIndicates which item in a group is selected
aria-pressedIndicates toggle button state (pressed/unpressed)
aria-valueminMinimum value for a slider/spinner
aria-valuemaxMaximum value for a slider/spinner
aria-valuenowCurrent value for a slider/spinner
aria-valuetextHuman-readable version of a value (e.g., “Low”, “High”)
aria-controlsIdentifies the element controlled by this one (e.g., a button opens a menu)
aria-activedescendantHelps manage focus within a composite widget (like a listbox)
aria-ownsReorders relationships in the accessibility tree
aria-flowtoSuggests a reading/navigation order beyond DOM order
aria-posinsetIndicates the position of an item in a set (e.g., 2 of 5)
aria-setsizeTotal number of items in a set
aria-haspopupIndicates the presence of a popup (menu, dialog, etc.)
aria-busyMarks content as loading/updating
aria-liveAnnounces content updates in real time (e.g. chat messages, status)
aria-atomicEnsures whole region is announced, not just the changed part
aria-relevantDefines what types of changes should be announced in a live region
aria-multiselectableIndicates if multiple items in a listbox/table can be selected
aria-multilineIndicates a text field accepts multiple lines