Mettre son site web en conformité avec la recommandation « cookies »

La CNIL a publié sa recommandation en décembre 2013 [http://www.cnil.fr/documentation/deliberations/deliberation/delib/300/], puis annoncé en octobre 2014 le lancement de contrôles de son application. Depuis, un nombre grandissant de « bandeaux cookies » est constaté sur le web français, afin d’informer les utilisateurs que des cookies sont déposés, à tel point que de nombreux internautes en font une indigestion ! Pourtant, la CNIL ne recommande pas une information constante des internautes en maintenant le bandeau d’information au-delà de la première visite du site. En effet, dès lors que l’information proposée est visible, mise en évidence et complète lors de la première visite du site, et à partir du moment où elle permet aux internautes d’exprimer leur accord par une action concrète (par exemple en poursuivant leur navigation par le déroulement de la page, en cliquant sur un lien, etc.), ou leur refus (en utilisant les mécanismes d’opposition proposés par le site), avant tout dépôt ou lecture de cookies, il n’est pas nécessaire de redemander l’accord des mêmes internautes en affichant systématiquement le bandeau d’information sur toutes les pages du site ou lors de visites ultérieures. En résumé, le bandeau ne doit être affiché que tant que l’utilisateur n’a pas poursuivi sa navigation et surtout il doit permettre de faire un vrai choix.

1. La mesure d’audience

Le recueil du consentement, et donc l’affichage d’un bandeau cookie, n’est pas systématiquement requis. Ainsi, les cookies nécessaires à la fourniture du service demandé par les internautes (par exemple l’accès au site), ne nécessitent ni le recueil de leur consentement, ni information préalable. De fait, tous les cookies techniques (entendu comme absolument nécessaires pour le confort de navigation) ne sont pas soumis à la réglementation.

En plus des cookies techniques, certains cookies de mesure d’audience (i.e. analytics) peuvent être déposés dès l’arrivée de l’internaute, et donc sans recueillir préalablement son accord, à condition de respecter les conditions prévues dans la recommandation « cookies », permettant de bénéficier de l'exemption du recueil du consentement.

1.1 Les solutions exemptées

À ce jour, Google Analytics ne peut pas être configuré pour bénéficier de l’exemption du recueil du consentement, seuls les outils de la société At-Internet et le logiciel libre Piwik peuvent l'être.

En effet, les critères d’exemptions imposent notamment :

- des cookies dont la date d'expiration n'est pas prorogée au cours de la navigation ;

- une rétention limitée des données collectées ;

- la possibilité de s’opposer au suivi de la navigation.

Les outils mentionnés ci-dessus offrent de telles options. Les éditeurs n’ont qu’à intégrer les mentions d’information dans leur politique de gestion des cookies et à fournir un lien vers le mécanisme d’opposition (opt-out) de la solution retenue, sans nécessiter d'informer les utilisateurs par le biais d’un bandeau.

Dans le cas de Piwik, l'opt-out par défaut se configure en se rendant sur un lien, qui permet aux internautes de s’opposer au suivi de leur navigation :URL_DE_VOTRE_SITRE/index.php?module=CoreAdminHome&action=optOut&language=fr.

Sur AT-Internet, si vous avez opté pour la solution en hébergement tiers, le lien est le suivant : http://www.xiti.com/fr/optout.aspx.

Piwik est une solution qui est majoritairement installée sur le serveur de l’éditeur du site, il faut donc être vigilant lors de sa configuration afin de ne pas ouvrir de brèche dans votre système. Il est vivement recommandé de suivre les conseils de sécurisation de Piwik [http://piwik.org/docs/how-to-secure-piwik/].

1.2 Le tag Google Analytics

Google Analytics est l’outil de mesure d’audience (analytics) le plus utilisé sur le web actuellement [https://hal.inria.fr/hal-00915249/PDF/SellingOffPrivacyAtAuction.pdf]. Il ne peut pas entrer dans le cadre de l’exemption, car les données collectées sont conservées pour une durée indéfinie par Google [http://www.google.com/intl/en/policies/technologies/ads/].

Toutefois, Google permet de désactiver dynamiquement Google Analytics sur une page en définissant la variable ‘window['ga-disable-UA-ID_DU_SITE’]’ à ‘ true’ [https://developers.google.com/analytics/devguides/collection/analyticsjs/advanced#optout]. C’est en sa basant sur cette solution que les services de la CNIL ont élaboré un code fourni ici [https://github.com/CNILlab/Cookie-consent_Google-Analytics] permettant d’afficher un bandeau de demande de consentement et de retenir le dépôt des cookies tant que l’utilisateur n’interagit pas avec la page.

Le code est certes plus long que le code fourni par Google, mais il permet d’avoir un bandeau conforme à la recommandation « cookie » de la CNIL. À noter que, si vous utilisez les fonctionnalités publicitaires fournies par Google Analytics, il faudra modifier le texte d’information figurant dans le bandeau pour faire mention de cette finalité et permettre de s’y opposer.

2. Les boutons sociaux

L’utilisation de boutons sur les sites web permet de mettre en avant certains contenus via les plateformes sociales (Facebook, Twitter, LikedIn, Tumblr, etc.) en bénéficiant d’un « effet viral ». De nombreux éditeurs disposent de ces « boutons sociaux » sur la totalité de leurs pages. Ils incitent ainsi au partage. Toutefois, la plupart de ces boutons sociaux sont déposés directement depuis les domaines des plateformes sociales tierces. Leur simple présence sur le site visité provoque donc des dépôts et des lectures de cookies, même si l’utilisateur ne souhaite pas partager de contenu. Les plateformes utilisent les informations collectées via ces modules d’extension (plugins) pour personnaliser les publicités qu’elles affichent.

Par ailleurs, les plugins sociaux ne s’appuient pas uniquement sur les cookies pour suivre les internautes. Ils font souvent appel aux empreintes de matériels et logiciels (fingerprinting). Ainsi, AddThis a été pris « la main dans le sac » en 2014 [https://securehomes.esat.kuleuven.be/~gacar/persistent/#results] et les politiques de confidentialité de Facebook [https://www.facebook.com/help/cookies/update] et Google [https://www.google.fr/intl/fr/policies/privacy/] mentionnent l’utilisation de « cookies et de  technologies similaires », ce qui signifie que ces sociétés pourraient avoir recours au fingerprinting, auquel cas recourir au blocage des cookies tiers deviendrait une solution d’opt-out inefficace.

2.1 Social Share Privacy

Social Share Privacy est une solution qui remplace le plugin social « classique » par un bouton disposant d’un interrupteur. Tant que le visiteur n’appuie pas sur l’interrupteur, le bouton est inactif et les cookies ne sont pas déposés. Le plugin Social Share Privacy se présente sous la forme d’un tag qui fait appel à une librairie JQuery. Il est donc intégrable sur la plupart des sites. Pour les utilisateurs d’outils de gestion de contenus (Content Management System, CMS), des plugins existent, mais ils ne sont pas nécessairement maintenus.

L’intégration de Social Share Privacy se fait en ajoutant la ligne suivante dans l’entête (header) afin de désactiver les services non nécessaires. La ligne est adaptée en fonction des outils que vous souhaitez proposer sur votre site :

À l’endroit où vous souhaiterez disposer les boutons, vous n’aurez qu’à ajouter la ligne suivante :

Social Share Privacy permet un choix fin de l’utilisateur : l’utilisateur consent pour une page donnée. Il n’impacte pas la charte graphique des sites sur lesquels il est intégré. En effet, le bouton est assez similaire au bouton « like » de Facebook. Malheureusement, seules les fonctions « like » et « tweet » sont incluses. Les widgets un peu plus évolués comme les « embeds » et les « timelines » ne sont pas supportés.

2.2 Le remplacement par des images

Une autre solution mise en avant consiste à simplement remplacer les boutons sociaux par des images pointant vers la page du site sur la plateforme sociale. Ainsi, lorsqu’un visiteur clique sur un bouton social, il est redirigé sur la page dédiée au site visité sur le réseau social et peut dès lors partager le contenu comme il le souhaite. Cette solution présente l’avantage d’être adaptable à toute forme de site.

Certains sites ont mis en pratique des solutions différentes. C’est notamment le cas du site Mashable, qui affiche par défaut une image « like » et qui ne télécharge le bouton Facebook « original » que si l’utilisateur passe sa souris cette image. Si l’intention est bonne, il faut noter que cette seule action ne peut être interprétée comme un consentement.

2.3 L’affichage du nombre de « likes »

L’affichage du nombre de partages d’une page fournit souvent un signal au visiteur des contenus les plus populaires et impacte sa navigation sur le site. Malheureusement, ni Social Share Privacy, ni les boutons sous forme d’image ne permettent d’afficher le nombre de personnes ayant « aimé » une page avant que l’utilisateur ne clique sur le bouton.

Il peut être donc intéressant d’avoir soit une estimation de ce chiffre, soit sa valeur exacte. Dans les deux cas, il sera nécessaire de passer par une requête XML-HTTP afin de récupérer cette valeur. Dans le cas de Facebook, cette valeur est accessible même si l’utilisateur n’envoie aucun cookie, ce qui permet d’effectuer la requête en temps réel et d’obtenir une valeur à jour du nombre de « likes » d’une page.

3. Les outils de gestion de tags

Les outils présentés dans les sections précédentes sont adaptés à des fonctionnalités bien précises. Si vous souhaitez fournir des fonctionnalités autres que le partage de contenu, il vous sera nécessaire de recourir à une solution de gestion de tags plus polyvalente, mais qui peut sembler plus compliquée à intégrer.

Les solutions de « Tag Management » permettent de contrôler l’activation d’une balise JavaScript. Dans le cadre des cookies, ce contrôle permet de prévenir le déclenchement des éléments qui vont déposer ou lire des cookies tant que l’utilisateur n’a pas donné son consentement ou s’il ne consent pas.

Les tags qui peuvent être ainsi gérés sont de toutes les natures : publicités, vidéos, boutons sociaux, widgets, etc. Tant que l’appel JavaScript déclencheur peut être circonscrit, cette approche est applicable.

3.1 Le marché des solutions de gestion de tags

De nombreuses solutions de gestion de tags existent. Une grande partie d’entre elles s’intègrent dans le cadre de prestations fournies par des entreprises spécialisées. Le présent article n’a pas pour objectif de les comparer, puisque nous allons avant tout nous focaliser sur les alternatives gratuites et libres. Néanmoins, si vous choisissez de passer par une solution payante, assurez-vous bien que celle-ci est conforme et qu’elle ne dépose pas de cookies non nécessaires avant que l’utilisateur ait poursuivi sa navigation. Il est par ailleurs primordial de vérifier qu’aucun cookie non nécessaire n’est déposé lorsque l’utilisateur s’oppose au dépôt de cookies.

En effet, certaines solutions déposent juste des cookies d’opt-out à la publicité ciblée lorsque l’utilisateur s’oppose au dépôt de cookies. La plupart de ces cookies ne sont pas nécessaires et contiennent des identifiants qui seront utilisés pour tracer l’utilisateur. De plus, le dépôt de ces cookies ralentit considérablement la visite de l’internaute lors de sa première visite. Il faut donc vérifier les moyens d’opposition déposés par les Tag Managers lorsque l’utilisateur s’oppose.

3.2 Cookie Cuttr

Cette solution a été développée suite à l’adoption de la loi anglaise sur les cookies. Il s’agit d’une solution fonctionnant en PHP, qui consiste à encapsuler les tags dans les scripts qui ne seront exécutés que si l’utilisateur a effectivement consenti. Si le consentement n’a pas été obtenu, le tag ne sera tout simplement pas appelé. Initialement, un seul consentement était disponible. Mais l’outil a été adapté pour fournir un consentement par famille de cookies. Il est donc désormais possible d’exprimer un choix pour chacune des grandes familles (mesure d’audience, réseaux sociaux et publicité).

Pour mettre en place l’outil, il faut télécharger les fichiers disponibles ici [https://github.com/CNILlab/cookieCuttr]. Il faut ensuite modifier les tags des différents scripts en les faisant précéder des balises conditionnelles. Ces balises permettront de s’assurer que les tags ne sont appelés que si les conditions sont remplies.

3.3 Tarte au citron

« Tarte au citron », dont le nom est assez peu conventionnel, est une solution de gestion de tags efficace et flexible. Initialement, cette solution ne concernait qu’un petit nombre de services. Le catalogue de services supportés a considérablement grandi au cours des derniers mois et l’outil permet désormais de gérer les cookies liés aux vidéos, les widgets associés à différents services, ainsi que plusieurs régies publicitaires.

L’outil est disponible dans une version payante, qui peut être intégrée à certains CMS et qui dispose de facilités de configuration. Nous n’étudierons ici que la version gratuite, qui nécessite de disposer des bibliothèques JavaScript sur votre site et de les mettre à jour régulièrement.

L’installation requiert de copier les bibliothèques dans le répertoire de votre choix. Une fois les bibliothèques copiées, il vous faudra éventuellement intégrer la mise en forme de l’outil avant de configurer chacune des fonctionnalités en les intégrant dans vos différentes pages.

Il faut ensuite déclarer tous les plugins que vous allez utiliser sur votre site et les intégrer dans le corps des pages. Pour la plupart d’entre eux, il suffit juste de les déclarer dans le tableau des « job » de Tarte au citron. Dans de rares cas, il faut ajouter des paramètres spécifiques à votre site :

Vous n’avez pas nécessairement besoin de mettre ces éléments sur toutes les pages. Il suffit qu’ils soient présents sur les pages où les plugins sont utilisés. Toutefois, il est plus simple de les intégrer sur toutes les pages et cela permet d’obtenir un consentement de l’internaute en amont. Chaque type de plugin se configure différemment. Certains nécessitent d’être légèrement modifiés pour être configurés. Nous prendrons ici l’exemple d’une vidéo :

Si vous souhaitez insérer la même vidéo avec Tarte au citron, il faut tout d’abord intégrer dans le header de la page le bout de script suivant pour que Tarte au citron intègre Dailymotion à la liste des outils pour lesquels il va demander un consentement.

Reste ensuite à intégrer la vidéo, il suffit de remplacer l’appel habituel de la vidéo par le « div » suivant :

Au moment de l’affichage de la page, tarteaucitron.js va être appelé et la balise « div » ne sera remplacée par la vidéo que si le consentement a été obtenu. Dans le cas contraire, une image demandant le consentement sera affichée à la place de la vidéo.

L’outil Tarte au citron est open source (licence MIT) et peut être modifié si vous avez des fonctionnalités particulières à apporter, soit en faisant la demande [https://opt-out.ferank.eu/fr/contact/], soit en contribuant [https://github.com/AmauriC/tarteaucitron.js].

4. Introduction aux « Content Security Policies »

Une « Content Security Policy » (CSP) est une politique, définie par l’auteur d’une application ou d’une page web, qui informe le client des sources qui seront autorisées à charger du contenu sur le site (« declarative policy that lets the authors (or server administrators) of a web application inform the client about the sources from which the application expects to load resources »). Cette politique peut être vue comme une liste de contenus qui peuvent être chargés par le navigateur lors de l’accès à la page. Ces politiques peuvent être déclarées de deux façons : soit via le header HTTP, soit par le champ http-equiv présent dans l’entête HTML d’un document.

4.1 Déclaration d’une politique

Pour se mettre en conformité et empêcher que des contenus tiers ne soient déposés avant l’obtention du consentement, un site web peut déclarer une politique qui bloque le contenu provenant de sites tiers. Notez que cette approche n’est pas « cookie-centric », puisqu’elle permet de bloquer tous types de contenus et que, par conséquent, elle empêche aussi le chargement des services de calcul d’empreinte (fingerprinting).

Une solution rapide de « cookie consent » consiste à vérifier au moment du traitement d’une requête si le consentement a été obtenu et d’adapter la CSP en fonction. Si le consentement n’a pas été obtenu, la CSP n’autorisera que les ressources provenant de l’éditeur et bloquera les ressources provenant des tiers. Si le consentement a été obtenu, la CSP usuelle du site sera chargée.

Le plus simple pour un éditeur est d’utiliser une simple balise JavaScript pour insérer un champ http-equiv dans l’entête HTML du document. Cela n’est pas forcément recommandé, car cela atténue la séparation entre la CSP et le contenu qu’elle protège [https://bugzilla.mozilla.org/show_bug.cgi?id=663570#c4]. Les quelques lignes ci-dessous devraient faire l’affaire :

Une solution légèrement plus compliquée consiste à utiliser le header HTTP. Le code pour accomplir cela reste assez semblable, mais l’approche est plus spécifique au serveur que vous utilisez. Par exemple, si vous fonctionnez sur un environnement PHP, le code devrait ressembler à :

4.2 Compatibilité

Le standard CSP est en cours de validation, mais n’est toujours pas accepté par tous les navigateurs. À l’heure actuelle, Firefox, Chrome et Safari supportent toutes les fonctionnalités requises, dont le support du tag http-equiv. Enfin, si Edge (le nouveau navigateur de Microsoft) supporte toutes ces fonctionnalités, actuellement ni l'entête HTTP ni l'entête HTML ne sont pris en compte par Internet Explorer.

4.3 La conformité en utilisant les CSP

Une fois qu’elles seront plus largement supportées, les CSP permettront de bloquer les contenus tiers tant que le consentement n’a pas été obtenu. Néanmoins, cette solution est principalement viable pour le premier affichage. En effet, bloquer de façon permanente les contenus tiers n’est pas toujours concevable. La solution consiste alors à indiquer durant le premier affichage comment bloquer les cookies tiers. C’est la page d’information que de nombreux sites fournissent. Toutefois, cette solution présente deux inconvénients majeurs. D’une part, elle suppose que les cookies sont la seule technique de traçage utilisée sur le site. Or, on voit de plus en plus apparaître d’outils s’appuyant sur des prises d’empreintes du terminal. D’autre part, dans l’hypothèse ou vous utilisez des cookies first party, par exemple si vous utilisez Google Analytics, il sera nécessaire de faire appel à un script tel que celui qui est décrit dans le premier chapitre.

5. Comment tester que votre site est conforme ?

Une fois tout votre site configuré, il est nécessaire d’effectuer des tests pour vérifier que les différents scripts sont fonctionnels. Les utilisateurs se réfèrent souvent à des plugins comme Ghostery, afin de vérifier qu’aucun cookie n’est déposé avant que l’utilisateur ne consente. Malheureusement, si Ghostery est très efficace pour obtenir une estimation du nombre d’acteurs présents sur une page, il ne permet pas d’avoir une vue précise des cookies déposés et le nom d’un fournisseur de service comme Facebook sera susceptible d’apparaître même si aucun cookie n’est déposé dès lors qu’un appel vers la plateforme sera détecté.

Conclusion

Mettre un site en conformité est une tâche plus ou moins ardue en fonction des éléments tiers auxquels vos pages font appel. Pour les pages n’incluant que des outils de mesures d’audience ou des plugins sociaux, des solutions clés en main existent. Par contre, l’intégration de publicités, de vidéos ou de widgets va nécessiter de recourir à des outils généralement plus complexes. Heureusement, la démocratisation des outils de gestion de tags simplifie désormais grandement cette tâche et les récents standards du World Wide Web Consortium (W3C), que sont les Content Security Policies et DoNotTrack, devraient faciliter davantage le travail des éditeurs.