On various pages, IFDB has lists of games where each game has a cover art thumbnail that links to the page for that game, and nearby, the game's title linking to the same place. This kind of thing can cause redundancy for screen readers:
Otherwise what happens is when you’re browsing you hear “Cover of foo, graphic link” and then “foo” when you move to the next item which is the plain text link. Ideally you only want to hear one of those, the other is extraneous.
(Discussed here)
Right now, it looks like the alt text is set to "" for the thumbnails, but apparently this can still be an inconvenience when the image is the only thing in a link. According to Webaim.org:
When an image is the only content inside a link or button, alt text is all that a screen reader has to go on. If it’s empty or missing, screen readers might read the image filename or the URL of the linked page in hopes that this may be helpful to the user, but this is not always the case.
An IFDB user suggested dealing with duplicate links by either combining the two links into one, or using aria-hidden=“true” and tabindex=“-1” on the <a> element on the image link. Here is a similar recommendation from accessibleweb.com.
Since combining the links isn't always practical, for example, when the links are in different cells of a table, I suggest using aria-hidden="true" and tabindex=“-1" in cases where combining the links doesn't make sense.
(For the suggestion about combining adjacent links, see #1374 )
On various pages, IFDB has lists of games where each game has a cover art thumbnail that links to the page for that game, and nearby, the game's title linking to the same place. This kind of thing can cause redundancy for screen readers:
(Discussed here)
Right now, it looks like the alt text is set to "" for the thumbnails, but apparently this can still be an inconvenience when the image is the only thing in a link. According to Webaim.org:
An IFDB user suggested dealing with duplicate links by either combining the two links into one, or using aria-hidden=“true” and tabindex=“-1” on the
<a>element on the image link. Here is a similar recommendation from accessibleweb.com.Since combining the links isn't always practical, for example, when the links are in different cells of a table, I suggest using aria-hidden="true" and tabindex=“-1" in cases where combining the links doesn't make sense.
(For the suggestion about combining adjacent links, see #1374 )