Is an HTML aria-label attribute allowed to be an empty string?
Asked Answered
P

3

8

Will an empty string be ignored by screen readers or should i avoid adding them to the element if the string is empty?

For reference, this is a usecase in react where you want to default to an empty string to avoid having to check for undefined:

<input
  id={id}
  value={value}
  {...(ariaLabel ? { 'aria-label': ariaLabel } : {})}
/>
Pretension answered 23/9, 2019 at 8:13 Comment(0)
G
4

I can't see anything in the spec about what should happen if aria-label is set to an empty string. I think that you'd just be labelling it with nothing and thus it'd be fine, but I can imagine a screen reader assuming that's a mistake and falling back to something else.

I think you're using aria-label wrong if it can be empty some times. aria-label is just a stand-in for the <label> element. It's supposed to name the input element. There shouldn't be a situation where the name changes or can be blank.

Generality answered 23/9, 2019 at 8:27 Comment(2)
if you're creating a reusable input component, then the label is set dynamically from the input components properties. If the button has a label of its own, then we don't need to add an aria-label attribute.Pretension
aria-label can be used with of lot of HTML markup. Using aria-label on an input element is just one case.Shick
F
4

The documentation from w3 makes no mention of an empty attribute value for aria-label. So it's probably implementation defined of the different screenreader software.

Reference: https://www.w3.org/TR/wai-aria/#aria-label

Frontality answered 23/9, 2019 at 8:28 Comment(0)
I
1

Empty aria-label should absolutely be avoided as it can cause screen readers to do unpredictable things. While it is not something that is explicitly forbidden by WCAG, it could be be considered a violation of WCAG Guideline 4.1:

"Maximize compatibility with current and future user agents, including assistive technologies."

Empty aria-label serves no purpose, introduces cruft in the code, and is a sign of lazy programming.

Ingres answered 28/6, 2022 at 23:37 Comment(1)
Please add details and references for your statements e.g. "it can cause screen readers to do unpredictable things". Also while I don't see how this would violate 4.1 (it's a guideline, not a SC, and it doesn't look like this would violate any of the 4.1.x SCs), I agree that avoiding if you don't need it would be better (cf. the first rule of ARIA)Dumbstruck

© 2022 - 2024 — McMap. All rights reserved.