[Accessibilité] Attributs ARIA : utiliser les rôles sur les blocs principaux des pages

[seinhorn]

ETQ visiteur du blog en situation de handicap
Je souhaite pouvoir accéder à un contenu optimisé pour les outils d'assistance

Contexte

Actuellement le blog est partiellement accessible.

Besoin

Il faudrait permettre aux visiteurs du blog en situation de handicap d'accéder aux contenus et aux fonctionnalités sans difficulté.

Solution

Sur toutes les pages du site : ajouter des rôles ARIA sur les blocs principaux

1. Header

<header class="..." role="banner">

2. Navigation principale

<div class="header__menu" role="navigation">

3. Recherche

// ajouter une <div> pour englober la zone de recherche :

<div role="search">

// OU ajouter role="search" sur un container existant

4. Main

<main class="..." role="main">

/!\ Pour la Homepage : la balise <main> est manquante. Il faut donc ajouter la balise <main class="..." role="main"> pour englober le contenu principal de cette page.

5. Footer

<footer class="..." role="contentinfo">

Documentation :
https://docs.google.com/spreadsheets/d/10vwRgRJj07PcW3w1iCc21QxfF6Gshn0s9-P8EGU8BKs/edit?gid=418219487#gid=418219487