shoutem / shoutem.github.io

Supercharging React Native development
https://shoutem.github.io
520 stars 93 forks source link

Accessibility: Adding alt text to site images #233

Open mirabtellegen opened 10 months ago

mirabtellegen commented 10 months ago

Summary

On the Shoutem documentation site, many images are not tagged with alt-text or aria labels. This poses an accessibility issue, as these images are not accessible without being able to visually understand the context and importance of the image.

Background

Per the ADA, sites should be accessible to all users. Those who use screen readers or other accessibility tools may rely on alt text describing images or graphics. This alt-text requirement is codified in the WCAG 2.0 from 2008, in Section 1.1.1 which states that any image or graphic other than those which are purely decorative or formatting should have alternative text which describes all information a user might glean from it visually.

Example of Good Alt Text

Good alt text would be concisely and completely describing the contents of an image. For example,

<img alt="Two phones showing views of Getting Started app"
 src="https://shoutem.github.io/img/my-first-extension/extension-preview.jpg">

Your Proposal for Changes

The diff in this PR shows changes to the img attributes in the docs adding descriptive alt text.