Accordion
Bloc combinant une intro et une liste empilée de headers qui affiche ou masque des contenus associés.
Description
Le module accordéon rend possible l'affichage d'une grande quantité d'informations dans un espace compact grâce à des ouvertures progressive. Le titre de l'en-tête donne un aperçu du contenu permettant de survoler rapidement les titres et de lire la section pertinente.
Usage
Quand l'utiliser ?
Lorsque les utilisateurs n'ont besoin que de quelques éléments clés d'un contenu. En masquant la majeure partie du contenu, les utilisateurs peuvent accorder leur temps efficacement aux sujets pertinents. (ex : FAQs, conditions, détails techniques, etc…)
L'accordéon permet également :
- d'organiser un ensemble d'information
- de réduire la longueur d'une page et son scroll quand le contenu n'est pas crucial à lire dans son ensemble.
Quand ne pas l'utiliser ?
Si le contenu est important et qu'il nécessite d'être lu par l'utilisateur, il vaut mieux éviter de la cacher dans un accordéon. Dans ce cas, on utilisera un des modules de Text+...
Exemples
Utilisé pour afficher les FAQs liés à une page produit
Utilisé pour intégrer les conditions des offres dans une page sans perdre trop de place
Des questions ou un feedback ?
N’hésitez pas à contacter la team Design System par mail.