Un "accordion" est un ensemble d'en-tĂȘtes interactifs empilĂ©s verticalement qui contiennent chacun un titre, un extrait de contenu ou une vignette reprĂ©sentant une section de contenu. Les en-tĂȘtes fonctionnent comme des contrĂŽles qui permettent aux utilisateurs de rĂ©vĂ©ler ou de masquer leurs sections de contenu associĂ©es. Les accordĂ©ons sont couramment utilisĂ©s pour rĂ©duire le besoin de faire dĂ©filer lors de la prĂ©sentation de plusieurs sections de contenu sur une seule page.
Le titre de chaque en-tĂȘte accordĂ©on est contenu dans un Ă©lĂ©ment avec un bouton de rĂŽle.
Chaque bouton d'en-tĂȘte en "accordion" est enveloppĂ© dans un Ă©lĂ©ment avec un en-tĂȘte de rĂŽle dont la valeur dĂ©finie pour aria-level est appropriĂ©e pour l'architecture d'informations de la page.
Si le panneau d'accordĂ©on associĂ© Ă un en-tĂȘte d'accordĂ©on est visible, l'Ă©lĂ©ment de bouton d'en-tĂȘte a aria-expanded dĂ©fini sur true. Si le panneau n'est pas visible, aria-expanded est dĂ©fini sur false.