Chapitre 8.3 — Mentions au point de collecte

⏱️ TL;DR — La politique de confidentialité donne tout, à froid. Mais au moment précis où la personne remplit un champ, elle a besoin d’une information immédiate et contextuelle : c’est l’information « juste-à-temps ». Le bon réflexe tient en quatre gestes : (1) expliquer la finalité là où on collecte (« votre e-mail sert à vous envoyer vos identifiants »), (2) marquer d’un astérisque les champs obligatoires et dire pourquoi les autres sont facultatifs, (3) poser un lien contextuel vers la section pertinente de la politique complète, (4) ne pas noyer l’essentiel — une phrase claire à côté du champ vaut mieux qu’un pavé sous le bouton. Le point de collecte, c’est le moment de vérité de la transparence : c’est là que la personne décide.

🎯 Objectifs

• Servir une information contextuelle au bon endroit — à côté du champ, pas noyée en bas.
• Expliquer la finalité là où on collecte la donnée.
• Utiliser correctement l’astérisque des champs obligatoires (minimisation visible).
• Relier chaque formulaire à la politique complète par un lien contextuel.

L’information « juste-à-temps » : la bonne info au bon moment

L’article 12 exige une information aisément accessible. En pratique, ça veut dire deux niveaux qui se complètent :

• la politique de confidentialité (chapitre 8.2) : le niveau détaillé, consultable à tout moment ;
• les mentions au point de collecte : le niveau immédiat, servi pendant que la personne saisit ses données.

Ce second niveau est souvent négligé — et c’est pourtant lui qui fait la différence. Une personne ne lit pas une politique de 4 000 mots avant de taper son e-mail. En revanche, elle lit la petite phrase juste à côté du champ qui lui dit pourquoi on le demande. L’information « juste-à-temps » (just-in-time notice) délivre l’essentiel au moment de la décision, et renvoie au détail pour qui veut plus.

Les quatre gestes d’un bon point de collecte

1. Expliquer la finalité, là où on collecte

Chaque champ (ou groupe de champs) sensible ou non évident mérite un micro-texte qui dit à quoi il sert. Pas la finalité globale de l’entreprise : la finalité de ce champ précis, à cet endroit.

2. L’astérisque : rendre la minimisation visible

Le marquage des champs obligatoires (souvent un astérisque *) n’est pas qu’une convention d’UX : c’est une traduction visible du principe de minimisation. Il dit à la personne : voici ce dont j’ai strictement besoin ; le reste est facultatif. Encore faut-il que ce soit vrai — si tout est marqué obligatoire, c’est le signe d’une sur-collecte à revoir (Partie 1).

3. Le lien contextuel vers la politique

À côté du formulaire, un lien vers la politique complète — idéalement vers la section pertinente (l’ancre de la finalité concernée), pas juste la page d’accueil de la politique. « En savoir plus sur l’usage de vos données » qui pointe vers la bonne section : voilà le pont entre les deux niveaux.

4. Ne pas noyer l’essentiel

Le pire ennemi de la transparence, c’est le mur de texte. Un paragraphe de mentions légales serré sous le bouton « Valider » n’informe personne : il décourage la lecture. On préfère une phrase par champ, un ton simple, et le détail renvoyé au lien. Clarté d’abord — le chapitre 8.4 y revient.

⚠️ Piège — Regrouper toutes les mentions en un seul bloc gris, en petits caractères, tout en bas du formulaire, après le bouton. C’est présent « pour la forme », mais inaccessible dans les faits : personne ne le lit, et il ne remplit donc pas l’objectif d’information effective de l’art. 12. Autre variante du piège : cacher l’astérisque des champs obligatoires ou, à l’inverse, tout marquer obligatoire. L’information « juste-à-temps » ne vaut que si elle est vue au bon moment.

Exemple : un formulaire d’inscription annoté

Voici un formulaire d’inscription de FormaCampus, annoté selon les quatre gestes. Les commentaires signalent où et pourquoi chaque mention est posée.

<!-- Formulaire d'inscription — mentions "juste-à-temps" annotées -->
<form action="/inscription" method="post">
  <h2>Créer mon compte stagiaire</h2>
 
  <!-- GESTE 2 : l'astérisque signale le champ obligatoire (minimisation visible) -->
  <label for="email">Adresse e-mail *</label>
  <input id="email" name="email" type="email" required />
  <!-- GESTE 1 : la finalité expliquée LÀ où on collecte -->
  <small class="finalite">
    Sert à créer votre compte et à vous envoyer vos identifiants.
    Obligatoire pour ouvrir l'accès.
  </small>
 
  <label for="prenom">Prénom</label>
  <input id="prenom" name="prenom" type="text" />
  <!-- Champ FACULTATIF : pas d'astérisque, et on dit pourquoi -->
  <small class="finalite">
    Facultatif — uniquement pour personnaliser nos messages.
  </small>
 
  <label for="telephone">Téléphone</label>
  <input id="telephone" name="telephone" type="tel" />
  <small class="finalite">
    Facultatif — utilisé seulement si votre financeur exige un contact direct.
  </small>
 
  <!-- Consentement SÉPARÉ, non pré-coché, pour une finalité distincte (Partie 7) -->
  <label>
    <input type="checkbox" name="newsletter" value="oui" />
    J'accepte de recevoir la newsletter (nouvelles formations). Facultatif.
  </label>
 
  <!-- GESTE 3 : lien contextuel vers la section pertinente de la politique -->
  <p class="mention-info">
    Vos données sont traitées par FormaCampus pour la gestion de votre compte.
    Vous disposez de droits d'accès, de rectification et d'effacement.
    <a href="/politique-confidentialite#comptes">
      En savoir plus sur l'usage de vos données
    </a>.
  </p>
 
  <button type="submit">Créer mon compte</button>
</form>

Quelques points de lecture de cet exemple :

• La case newsletter est séparée, non pré-cochée et facultative : c’est une finalité distincte, avec sa propre base légale (consentement, Partie 7). On ne la mélange jamais avec la création de compte.
• Le lien pointe vers #comptes : l’ancre de la section « comptes » de la politique, pas sa page d’accueil.
• Chaque champ facultatif le dit et explique son usage : c’est de la minimisation rendue lisible.

En React/JSX, la logique est identique — attention seulement à la syntaxe : l’attribut se nomme htmlFor au lieu de for, et un commentaire s’écrit {/* ... */}. Le principe, lui, ne change pas : une mention par champ, un lien contextuel, l’essentiel visible.

💡 Réflexe — Pose-toi la question au moment où tu ajoutes un champ : « Si j’étais la personne, est-ce que je comprends, ici et maintenant, pourquoi on me demande ça ? » Si la réponse n’est pas évidente, ajoute une mention de finalité à côté du champ. La transparence se code dans le composant de formulaire, pas seulement dans une page « politique » lointaine.

🧭 Sur FormaCampus — Sur le tunnel d’inscription des stagiaires, FormaCampus applique les quatre gestes : e-mail obligatoire (finalité « créer le compte »), prénom et téléphone facultatifs et justifiés, case newsletter séparée et non pré-cochée, et lien vers la section « comptes » de la politique. Côté LMS scolaire, la nuance vient de la collecte indirecte (chapitre 8.1) : quand c’est l’école qui saisit les élèves, il n’y a pas de formulaire rempli par l’élève — l’information « juste-à-temps » se déplace alors vers l’interface de l’établissement (mentions à destination de l’enseignant qui importe le fichier) et vers l’information due aux familles.

🔒 Côté personne concernée — Pour la personne, la mention à côté du champ, c’est ce qui transforme un formulaire opaque en une demande compréhensible. Savoir « pourquoi mon téléphone ? » avant de le donner, c’est pouvoir choisir de le laisser vide s’il est facultatif. C’est aussi ce qui distingue un service qui respecte de celui qui aspire : un champ obligatoire non justifié, ou une case pré-cochée, sont immédiatement perçus comme un abus — et sapent la confiance dès la première interaction.

📚 Le texte — L’exigence d’une information concise, transparente, compréhensible et aisément accessible, en des termes clairs et simples figure à l’article 12 du RGPD. Le contenu à délivrer reste celui des articles 13/14 (chapitre 8.1) : le point de collecte en donne l’essentiel contextuel, la politique en donne le détail. Le marquage des champs obligatoires découle du principe de minimisation (art. 5.1.c).

✏️ Exercices

Exercice 1 — Corrige le formulaire. Un formulaire de webinaire demande, tous marqués obligatoires : nom, e-mail, téléphone, société, date de naissance. Sous le bouton, un pavé de 300 mots de « mentions légales ». Propose trois corrections concrètes.

Exercice 2 — Où placer la mention ? Tu ajoutes un champ « établissement d’origine » sur l’inscription. Où et comment poses-tu l’information ?

🧠 Quiz de révision

Chapitre suivant : Langage clair & information des mineurs — l’obligation de termes clairs et simples (art. 12), poussée à son maximum face aux enfants, et le pont avec l’accessibilité.