Accessibility audit for 2024 theme

[adamwoodnz]

• Run scans
• Test with keyboard
• Test with Voiceover
• Test with JAWS/NVDA
• Log issues in comments below
• Fix issues

[adamwoodnz]

The search field is within the main landmark on a lot of templates. This should only be the case on the search results page where it is the main functionality. Otherwise it should be above.

[adamwoodnz]

See if this is still an issue with the new theme WordPress/wporg-mu-plugins#644

[adamwoodnz]

Average a11y scores from automated lighthouse scans are good:

Top line is the existing site. Lessons archive doesn't show any issues when manually scanned.

[adamwoodnz]

Fallback featured image has no alt text

[adamwoodnz]

My Courses card progress bar needs accessible name

[adamwoodnz]

'See all' links don't provide context to screen readers. Should be read as 'See all intermediate learning pathways for WordPress users'

[adamwoodnz]

The search field is within the main landmark on a lot of templates. This should only be the case on the search results page where it is the main functionality. Otherwise it should be above.

This is only an issue on the archive pages, where the order of elements is:

1. h1
2. intro paragraph
3. search and filters
4. content (list of courses displayed as cards)

Currently all of this is within the main landmark. On a regular 'single' type document page typically the h1, intro paragraph and content would be in main, with a search field above. However in this case searching and filtering the archive is the core functionality of the page, so it makes sense for them to be located within main with the cards.

[joedolson]

In the course cards, all links are duplicated.

While this doesn't cause any immediate problems, it does mean that the travel path is significantly longer for keyboard and screen reader users, and creates a lot of redundancy in navigating course archives. It would be better if these two elements were combined into a single link & the alt text was empty on the image.