diff --git a/configurations-conception-communes/outil-retroaction.md b/configurations-conception-communes/outil-retroaction.md new file mode 100644 index 00000000..bd11e37c --- /dev/null +++ b/configurations-conception-communes/outil-retroaction.md @@ -0,0 +1,316 @@ +--- +altLangPage: https://design.canada.ca/common-design-patterns/page-feedback.html +date: "2023-10-06" +dateModified: "2023-10-06" +description: "L’outil de rétroaction est une configuration facultative pour recueillir la rétroaction de l’expérience sur une page." +title: "Outil de rétroaction sur la page" +--- +

Dernière mise à jour : 2023-10-06

+

L'outil de rétroaction est une configuration facultative pour recueillir la rétroaction de l'expérience sur une page. Lorsqu'il est utilisé, il apparaît en bas de la page, juste avant la date de modification.

+
+
+
+

Sur cette page

+ +
+

Quand l'utiliser

+

Envisagez d'utiliser l'outil de rétroaction sur la page pour :

+ +
+
+

Quoi éviter

+

Évitez d'utiliser l'outil de rétroaction sur la page, dans des pages pour lesquelles vous ne prévoyez pas de surveiller les commentaires et prendre des mesures. Nous vous déconseillons également d'utiliser l'outil dans des environnements sécurisés ou sur des pages contenant des renseignements thématiques sensibles.

+

Autres comportements à éviter en analysant une rétroaction

+
+
+

Contenu et conception

+

L'outil de rétroaction sur la page invite les visiteurs à effectuer les actions suivantes :

+ +

Placez l'outil en bas de la page, juste avant la date de modification. Alignez-le à gauche de la page, avant l'élément « Partagez cette page ». Vous pouvez choisir d'utiliser l'outil de rétroaction sur la page au lieu de la configuration « Signaler un problème sur cette page ». Il n'est pas obligatoire d'ajouter l'outil de rétroaction sur la page lors du retrait de la configuration « Signaler un problème sur cette page ».

+

La configuration de rétroaction comporte trois états :

+ +

Une documentation détaillée est également disponible pour l'utilisation de cette configuration et pour l'analyse de la rétroaction.

+

Outil de rétroaction sur la page (Analyses, sondage et commentaires)

+

Spécifications de contenu

+

Lorsque vous ajoutez pour la première fois l'outil de rétroaction à votre page, utilisez l'option par défaut, sans le lien de contact.

+

Envisagez uniquement d'ajouter un lien de contact si vous avez essayé de clarifier le contenu de la page concernant la façon de contacter le programme ou service et que les utilisateurs utilisent toujours l'outil de rétroaction pour obtenir une réponse propre à leur situation.

+

Le lien peut mener vers une page HTML ou vers une adresse courriel.

+

Veillez à ce que le texte du lien soit court. Nous recommandons la formulation « Contacter [nom du service] ».

+

Interactions

+

La configuration de rétroaction comporte trois états :

+ +

Pour tous ces états, l'utilisateur reste sur la même page HTML en interagissant avec la configuration de rétroaction.

+

Sur la page, la configuration affiche la question « Avez-vous trouvé ce que vous cherchiez? » et affiche les boutons « Oui » et « Non ».

+

Si l'utilisateur choisit « Non », il lui est demandé de fournir davantage de renseignements sur son expérience.

+

Cela commence par un titre indiquant « Veuillez fournir plus de détails », suivi du texte « Vous ne recevrez aucune réponse. N'incluez pas de renseignements personnels (téléphone, courriel, NAS, renseignements financiers, médicaux ou professionnels). Maximum de 300 caractères ». Une fois que l'utilisateur a sélectionné « Soumettre », un message de remerciement s'affiche.

+

Vient ensuite un champ de texte ouvert permettant de recueillir la rétroaction.

+

Si l'option de contact est utilisée, un lien permettant de contacter le service apparaît dans une configuration de style afficher/masquer intitulée « Besoin d'aide urgente pour résoudre un problème? Communiquez avec nous » située juste avant le titre et le champ de texte ouvert.

+

L'utilisateur utilise le bouton « Soumettre » pour envoyer sa rétroaction. Une fois que l'utilisateur a sélectionné « Soumettre », un message de remerciement accompagné d'une coche verte s'affiche pour indiquer que la rétroaction a bien été envoyée.

+

Si un utilisateur sélectionne « Oui », seul un message de remerciement s'affiche.

+

Spécifications de conception

+

Lorsqu'il est utilisé, l'outil de rétroaction sur la page remplace la configuration « Signaler un problème sur la page ».

+

Encadré gris

+ +

Typographie

+ +

Boutons

+ +

Icône coche du message de remerciement

+ +

Exemples visuels

+
+
+
+
+
+

1. Première vue de l'outil de rétroaction

+
+ 1. Première vue de l'outil de rétroaction. Version texte ci-dessous : +
+ Description de l'image : Première vue de l'outil de rétroaction +

Sur la page, la section consacrée à la rétroaction se trouve en bas de la page Web, juste au-dessus de la date de modification. Un petit encadré gris demande « Avez-vous trouvé ce que vous cherchiez? » et affiche les boutons « Oui » et « Non ».

+
+
+
+
+
+

2a. Vue par défaut après avoir sélectionné « Non »

+
+ 2a. Vue par défaut après avoir sélectionné Non. Version texte ci-dessous : +
+ Description de l'image : Vue par défaut après avoir sélectionné « Non » +

Après l'interaction avec le bouton « Non », la question est remplacée par un écran comportant un champ de texte. Celui-ci affiche le titre « Veuillez fournir plus de détails », suivi des instructions de ne pas inclure de renseignements personnels : « Vous ne recevrez aucune réponse. N'incluez pas de renseignements personnels (téléphone, courriel, NAS, renseignements financiers, médicaux ou professionnels). Maximum de 300 caractères ». Un petit champ de texte est suivi d'un bouton « Soumettre ».

+
+
+
+
+

2b. Vue optionnelle après avoir sélectionné « Non » avec l'option de contact

+

La configuration de style afficher/masquer « Besoin d'aide urgente pour résoudre un problème? Communiquez avec nous » sera réduite par défaut.

+
+ 2b. Vue optionnelle après avoir sélectionné Non avec l'option de contact. Version texte ci-dessous : +
+ Description de l'image : Vue optionnelle après avoir sélectionné « Non » avec l'option de contact +

Après l'interaction avec le bouton « Non », la question est remplacée par un écran comportant un champ de texte.

+

Dans l'option de contact, une configuration de style afficher/masquer porte le titre « Besoin d'aide urgente pour résoudre un problème? Communiquez avec nous. » Lorsque la configuration afficher/masquer est ouverte, un lien personnalisable permettant de contacter le service s'affiche.

+

Après la configuration afficher/masquer vient le titre « Veuillez fournir plus de détails », suivi des instructions de ne pas inclure de renseignements personnels : « Vous ne recevrez aucune réponse. N'incluez pas de renseignements personnels (téléphone, courriel, NAS, renseignements financiers, médicaux ou professionnels). Maximum de 300 caractères ». Un petit champ de texte est suivi d'un bouton « Soumettre ».

+
+
+
+
+

3. Vue après avoir sélectionné « Oui » ou après avoir soumis la rétroaction

+
+ 3. Vue après avoir sélectionné Oui ou après avoir soumis la rétroaction. Version texte ci-dessous : +
+ Description de l'image : Vue après avoir sélectionné « Oui » ou après avoir soumis la rétroaction +

Lorsqu'un utilisateur sélectionne « Oui » comme réponse à la première question ou lorsqu'il soumet sa rétroaction, un message de remerciement apparaît. Une icône coche verte apparaît, suivie du titre « Merci de vos commentaires »

+
+
+
+
+
+
+

Comment procéder à la mise en œuvre

+

Ajoutez l'outil de rétroaction au bas d'une page de contenu, après le contenu de la page et avant la date de modification.

+
+
+

Outil de rétroaction pour les pages du Service Web géré (SWG)

+

Utilisez ces instructions pour toutes les pages hébergées dans le service Web géré par Adobe.

+
+ Instructions pour les pages SWG +

Ajout de l’outil de rétroaction

+

Comment ajouter l'outil de rétroaction à votre page dans Adobe Experience Manager (AEM). (Contenu interne, uniquement disponible sur GCPedia)

+

Recommandé Ajouter une valeur masquée d'un « Thème » dans le code de l'outil de rétroaction

+

Ceci peut vous être utile si vous souhaitez télécharger de la rétroaction pour des pages de tout un thème en même temps.

+

Dans la plupart des cas, vous devriez inclure le thème « Canada.ca » pour votre contenu (vous trouverez la liste complète ci-dessous).

+

Il s'agit d'une valeur unilingue. Entrez la valeur du thème en anglais, tant pour vos pages en anglais que celles en français.

+
Thèmes Canada.ca
+
    +
  • AboutGov (À propos du gouvernement)
  • +
  • Benefits (Prestations)
  • +
  • Business (Entreprises)
  • +
  • CanadaTheWorld (Canada et le monde)
  • +
  • Culture (Culture)
  • +
  • Defense (Défense)
  • +
  • Environment (Environnement)
  • +
  • Health (Santé)
  • +
  • Immigration (Immigration)
  • +
  • Indigenous (Autochtones)
  • +
  • Jobs (Emplois)
  • +
  • Money (Argent)
  • +
  • Policing (Politique)
  • +
  • PublicService (Service public)
  • +
  • Science (Science)
  • +
  • Taxes (Impôts)
  • +
  • Transport (Transport)
  • +
  • Travel (Voyage)
  • +
  • Veterans (Vétérans)
  • +
+

Si vous souhaitez ajouter un nouveau thème qui n'apparaît pas dans la visionneuse de rétroaction, contactez le Bureau de la transformation numérique. Nous l'ajouterons pour vous à la visionneuse de rétroaction.

+

Adresse courriel : dto.btn@tbs-sct.gc.ca

+

Optionnel Ajouter une valeur masquée « Section » dans le code de l'outil de rétroaction

+

Ceci peut vous être utile si vous souhaitez télécharger de la rétroaction pour plusieurs pages en même temps.

+

Envisagez d'inclure cette valeur lorsque vous ajoutez l'outil de rétroaction à plusieurs pages relatives à un même sujet, comme « passeports » ou « assurance-emploi ».

+

Il s'agit d'une valeur unilingue. Entrez la valeur de section en anglais, tant pour vos pages en anglais que celles en français.

+

Si vous souhaitez ajouter une nouvelle valeur « Section » qui n'apparaît pas dans la visionneuse de rétroaction, contactez le Bureau de la transformation numérique. Nous l'ajouterons pour vous à la visionneuse de rétroaction.

+

Adresse courriel : dto.btn@tbs-sct.gc.ca

+

Optionnel Lien de contact

+

Envisagez uniquement d'ajouter un lien de contact si vous avez essayé de clarifier le contenu de la page concernant la façon de contacter le programme ou service et que les utilisateurs utilisent toujours l'outil de rétroaction pour obtenir une réponse propre à leur situation.

+
+
+
+
+
+

Code de l'outil de rétroaction pour les pages en dehors du Service Web géré (SWG)

+

Utilisez ces instructions pour toutes les pages qui ne sont pas hébergées dans le service Web géré par Adobe.

+
+ Instructions pour les pages qui ne sont pas dans SWG +

Ajout de l'outil de rétroaction

+

Insérez le code de l'outil de rétroaction à l'endroit où se trouve la configuration « Signaler un problème sur cette page » dans le code HTML de votre page.

+ +

Ajout des valeurs masquées obligatoires

+

Mise à jour des données pour les acronymes institutionnels (valeur unilingue).

+
Acronymes des institutions Canada.ca
+
    +
  • AAFC (Agriculture et Agroalimentaire Canada)
  • +
  • ATSSC (Service canadien d’appui aux tribunaux administratifs)
  • +
  • CATSA (Administration canadienne de la sûreté du transport aérien)
  • +
  • CFIA (Agence canadienne d'inspection des aliments)
  • +
  • CIRNAC (Relations Couronne-Autochtones et Affaires du Nord Canada)
  • +
  • NSERC (Conseil de recherches en sciences naturelles et en génie du Canada)
  • +
  • CBSA (Agence des services frontaliers du Canada)
  • +
  • CCG (Garde côtière canadienne)
  • +
  • CGC (Commission canadienne des grains)
  • +
  • CIHR (Instituts de recherche en santé du Canada)
  • +
  • CIPO (Office de la propriété intellectuelle du Canada)
  • +
  • CRA (Agence du revenu du Canada)
  • +
  • CRTC (Conseil de la radiodiffusion et des télécommunications canadiennes)
  • +
  • CSA (Agence spatiale canadienne)
  • +
  • CSEC (Centre de la sécurité des télécommunications)
  • +
  • CSPS (École de la fonction publique du Canada)
  • +
  • DFO (Pêches et Océans Canada)
  • +
  • DND
  • +
  • ECCC
  • +
  • ESDC
  • +
  • FCAC
  • +
  • FIN
  • +
  • GAC
  • +
  • HC
  • +
  • INFC
  • +
  • IRCC
  • +
  • ISC
  • +
  • ISED
  • +
  • JUS
  • +
  • LAC
  • +
  • NFB
  • +
  • NRC
  • +
  • NRCan
  • +
  • OSB
  • +
  • PBC
  • +
  • PC
  • +
  • PCH
  • +
  • PCO
  • +
  • PHAC
  • +
  • PS
  • +
  • PSC
  • +
  • SSC
  • +
  • PSPC
  • +
  • RCMP
  • +
  • StatCan
  • +
  • TBS
  • +
  • TC
  • +
  • VAC
  • +
  • WAGE
  • +
  • WD
  • +
+

Recommandé Ajouter une valeur masquée d'un « Thème » dans le code de l'outil de rétroaction

+

Ceci peut vous être utile si vous souhaitez télécharger de la rétroaction pour des pages de tout un thème en même temps.

+

Dans la plupart des cas, vous devriez inclure le thème « Canada.ca » pour votre contenu (vous trouverez la liste complète ci-dessous).

+

Il s'agit d'une valeur unilingue. Entrez la valeur du thème en anglais, tant pour vos pages en anglais que celles en français.

+
Thèmes Canada.ca
+
    +
  • AboutGov (À propos du gouvernement)
  • +
  • Benefits (Prestations)
  • +
  • Business (Entreprises)
  • +
  • CanadaTheWorld (Canada et le monde)
  • +
  • Culture (Culture)
  • +
  • Defense (Défense)
  • +
  • Environment (Environnement)
  • +
  • Health (Santé)
  • +
  • Immigration (Immigration)
  • +
  • Indigenous (Autochtones)
  • +
  • Jobs (Emplois)
  • +
  • Money (Argent)
  • +
  • Policing (Politique)
  • +
  • PublicService (Service public)
  • +
  • Science (Science)
  • +
  • Taxes (Impôts)
  • +
  • Transport (Transport)
  • +
  • Travel (Voyage)
  • +
  • Veterans (Vétérans)
  • +
+

Si vous souhaitez ajouter un nouveau thème qui n'apparaît pas dans la visionneuse de rétroaction, contactez le Bureau de la transformation numérique. Nous l'ajouterons pour vous à la visionneuse de rétroaction.

+

Adresse courriel : dto.btn@tbs-sct.gc.ca

+

Optional Ajouter une valeur masquée « Section » dans le code de l'outil de rétroaction

+

Ceci peut vous être utile si vous souhaitez télécharger de la rétroaction pour plusieurs pages en même temps.

+

Envisagez d'inclure cette valeur lorsque vous ajoutez l'outil de rétroaction à plusieurs pages relatives à un même sujet, comme « passeports » ou « assurance-emploi ».

+

Il s'agit d'une valeur unilingue. Entrez la valeur de section en anglais, tant pour vos pages en anglais que celles en français.

+

Si vous souhaitez ajouter une nouvelle valeur « Section » qui n'apparaît pas dans la visionneuse de rétroaction, contactez le Bureau de la transformation numérique. Nous l'ajouterons pour vous à la visionneuse de rétroaction.

+

Adresse courriel : dto.btn@tbs-sct.gc.ca

+

Optionnel Lien de contact

+

Envisagez uniquement d'ajouter un lien de contact si vous avez essayé de clarifier le contenu de la page concernant la façon de contacter le programme ou service et que les utilisateurs utilisent toujours l'outil de rétroaction pour obtenir une réponse propre à leur situation.

+
+
+
+
+

Accéder à une rétroaction et l'analyser

+

Il est possible d'afficher une rétroaction et de la télécharger en format CSV ou Excel, à tout moment, au moyen du site Web de la visionneuse de rétroactions.

+

La visionneuse de rétroactions est un environnement protégé par un mot de passe disponible pour tous ceux et toutes celles qui participent à la rétroaction sur la page. Communiquez avec le BTN afin d'accéder au site.

+

Adresse courriel : dto.btn@tbs-sct.gc.ca

+

Document d'orientation complet sur l'utilisation de l'outil de rétroaction sur la page et l'analyse connexe

+
+
+
+

Recherche et justification

+

Constatations découlant de la recherche

+

Billet de blogue : Recueillir la rétroaction, trouver les problèmes

+

Justification stratégique

+

La Ligne directrice sur les services et le numérique exige que la rétroaction des clients fasse partie intégrante de la conception des services et des produits. Celle-ci peut prendre plusieurs formes, y compris au moyen de l'outil de rétroaction sur la page.

+
diff --git a/images/description-fr.jpg b/images/description-fr.jpg new file mode 100644 index 00000000..893957ff Binary files /dev/null and b/images/description-fr.jpg differ diff --git a/images/page-feedback-fr.png b/images/page-feedback-fr.png new file mode 100644 index 00000000..0c9aba42 Binary files /dev/null and b/images/page-feedback-fr.png differ diff --git a/images/thank-you-fr.jpg b/images/thank-you-fr.jpg new file mode 100644 index 00000000..2240d7ce Binary files /dev/null and b/images/thank-you-fr.jpg differ diff --git a/images/urgent-help-fr.png b/images/urgent-help-fr.png new file mode 100644 index 00000000..48699d43 Binary files /dev/null and b/images/urgent-help-fr.png differ diff --git a/retroaction/fonctionnement.md b/retroaction/fonctionnement.md index 43ab8198..bdb988fc 100644 --- a/retroaction/fonctionnement.md +++ b/retroaction/fonctionnement.md @@ -52,18 +52,55 @@ L’outil de rétroaction invite les visiteurs à : -
- Image des options après avoir cliqué sur « Non » -
- Une longue description peut être trouvée après l'image. -
-
- Outil de rétroaction -

Il y a le texte « Vous ne recevrez aucune réponse. N'incluez pas de renseignements personnels (téléphone, courriel, NAS, renseignements financiers, médicaux ou professionnels). Maximum 300 caractères », suivi d’un champ de texte pour fournir plus de détails.

-
-
-
-
+
+
+
+
+
+

1. Première vue de l'outil de rétroaction

+
+ 1. Première vue de l'outil de rétroaction. Version texte ci-dessous : +
+ Description de l'image : Première vue de l'outil de rétroaction +

Sur la page, la section consacrée à la rétroaction se trouve en bas de la page Web, juste au-dessus de la date de modification. Un petit encadré gris demande « Avez-vous trouvé ce que vous cherchiez? » et affiche les boutons « Oui » et « Non ».

+
+
+
+
+
+

2a. Vue par défaut après avoir sélectionné « Non »

+
+ 2a. Vue par défaut après avoir sélectionné Non. Version texte ci-dessous : +
+ Description de l'image : Vue par défaut après avoir sélectionné « Non » +

Après l'interaction avec le bouton « Non », la question est remplacée par un écran comportant un champ de texte. Celui-ci affiche le titre « Veuillez fournir plus de détails », suivi des instructions de ne pas inclure de renseignements personnels : « Vous ne recevrez aucune réponse. N'incluez pas de renseignements personnels (téléphone, courriel, NAS, renseignements financiers, médicaux ou professionnels). Maximum de 300 caractères ». Un petit champ de texte est suivi d'un bouton « Soumettre ».

+
+
+
+
+

2b. Vue optionnelle après avoir sélectionné « Non » avec l'option de contact

+

La configuration de style afficher/masquer « Besoin d'aide urgente pour résoudre un problème? Communiquez avec nous » sera réduite par défaut.

+
+ 2b. Vue optionnelle après avoir sélectionné Non avec l'option de contact. Version texte ci-dessous : +
+ Description de l'image : Vue optionnelle après avoir sélectionné « Non » avec l'option de contact +

Après l'interaction avec le bouton « Non », la question est remplacée par un écran comportant un champ de texte.

+

Dans l'option de contact, une configuration de style afficher/masquer porte le titre « Besoin d'aide urgente pour résoudre un problème? Communiquez avec nous. » Lorsque la configuration afficher/masquer est ouverte, un lien personnalisable permettant de contacter le service s'affiche.

+

Après la configuration afficher/masquer vient le titre « Veuillez fournir plus de détails », suivi des instructions de ne pas inclure de renseignements personnels : « Vous ne recevrez aucune réponse. N'incluez pas de renseignements personnels (téléphone, courriel, NAS, renseignements financiers, médicaux ou professionnels). Maximum de 300 caractères ». Un petit champ de texte est suivi d'un bouton « Soumettre ».

+
+
+
+
+

3. Vue après avoir sélectionné « Oui » ou après avoir soumis la rétroaction

+
+ 3. Vue après avoir sélectionné Oui ou après avoir soumis la rétroaction. Version texte ci-dessous : +
+ Description de l'image : Vue après avoir sélectionné « Oui » ou après avoir soumis la rétroaction +

Lorsqu'un utilisateur sélectionne « Oui » comme réponse à la première question ou lorsqu'il soumet sa rétroaction, un message de remerciement apparaît. Une icône coche verte apparaît, suivie du titre « Merci de vos commentaires »

+
+
+
+
## Protéger les renseignements personnels diff --git a/retroaction/index.md b/retroaction/index.md index 48c4a5e9..d0ce2d54 100644 --- a/retroaction/index.md +++ b/retroaction/index.md @@ -46,7 +46,7 @@ L’outil de rétroaction sur la page est un outil de recherche
-

Mise en œuvre

+

Mise en œuvre

Obtenez le code pour mettre en œuvre l’outil de rétroaction sur votre site

diff --git a/retroaction/quand.md b/retroaction/quand.md index ba352742..c16c7017 100644 --- a/retroaction/quand.md +++ b/retroaction/quand.md @@ -18,11 +18,20 @@ title: Quand utiliser l’outil de rétroaction sur la page ## Sur cette page +* [Quand utiliser l’outil de rétroaction sur la page](#quand-utiliser-loutil-de-rétroaction-sur-la-page) * [Cas d’utilisation de l’outil de rétroaction sur la page](#cas-dutilisation-de-loutil-de-rétroaction-sur-la-page) * [Attentes et engagement](#attentes-et-engagement) * [Comment ne pas utiliser l’outil de rétroaction](#comment-ne-pas-utiliser-loutil-de-rétroaction) -## Cas d'utilisation de loutil de rétroaction sur la page + +## Quand utiliser l’outil de rétroaction sur la page + +Nous recommandons d’utiliser l’outil de rétroaction lorsqu’il y a un engagement à lire la rétroaction et à prendre des mesures en fonction de celle-ci : + +* par rapport à des pages spécifiques; +* pendant une période définie + +## Cas d'utilisation de l'outil de rétroaction sur la page Envisagez d’utiliser l’outil de rétroaction sur la page pour : @@ -32,10 +41,7 @@ Envisagez d’utiliser l’outil de rétroaction sur la page pour : * déterminer les problèmes émergents * assurer le suivi des améliorations de la page après leur mise en ligne -Nous recommandons d’utiliser l’outil de rétroaction lorsqu’il y a un engagement à lire la rétroaction et à prendre des mesures en fonction de celle-ci : -* par rapport à des pages spécifiques; -* pendant une période définie ## Attentes et engagement @@ -71,10 +77,14 @@ La surveillance des tendances d’une semaine à l’autre est une activité int Nous ne recommandons pas de garder l’outil de rétroaction sur une page continuellement. Cette approche vient réitérer que l’outil est destiné à la recherche (plutôt qu’à la surveillance) et pour assurer la meilleure utilisation de votre temps. + ### Espaces sécurisés Nous ne recommandons pas l'utilisation de l'outil dans les espaces sécurisés. Dans ces espaces, il est préférable de s'assurer que les utilisateurs ont un accès clair aux canaux d'assistance directe. +### Sujets sensibles +Les pages sur des sujets sensibles doivent être évitées (par exemple, le suicide). +