- Notifications
You must be signed in to change notification settings - Fork 452
Description
Bug Report
Problematic behavior
When I come across a 404 page, the title is correct but the image doesn't have the proper alt text.
The home icon is not hidden from screen readers
Expected behavior/code
<img alt="Image 403" loading="lazy" width="450" height="450" decoding="async" data-nimg="1" class="c__image-system-filter" src="/_next/static/media/icon-403.4dcbbb48.png" style="color: transparent; max-width: 100%; height: auto;">
Steps to Reproduce
- Choose a URL that doesn't exist
- And then the bug happens!
Possible Solution
- Add a level 1 heading to the page
<h1>Page introuvable - Erreur 404</h1> - Remove the alt text from the image, the
altattribute must be empty so it's not rendered. - Hide the home icon in the button that links back to the home page by adding
aria-hidden="true"
The final code for the button should look like this:
<button class="c__button c__button--primary c__button--medium sc-ceb1b308-0 klVXNI c__button--with-icon--left"><span class="c__button__icon"><span class="sc-34780e96-0 sc-262648e5-0 kvkFNG kcsZv --docs--icon-bg material-icons" aria-hidden="true">house</span></span>Accueil</button>
Metadata
Metadata
Assignees
Labels
Type
Projects
Status
