Question 31020 in Wordpress Question posted in
The official Wordpress documentation can be found here.

Empty button error in wave accessibility check – WordPress

Hello Im new web developer. i get empty button error from wave.webaim.org – WCAG 2.0 Level AA Accessibility.
Thats the code.

<button type="button" role="presentation" class="owl-prev disabled h-hidden" title="none">

any help on that?
Thanks in advance.

Tags:

2

Answers


  1. 0

    "An Empty Button error means that one of the buttons present on the web page is empty or contains no text describing the function of the button. Or, if it’s an image button, the image contained in the button is missing alternative text."
    Source: https://equalizedigital.com/accessibility-checker/empty-button/

    It could be that there’s no text on the button. If you don’t want to put a visible text on the button, you could put a visually hidden text that is read by screen readers, sometimes called the sr-only class in css.
    More info: How to hide a text and make it accessible by screen reader?

    Login or Signup to reply.
  2. 0

    You need to have actual text inside the button. If you don’t want to have a visible text because you style the button in a certain way, using PisteVW solution from above works just fine.

    Alternatively, you can use the attribute aria-label="button text here" to give the button a label.

    Also, you need to remove role=presentation as the button performs a clear action, it’s not there to simply indicate presentational images, for example: https://www.w3.org/TR/wai-aria-1.1/#presentation

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search