CODEWITHSUNDEEP
htmlwai-aria
ling
ling

Reputation: 10017

Is type=button necessary with aria-label?

I read that the implicit value for a button type is submit. To make UI buttons, I also read that we need therefore to specify the type=button attribute.

For instance:

<button type="button">Click me</button>

However, I've seen this example as an accessible button:

<button aria-label="undo">&#xE000;</button>

I notice that it doesn't have the type=button attribute.

If aria-label is defined on a button, does it implicitly mean that the button is of type=button?

If not, is the above example (undo button) incorrect?

Upvotes: 0

Views: 1302

Answers (1)

slugolicious
slugolicious

Reputation: 17475

type and aria-label are unrelated.

If you don't specify a type on a <button>, then the default type is submit. If your button is contained in a <form>, then the onclick() for the button will run and the form will be submitted.

If your type is button, then the form will not be submitted. Only the onclick() for the button will run.

See the <button> spec.

The reason the second example has aria-label is because there is no visible text on the button. An icon font is used (like an image) and in order for a screen reader to know what to announce for the button, aria-label is specified.

Upvotes: 3

Related Questions