QR code avec logo : le budget d'erreur, et comment ne pas le dépasser
2026-07-31
Un logo ne se pose pas sur un QR code, il l'ampute
Poser un logo au centre d'un QR code ne recouvre pas un espace vide. La matrice est pleine : chaque module noir ou blanc porte de l'information. Le logo détruit purement et simplement les modules qu'il masque.
Si le code reste lisible, ce n'est pas parce que le centre serait moins important — c'est parce que la norme ISO/IEC 18004 prévoit une redondance. Comprendre cette redondance, c'est comprendre exactement combien de logo on peut se permettre.
Le budget d'erreur : quatre niveaux
Un QR code encode ses données avec un code correcteur de Reed-Solomon. On choisit la quantité de redondance à l'encodage, parmi quatre niveaux :
- L — environ 7 % des données récupérables
- M — environ 15 %
- Q — environ 25 %
- H — environ 30 %
Ce pourcentage est le budget total de dégradation du code, et il ne se dépense pas qu'au centre. Une impression baveuse, un pli, une rayure, un reflet sur un écran : tout consomme le même budget. Un logo qui absorbe la totalité des 30 % laisse zéro marge pour le monde réel, et le code ne se scanne qu'en conditions parfaites.
C'est la raison pour laquelle web3qr force le niveau H dès qu'un logo est présent, quel que soit le réglage choisi par ailleurs. Le niveau demandé par l'utilisateur n'est respecté que sur un code sans logo.
La taille maximale réelle : 30 %
La question qu'on se pose toujours est « jusqu'à quelle taille ? ». La réponse est bornée par le budget ci-dessus.
Dans web3qr, la taille du logo est exprimée en fraction de la largeur du QR code. La valeur par défaut est 0,22, soit 22 % de la largeur — donc environ 4,8 % de la surface. Le moteur applique un plancher à 0,05 et un plafond à 0,30.
Ce plafond n'est pas décoratif. Au-delà de 30 % de largeur, la zone détruite dépasse ce que la correction Reed-Solomon peut reconstruire, même en niveau H, et le scan devient aléatoire : il fonctionne sur un téléphone récent en pleine lumière, et échoue sur un autre. Le clamp est appliqué au niveau du moteur, pas de l'interface, précisément pour qu'un design importé — un ancien JSON d'historique, un template externe — ne puisse pas contourner la limite.
Un repère utile : la surface, pas la largeur. Un logo à 30 % de largeur occupe 9 % de la surface du code. C'est déjà considérable une fois qu'on y ajoute la marge du masque.
Le masque : pourquoi un logo posé « tel quel » est une erreur
Coller une image par-dessus la matrice pose un problème que les scanners détectent mal : les modules situés sous les bords semi-transparents du logo deviennent ambigus. Ils ne sont ni franchement noirs ni franchement blancs, et le décodeur binarise au petit bonheur.
La bonne pratique est le masque négatif : on efface d'abord une zone nette, puis on dessine le logo dedans. Le décodeur voit alors une zone uniformément vide, qu'il traite comme une erreur franche — exactement ce que Reed-Solomon sait corriger. Une zone ambiguë, elle, produit des lectures instables.
web3qr propose trois formes de masque :
- circle — un disque d'exclusion autour du logo. Le plus sûr, le plus classique.
- square — un carré. Utile pour un logo lui-même rectangulaire.
- padded — le fondu : le masque suit le contour alpha exact du logo, élargi par une dilatation radiale. La silhouette est tamponnée en disques sur chaque position d'un disque de dilatation, ce qui produit un halo doux qui épouse la forme réelle du logo au lieu d'une boîte brutale.
Le fondu est visuellement le plus abouti, mais c'est aussi celui qui consomme le moins de modules : il n'efface que ce qu'il faut, là où un carré efface les coins inutilement.
La marge du masque, souvent oubliée
Entre le logo et les modules conservés, il faut de la marge. Sans elle, l'œil du scanner lit un module partiellement recouvert et se trompe.
web3qr calcule cette marge proportionnellement à la taille de rendu, avec une référence à 300 pixels : un QR exporté en 1024 px reçoit une marge environ 3,4 fois plus grande qu'un aperçu à 300 px. La marge apparente reste donc constante quelle que soit la taille d'export, ce qui évite le piège classique du logo parfait à l'écran et illisible une fois imprimé en grand.
La quiet zone, à ne jamais rogner
Indépendamment du logo, un QR code exige une marge blanche autour de lui — la *quiet zone*. La norme demande 4 modules minimum. web3qr réserve 8 % de la largeur totale, ce qui correspond à cet ordre de grandeur.
C'est l'erreur la plus fréquente en mise en page : un QR collé au bord d'un flyer, ou posé sur une photo qui déborde dans sa marge. Le scanner ne trouve plus les limites du symbole et abandonne avant même d'essayer de décoder. Aucun niveau de correction ne compense l'absence de quiet zone, parce que le problème survient avant la correction d'erreur.
Le contraste, l'autre moitié du problème
Un logo bien dimensionné ne sauve pas un code au contraste insuffisant. Le décodeur commence par binariser l'image : chaque pixel devient noir ou blanc selon un seuil. Si les modules et le fond sont trop proches en luminance, la binarisation produit du bruit avant même que Reed-Solomon entre en jeu.
Deux règles pratiques :
- Les modules doivent être plus sombres que le fond. Un QR clair sur fond sombre fonctionne sur beaucoup de scanners modernes, mais pas sur tous, et rien ne l'impose dans la norme.
- Un dégradé est acceptable tant que la teinte la plus claire reste nettement plus sombre que le fond. Un dégradé qui traverse la luminance du fond crée des zones illisibles au milieu du code.
La méthode qui évite les mauvaises surprises
- Générer avec le logo à la taille voulue, en restant sous 25 % de largeur si le code doit être imprimé.
- Vérifier que le niveau de correction est bien H.
- Tester sur au moins deux téléphones, un iOS et un Android : leurs décodeurs ne sont pas les mêmes et ne pardonnent pas les mêmes défauts.
- Tester à la distance réelle d'usage, pas le nez sur l'écran.
- Pour un tirage, imprimer un exemplaire et le scanner avant de lancer le reste. Un défaut d'encre invisible à l'œil consomme du budget d'erreur.
Si le code passe ces cinq étapes, le logo ne posera pas de problème. S'il en échoue une, la première chose à réduire est la taille du logo — c'est le seul paramètre qui rend directement du budget à la correction d'erreur.