Depuis mars 2020, le Bureau de la transformation numérique (BTN) a mené plus de 45 tests d’utilisabilité et études de recherche auprès des utilisateurs afin d’offrir des directives fondées sur des données probantes qui ont contribué à la publication de ressources Web liées à la pandémie. Nous comptons également sur les projets d’optimisation précédents pour offrir une expérience en ligne plus utilisable, uniforme et fiable sur Canada.ca.

Le modèle afficher/masquer n’est qu’un des nombreux modèles de la bibliothèque du système de conception de Canada.ca qui peuvent vous aider à améliorer la façon dont les utilisateurs interagissent avec votre contenu Web. Il faut toutefois l’utiliser avec soin!

Mise à l’essai du modèle auprès des utilisateurs

En novembre 2019, le BTN a modifié les directives de Canada.ca pour permettre l’utilisation du modèle afficher/masquer afin de présenter un choix entre des réponses mutuellement exclusives. Aussi appelé « accordéon », le modèle afficher/masquer vous permet de masquer le contenu jusqu’à ce qu’il soit demandé ou pertinent. Un lien de déclenchement affiche ou masque le contenu lorsqu’un utilisateur le sélectionne.

Exemple :

Vous devez cliquer sur cette zone pour afficher ou masquer le contenu

Ce texte est masqué jusqu'à ce qu'il soit affiché.

Le modèle afficher/masquer a été testé avec succès dans le cadre de deux projets d’optimisation auprès de l’Agence du revenu du Canada (ARC). Dans les deux projets, nous avons utilisé le modèle pour simplifier la mise en page et réduire la charge cognitive. Le modèle aide les gens à trouver le contenu qui convient à leur situation et à se concentrer sur celui-ci.

Résumé de la recherche : Communiquer avec l’ARC

En raison des résultats positifs de nos projets d’optimisation, nous avons utilisé le modèle afficher/masquer sur plus de pages pour aider les Canadiens à trouver les réponses dont ils ont besoin concernant la pandémie de COVID-19.

Quand utiliser le modèle afficher/masquer

Vous pouvez utiliser le modèle afficher/masquer dans deux situations précises :

1. Présenter un choix entre des réponses mutuellement exclusives

Utilisez ce modèle lorsque les gens doivent obtenir des réponses différentes en fonction de leur situation et lorsque ces réponses sont mutuellement exclusives. La recherche a démontré que lorsque toutes les options sont visibles, les gens ont tendance à passer du temps à lire des réponses qui ne sont pas pertinentes pour leur tâche. Ils ne se rendent peut-être pas compte que le contenu se trouve sous une rubrique qui ne s’applique pas à eux. Ils s’embrouillent et pensent à tort avoir trouvé la bonne réponse.

L’utilisation de ce modèle peut aider les gens à se concentrer uniquement sur ce qui s’applique précisément à eux.

Sous la question Vos informations sur le dépôt direct et l'envoi postal sont-elles à jour avec l'ARC? les modèles d'expansion/réduction offrent 2 réponses possibles : Oui et Non. La deuxième image montre l'option Oui développée avec le message Super. Cela vous permettra de vous assurer que votre prestation vous sera versée.
Le modèle afficher/masquer (l'image est en anglais).

2. Présenter des renseignements secondaires

Vous pouvez également utiliser ce modèle pour éviter que le contenu secondaire n’interfère avec la tâche principale.

Il peut s’agir d’un contenu qui s’applique à la plupart des gens, mais que seules quelques personnes peuvent avoir besoin d’utiliser (par exemple, une déclaration de confidentialité ou des renseignements supplémentaires qui ne sont pas nécessaires pour accomplir la tâche principale).

Il peut également s’agir d’un contenu qui ne s’applique qu’à une minorité de personnes (par exemple lorsqu’il existe des renseignements spécifiques destinés à un public spécifique).

Le contenu pour faire une autre demnade de la PCU comprend le modèle afficher/masquer pour Si vous recommencez à travailler. La deuxième image montre le modèle élargi pour afficher le contenu concernant les personnes qui arrêtent de travailler et recommencent à travailler au cours d'une période de prestations ultérieure.
Le modèle afficher/masquer pour l'une des pages de la PCU (l'image est en anglais).

Le code et les instructions pour la mise en œuvre de ce modèle se trouvent dans la bibliothèque de modèles et de configurations du système de conception de Canada.ca :

Modèles et configurations de conception testés par les utilisateurs

Commencer avec des modèles et des configurations de conception testés par les utilisateurs peut aider votre équipe à aller de l’avant rapidement, ce qui vous fera économiser temps et argent.

Pour en savoir plus sur la façon d’utiliser le modèle afficher/masquer et d’autres modèles de conception, consultez le système de conception de Canada.ca.

Pour en savoir davantage