Review alt text for WCAG compliance on Sitemap page

[IsaacDesigns]

Overview

We need to ensure that alt text for images adhere to Web Content Accessibility Guidelines (WCAG). For this issue, we will tackle the images under the Sitemap page.

Details

Developers identified that some alt texts in the Sitemap page should be reviewed because they are either inaccurate or too long. Ideally, alt text should be descriptive but short and succinct. According to the WCAG page, an accompanying alt text should be short. Additionally, the Functional Accessibility Evaluator (FAE) recommends for alt text to be no more than 100 characters.

Action Items

• Make a copy of the tab Template [Page Name]- [Status]
• With the copied tab replace [Page Name] with the page you are reviewing and [Status] with "Audit in Progress". Don't forget to remove brackets "[ ]"
• Add a link of the page your working on at the bottom in the Resources/Instructions section of this issue where it says "Google sheet Tab for your page".
• For each image on the page, identify if the alt text needs to be changed or not using the recourses below and fill out the google sheet. To locate the alt text use the Google Chrome browser, right click "inspect" to view pages code.
• After completing auditing each image change your google sheet tabs [Status] to Audit Complete.
• Review with Design Lead or another member of the team
• Mark spreadsheet tab as QA (e.g., About Page - Audit QA)
• Add note at bottom of issue saying its ready for QA and use the close with comment, so that it goes to the QA column

Product

• Review the work and sign off on it if ready
  • Mark spreadsheet tab as Complete (e.g., About Page - QA Complete)
  • Add Ready for dev leads label
  • Move to New Issue Approval Column

Development

• Create issues for that particular alt text should be created (preferably labelled good first issue) for new developers to fix
• Close this issue

Resources/Instructions

Sitemap page
WCAG section on alt text
FAE rule 4: alt text should be less than 100 characters
Google sheet instructions
Google sheet template
Google sheet Tab for your page

[github-actions]

Hi @IsaacDesigns.

Good job adding the required labels for this issue. The merge team will review the issue and add a "Ready for Milestone" label once it is ready for prioritization.

Additional Resources:

• Wiki: How to create issues
• Wiki: How to read and interpret labels

[gold-o]

The changes indicated in the spreadsheet are ready to be made into issues, and an additional issue must be created that an alt text version of the sitemap will need to be created to accommodate accessibility requirements.

[phuonguvan]

@gold-o Bonnie said that she discussed the alt text for the site map at Sunday's meeting. Was there a note about this?

[gold-o]

@phuonguvan Yes, she mentioned that a solution for the site map alt text could be to have a text document laying out the content in the sitemap (using the same hierarchy). And then have a link below the site map that goes to the document. However, she mentioned that this will need to be a different issue. It is related to the comment I made above.

[7kram]

QAed and ready for dev lead to make issues out of this.

[ExperimentsInHonesty]

• Created a new issue Creating issues to update alt texts on SiteMap page  #3859