Skip to content

📚 Documentation: images in cards should have empty alt attributes [a11y][TheA11y100] #284

Closed
@GrahamTheDevRel

Description

@GrahamTheDevRel

Issue

In the "show me some code" section, the cards are links. Within them are images with alt attributes, however these alt attributes are not descriptive and, more importantly, add duplication of information making the link text longer than needed.

Card on Docs homepage has alt text highlighted

Why it matters

People using assistive technology will end up with extra, repeated or irrelevant information as part of the link text.

Suggested fix

Remove the text within the alt attribute. do not remove the attribute.

An empty alt attribute hides the image from assistive technology so it does not add unnecessary noise within the link. Removing the alt attribute would result in the images URL being read out which would make the problem worse!

Also, it is suggested that you add role="presentation" to the image. This does not doing anything, but it does make it easier for people in the future to realise that the image alt attribute has deliberately been left empty and is a good practice. @Haimantika could you confirm that Appwrite are OK with this policy please.

Relevant Success Criterion WCAG

Link Purpose (In Context)

Additional Notes

Please wait for confirmation from Appwrite on whether to add role="presentation" to images that are decorative (deliberately empty alt attributes mentioned earlier.)

Found on stream on 2023-10-25

👀 Have you spent some time to check if this issue has been raised before?

  • I checked and didn't find similar issue

🏢 Have you read the Code of Conduct?

Metadata

Metadata

Assignees

Labels

documentationImprovements or additions to documentationgood first issueGood for newcomers

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions