Dans cet article, nous allons parcourir les différentes phases qui vont vous permettre de prendre en main votre widget afin que vous puissiez le paramétrer au plus proche de vos besoins.

Pour cela, nous allons voir comment :

Définir la structure du widget
Personnaliser graphiquement le widget

1. Définir la structure du widget

La meilleure façon de présenter vos cookies et autres traceurs est de les organiser en catégories claires et signifiantes pour les internautes qui consulteront vos pages. De trop nombreux sites affichent une liste de technologies et de services sans aucun rapport entre eux, et sans l'espèce d'une explication. Et souvent, la seule différence réside dans le fait qu'ils sont nécessaires ou non.

Avec Axeptio c'est différent. De par sa conception, notre widget de recueil de consentement pour les cookies vous invite à découper la présentation des traceurs en différentes étapes. Celles-ci sont présentées de manière séquentielle à l'internaute s'il choisit de paramétrer son choix (bouton "Je choisis").

L'enchaînement de ces étapes est l'occasion de raconter l'histoire de vos cookies et d'expliquer à quoi et à qui ils servent.

Pour développer et vous présenter cette philosophie, nous allons aborder dans la suite de cet article les points suivants :

Anatomie d'une configuration Cookie
Les différents types d'étapes
Personnalisation des illustrations des widgets

Anatomie d'une configuration Cookie

Au sein d'un même projet vous pouvez créer plusieurs configurations pour vos cookies. Maintenir de multiples configurations vous permet de gérer le multilingue ou d'avoir des configurations distinctes entre plusieurs sites d'une même marque (landing page, blog, e-commerce, etc.). Dans des cas plus avancés, vous pouvez également utiliser cette fonctionnalité pour faire de l'AB testing entre variations et améliorer ainsi votre taux de consentement.

Lorsque vous rentrez dans le formulaire pour éditer une configuration Cookies, vous pouvez modifier les propriétés suivantes :

Les propriétés de gestion de version de cette configuration, sont des réglages propres à cette configuration :
1. L'intitulé est un titre interne qui vous permettra de facilement identifier cette configuration dans la liste des versions ainsi que dans notre outil de statistiques
2. L'identifiant est un nom technique qui vous permettra de spécifier impérativement à notre script de charger telle ou telle version
3. La langue du widget est un menu déroulant qui vous permet de spécifier en quelle langue le widget est configuré.
  
  ⚠️ Changer la propriété langue n'aura pas d'impact sur les textes que vous aurez définis. La langue aura en revanche un impact sur l'encart "À propos d'Axeptio"
4. L'encart À Propos d'Axeptio correspond à la partie informative qui se déplie dans le widget lorsque l'internaute clique sur notre signature "Consentements certifiés par Axeptio". Grâce au menu déroulant, vous pouvez désormais choisir entre plusieurs variantes et accorder ce bloc à votre image.
  
  ⚠️ Vous trouverez ici une case à cocher pour valider l'enregistrement des preuves de consentement chez Axeptio. Si vous ne cochez pas cette case, cela signifie que les choix de l'internaute en matière de consentement cookies ne seront pas enregistrés dans notre base de données. Vous perdez par la même occasion la capacité d'auditer les statistiques de consentements et ne pourrez pas télécharger le registre des preuves. Cette fonctionnalité n'est disponible que pour les clients payants car elle entraîne des coûts de stockage et de traitement.
La liste des étapes qui seront affichées aux internautes qui vont interagir avec le widget. Chaque étape correspondra à une grande famille de cookies que vous présentez de manière groupée. Le fonctionnement de ces étapes sera détaillée dans le paragraphe suivant, mais sachez d'ores et déjà que vous pouvez facilement éditer, réordonner ou supprimer les étapes depuis la liste.
Les textes d'interface de votre widget. Il s'agit des libellés des boutons ou encore des textes des liens. On parle de texte d'interface en opposition aux textes de contenus qui seront eux à configurer dans les formulaires propres à chaque étape. Dans la page dédiée à la modification des textes d'interface, il vous sera possible de choisir parmi des presets que nous avons rédigés pour vous et qui vous assureront à la fois conformité et pertinence. Les textes que vous modifierez à l'échelle de votre configuration seront appliqués à toutes les étapes, à l'exception de celles pour lesquelles des textes personnalisés auront été spécifiés.
Les propriétés d'intégration du widget sur votre site. C'est dans cet écran notamment que vous trouverez le code HTML à intégrer dans les pages de votre site pour que le widget Axeptio s'y charge. D'autres options avancées sont également paramétrables au sein de ce formulaire qui contient plusieurs étapes :
1. Le délai d'apparition du widget : il s'agit du temps que notre script va attendre avant de faire apparaitre le widget de consentement pour les cookies.
  
  💡 Prenez soin de ne pas négliger l'impact positif de la temporisation sur le mood de votre utilisateur : si vos statistiques de visites sont votre priorité, vous pourriez être tentés de raccourcir au maximum ce délai pour faire apparaître notre widget au chargement de la page. Nous vous garantissons que c'est un choix contre-productif et peu apprécié par les internautes qui aura pour effet principal de nourrir le taux de rebond sur votre site.
2. Hauteur du défilement : il s'agit de la distance à parcourir en scrollant par l'utilisateur avant que le widget ne s'affiche. C'est une option qui se cumule avec le délai d'apparition du widget configuré plus haut.
3. Cacher le bouton Axeptio : cette option vous permet de faire disparaitre notre pastille qui apparait dans le bas de la page une fois que l'utilisateur a fait son choix en matière de traceurs. Attention si vous choisissez de cocher cette option, il vous faudra veiller à proposer un moyen de faire réapparaitre notre widget d'une manière simple, par exemple au clic sur un lien "mes préférences en matière de cookies" que l'internaute pourra trouver en bas de votre site.
Les utilisateurs : liste des contributeurs autorisés à voir et modifier cette configuration. Comme pour la plupart des configurations que vous réaliserez dans l'interface d'administration Axeptio, il vous est possible d'ajouter plusieurs collaborateurs qui pourront ainsi voir et modifier la configuration en question.

Les différents types d'étapes

Nous avons développés trois principaux types d'écrans qui embarquent leurs propres règles de gestion et qui regroupent les différentes étapes de paramétrage. Nous vous proposons de les passer en revue :

L'écran de bienvenue (1/3)
L'écran de catégorie (2/3)
La sélection des cookies
L'écran d'information (3/3)
Récapitulatif des fonctionnalités des 3 principaux types d'écran

✅ Pour accéder au paramétrage des différents écrans principaux depuis votre backoffice :

Cliquez sur le projet pour lequel vous souhaitez faire le paramétrage
Cliquez sur Gestion des Cookies
Cliquez sur la configuration que vous souhaitez paramétrer
Cliquez sur Nouveau si l'une des étapes n'est pas encore affichée

L'écran de bienvenue (1/3)

Ce type d'écran est systématiquement affiché en premier dans l'enchaînement des étapes. Il ne contient pas de liste des tiers mais permet en revanche d'intégrer un lien vers une politique de confidentialité.

C'est dans les paramètres de cet écran que vous vous pourrez paramétrer les boutons présentés à l'utilisateur et leur comportement. En effet, en matière de consentement pour les cookies et traceurs, les exigences réglementaires divergent entre les pays. Nous maintenons à jour un tableau récapitulatif des exigences de chaque régulateur qui vous aidera à choisir quels boutons vous choisissez d'afficher sur votre site.

✅ Le paramétrage de cet écran est critique. Accordez-lui du temps et de l'énergie car c'est ici que 99% des internautes font leur choix !

Voici quelques faux-pas à éviter :

⛔️ Dépersonnaliser le message et l'apparence : c'est sans doute grâce à nos jolis cookies que vous nous avez découvert, eh bien comprenez qu'ils ne sont pas là (que) pour faire joli. La personnification du cookie en un avatar sympathique et reconnaissable est un vecteur de sympathie et place l'internaute dans de bonnes dispositions pour recevoir la requête de consentement.
⛔️ Laisser votre conseil juridique en roue libre : certes vous répondez à une obligation réglementaire en affichant ce message, mais ne perdez pas de vue que le widget de recueil de consentement est un point de contact avec l'internaute (parfois même le premier) et qu'il revêt ainsi un véritable enjeu marketing. Attention donc aux textes inutilement complexes ou trop techniques.
⛔️ Bâcler le message et / ou noyer le poisson : vous n'attirerez aucune sympathie si vous ne faîtes pas preuve de transparence et de didactique. C'est non seulement une exigence réglementaire, mais c'est aussi une vraie marque de respect pour vos utilisateurs. Et même s'ils ne consentent pas immédiatement, en jouant carte sur table vous vous ménagez une chance qu'ils consentent lors de leur prochaine visite.

Chez Axeptio, la confiance, c’est comme (presque) tout le reste, ça se partage. C’est pourquoi nous avons décidé de ne rien vous cacher. Aussi, via le back-office, il est possible de lister dès l’écran de bienvenue l’ensemble des finalités (Statistiques et audience, Expérience et utilisateurs....).

Ces finalités, fonctionnent comme un sommaire et permettent à l’utilisateur final de comprendre en un coup d’œil ce à quoi il consent (ou pas d’ailleurs...). Et toujours pour faciliter la vie et l’expérience utilisateur, ces finalités sont des liens qui vous permettent de naviguer directement vers l’étape de votre choix !

C’est super ça 😁 (oui on sait merci !) mais comment on fait pour le paramétrer ?

Pour afficher cette liste, il suffit de se rendre sur l’étape écran de bienvenue et de sélectionner “Afficher les finalités”.

Et parce que la personnalisation ce n’est pas qu’une question de couleurs, on vous laisse aussi le choix de modifier le titre (”À quoi servent ces cookies “) ainsi que les sous-titres d’étapes. Elle est pas belle la vie ? Et pour cette dernière étape, il faut juste de rendre sur “Configuration avancée” et “Textes des widgets”.

L'écran de catégorie (2/3)

C'est l'écran dans lequel vous allez présenter (fièrement) les services, cookies et autres traceurs que vous comptez soumettre au consentement de l'utilisateur. En effet, cet écran a pour but de présenter un choix granulaire, service par service.

Nous vous invitons à créer autant d'écrans de catégorie que nécessaire, afin de produire les regroupements les plus signifiants pour des personnes non-techniques. Comme dans l'écran de bienvenue pour lequel nous vous conseillons de favoriser la transparence à l'opacité, nous préconisons un découpage basé sur le rôle fonctionnel de chaque service : séparer la mesure d'audience de la publicité, dissocier les services CRM (chat, formulaires, etc.) des services de support, etc.

Lorsque vous éditez un écran de catégorie, vous pouvez ajouter un ou plusieurs cookies. Nous les appelons cookies dans l'interface pour aller au plus direct, néanmoins sachez qu'il peut très bien s'agir d'un pixel, d'un script, d'une solution logicielle.

✅ Il n'est absolument pas requis de spécifier les noms techniques de chaque cookie déposés sur le navigateur (ceux que vous trouvez dans l'inspecteur web). Cette information est inutile pour un internaute lambda et vide de son sens toute la démarche de recueil de consentement. Au contraire, privilégiez une mise en avant intelligible des solutions logicielles en place sur votre site :

_gid ou _ga n'ont bien évidemment aucune signification pour un internaute. Google Analytics, lui, en a un peu plus. Hors un consentement valide, au sens du RGPD, implique qu'il soit recueilli de manière intelligible et éclairée, à vous donc d'expliquer ce que sont ces identifiants cabalistiques. Il n'est de plus pas rare que, comme dans l'exemple plus haut, un seul script soit responsable de la dépose de plusieurs cookies. Il n'y a donc ni intérêt, ni faisabilité technique, à proposer une information unitaire pour chacun de ces traceurs.

La sélection des cookies

✅ Axeptio met à votre disposition un référentiel multilingue des services les plus communs. Vous pouvez y accéder en cliquant sur le bouton Ajouter un nouveau cookies

Nous avons identifié et catégorisé plusieurs centaines de logiciels que vous pouvez facilement ajouter à votre configuration. Pour chacun de ces vendors (c'est le nom consacré dans l'industrie), nous avons été cherché l'entreprise éditrice, rédigé une description en anglais et en français, et avons mis un lien vers la politique de confidentialité. En effet, il est de votre responsabilité de permettre à l'internaute d'accéder sans difficulté aux coordonnées des sous-traitants de données à caractère personnelles que sont les tiers qui déposent des cookies sur votre site.

Ainsi, si le service que vous cherchez n'est pas présent dans notre référentiel ou que vous souhaitez le décliner dans une autre langue que celles proposées, vous pouvez créer vos propres vendors. Cela se fait en cliquant sur le bouton "Créer un cookie" depuis l'écran de sélection. Par défaut, nous nous basons sur l'URL du service pour récupérer son Favicon et l'afficher sous forme d'icône dans le widget. Pensez-donc à la spécifier si vous voulez améliorer l'apparence de cette étape sur votre site.

Un champ particulièrement important à considérer dans le formulaire d'édition des cookies est le champ nom, qui définit l'identifiant technique qui sera transmis à votre site internet lors de la complétion du recueil de consentement. En effet, que vous choisissiez une intégration par un TMS (Tag Management System) ou directement en Javascript, les noms des variables utilisées pour déclencher les différents scripts sur votre page seront issus de ce champ. Pour le confort et la santé mentale des développeurs qui travaillent avec vous, évitez les caractères accentués, les espaces et autres caractères incompatibles avec les langages de programmation (non pas que ça ne marche pas, mais ça rend l'intégration un peu plus complexe).

Une fois les cookies sélectionnés ou créés, ils vont apparaitre dans le formulaire de l'étape et en cliquant dessus vous serez en mesure d'en modifier le contenu. Si vous modifiez un cookie pioché depuis le référentiel Axeptio, à l'enregistrement des modifications nous créerons une copie qui sera rattachée à votre compte utilisateur, au projet dans lequel vous travaillez et, le cas échéant, à l'organisation à laquelle est rattaché le projet.

✅ Si vous optez pour un bouton Tout refuser et un bouton Tout accepter sur votre écran de bienvenue, une partie très importante des visiteurs ne consultera même pas ces écrans. Faut-il pour autant les prendre par dessus la jambe ? Ô que non ! Les quelques internautes suffisamment motivés pour rentrer dans les arcanes de vos cookies sont généralement des personnes sensibles à ce qui est fait de leurs données, ou alors des développeurs curieux de ce que vous avez sous le capot (que vous pourriez peut-être recruter...). Ou alors c'est peut-être bien le contrôleur de la CNIL en train de vérifier votre bonne foi 🤷

L'écran d'information (3/3)

C'est le petit frère de l'écran de catégorie, dont il reprend une grande partie du design et de la mécanique.

L'écran d'information vous permet d'afficher une liste de services sans que vous ne les soumettiez au consentement préalable de l'internaute.

Dans la mesure où le consentement n'est pas requis, nous permettons le défilement automatique de l'écran avec la mise en place d'un compte à rebours. Ainsi, lorsque vous arrivez sur un écran d'information, vous distinguerez une discrète barre de progression annonçant l'écoulement du temps restant avant la complétion de l'étape.

✅ Vous ne voulez pas mettre de compte à rebours ? Pas de problème, spécifiez simplement 0 (zéro) dans le champ "Passer l'écran au bout de"

✅ Si vous mettez un compte à rebours, veillez à ce qu'il soit suffisant pour permettre à l'internaute de tout lire. Il n'y a pas plus frustrant qu'une écran qui file trop vite.

Récapitulatif des fonctionnalités des 3 principaux types d'écran

Écrans	Affiche des tiers	Contenus	Illustration	Accès Free
Écran de bienvenue	non	Sur-titre, Titre, Sous-titre, Texte, Lien vers la Politique de Confidentialité	À droite	oui
Écran de catégorie	oui	Sur-titre, Titre, Sous-titre, Texte	Centrale	oui (limité à 2 services)
Écran d'information	oui	Sur-titre, Titre, Sous-titre, Texte	Centrale	non

Personnalisation des illustrations des widgets

Au sein de chaque formulaire d'étape, nous vous permettons de modifier l'image d'illustration ainsi que la hauteur et la largeur de celle-ci. Lorsque vous cliquez sur le bouton d'édition (symbolisé par un crayon), vous serez transporté dans l'écran générique de sélection et de téléchargement de fichiers personnalisés.

✅ Vous pouvez jouer avec la hauteur et la largeur pour créer des compositions originales.

Cet écran est composé de trois parties :

Le champ de téléchargement : glissez un fichier depuis votre ordinateur sur ce bloc et il sera immédiatement téléchargé sur nos serveurs. Nous acceptons les principaux types de fichiers image (jpeg, png, webm, svp). Pour les plus techniques d'entre-nous, sachez que le fichier d'origine est déposé sur un bucket AWS S3 en Irlande et qu'il sera ensuite servi par notre CDN imgix (qui lui-même s'appuie sur les services de Fastly)
La liste de vos téléchargements précédents : lorsque vous uploadez un fichier, ce dernier est rattaché à votre compte utilisateur. Cliquez simplement sur l'image pour la sélectionner
La liste des visuels que nous mettons à votre disposition : notre équipe a confectionné sur mesure une grande quantité de visuels que vous pouvez utiliser dans les widgets Axeptio sans contrainte de droit d'auteur. Nous vous proposons plusieurs styles graphiques et mettons régulièrement en ligne de nouveaux visuels

✅ Vous souhaitez utiliser le style Axeptio mais avec un visuel qui vous corresponde vraiment ? Nous réalisons également des illustrations sur-mesure ! Contactez-nous pour qu'on en discute.

Maintenant que tout est clair sur l'administration de notre widget de cookies, pourquoi ne pas le personnaliser à vos couleurs ? Dans le prochain article, nous vous expliquons comment modifier l'apparence des widgets pour qu'ils s'accordent au mieux à votre identité visuelle.

2. Personnaliser graphiquement le widget

Pour la personnalisation graphique de votre widget, nous vous invitons à lire l'article suivant :

Je personnalise l'aspect de mon widget