CODEWITHSUNDEEP
htmlaccessibility
Jacques
Jacques

Reputation: 961

A11y error: Links do not have a discernible name

I have an error :

Links do not have a discernible name Link text (and alternate text for images, when used as links) that is discernible, unique, and focusable improves the navigation experience for screen reader users. Learn more.

I tried to include an aria-label but it doesn't work. This makes an error:

<a href="https://...../demo/index.php/Products/Description/Apple-Cinema-27/products_id-1" c="Apple Cinema 27">
  <img src="images/products/130_61ajN-dgGxL._SL1000_.jpg"
       alt="Apple Cinema 27"
       title="Apple Cinema 27"
       width="130"
       height="130"
       class="media-object img-fluid">
</a>

Thanks

Upvotes: 1

Views: 10574

Answers (2)

Erektryczny Luk
Erektryczny Luk

Reputation: 101

Try use aria-label="...." - this is alternative text for image.

<a
   href="https://...../demo/index.php/Products/Description/Apple-Cinema-27/products_id-1"
   data-c="Apple Cinema 27"
   aria-label="yourdescription">

Upvotes: 10

Dan Jackson
Dan Jackson

Reputation: 64

Perhaps the alt attribute just needs a slight modification. The alt attribute should identify the destination or purpose of the link. Here is a very simplified example:

    <a href="contact.html">
        <img src="contact.png" alt="Return to the contact page">
    </a>

You may not therefore need an aria-label attribute.

Upvotes: 3

Related Questions