Logo vectoriel : le format conditionne tous vos usages

Demander « le logo en vectoriel » ne suffit pas, et beaucoup d’entreprises l’apprennent au pire moment : devant un imprimeur, un fabricant d’enseigne ou une régie publicitaire qui refuse le fichier reçu.

Le vrai sujet n’est pas le format, c’est le jeu de fichiers. Un SVG existe dans presque toutes les livraisons. Un SVG dont les textes ont été convertis en tracés, accompagné des exports aux tailles que les plateformes imposent et des versions monochromes, est beaucoup plus rare.

Cette page traite les fichiers. Ce qu’un logo doit faire, ses déclinaisons et les tests à lui faire passer sont traités dans logo d’entreprise B2B.

Vectoriel et matriciel, la distinction en une minute

La distinction est simple, et elle explique tout le reste.

Un fichier matriciel décrit une grille de pixels. Chaque point a une couleur. Réduire l’image fonctionne, puisqu’il suffit de jeter des points. L’agrandir ne fonctionne pas, puisqu’il faudrait inventer de l’information qui n’existe pas. C’est le cas du JPEG et du PNG.

Un fichier vectoriel décrit des tracés. Il ne stocke pas des points mais des instructions géométriques : une courbe passant par tels points, un remplissage de telle couleur. L’affichage se recalcule à la taille demandée, donc sans perte. C’est le cas du SVG, du PDF et de l’EPS.

La conséquence pratique est la seule chose à retenir : votre logo doit exister en vectoriel parce qu’il sera reproduit du favicon de 48 pixels à l’enseigne de plusieurs mètres. Aucun fichier matriciel ne couvre cet écart.

Un test rapide pour savoir ce que vous avez : agrandissez fortement le fichier et regardez les bords. Nets à n’importe quelle échelle, c’est du vectoriel. Pixellisés ou flous, c’est du matriciel.

Attention à un piège fréquent : un fichier portant une extension vectorielle peut ne contenir qu’une image matricielle importée. Un EPS contenant un JPEG reste un JPEG dans une enveloppe. Le test d’agrandissement le révèle immédiatement, ce qui en fait la première vérification à faire sur une livraison.

Le défaut de livraison le plus fréquent

Ce défaut est invisible, il ne coûte rien à corriger au moment de la livraison, et il se découvre en général six mois plus tard sur un tirage.

Dans un fichier vectoriel, le texte peut rester du texte, c’est-à-dire une suite de caractères associés à une police. Le fichier ne contient alors pas le dessin des lettres, mais une instruction du type « écrire MASTRATOS dans telle police ». Sur une machine qui ne possède pas cette police, le système en substitue une autre.

Le résultat : votre logo s’affiche dans une police qui n’est pas la vôtre, souvent sans que personne ne s’en aperçoive, parce que le fichier s’ouvre correctement et que l’écart n’est pas grossier.

La demande à formuler tient en une phrase, et elle appartient au brief : les textes doivent être convertis en tracés dans tous les fichiers de diffusion. Une fois convertis, les lettres deviennent des formes géométriques : elles ne dépendent plus d’aucune police, et elles ne sont plus modifiables comme du texte.

D’où une seconde demande, complémentaire : conservez à part une version éditable, dans laquelle les textes restent du texte. Elle servira le jour où il faudra retoucher le logo, ajouter une baseline ou décliner une filiale. Sans elle, la moindre modification suppose de redessiner.

Un test que vous pouvez faire sans logiciel professionnel : ouvrez le fichier vectoriel dans un navigateur, puis tentez de sélectionner le texte du logo avec la souris. Si le texte se sélectionne comme du texte, il n’est pas vectorisé.

Le vectoriel est une source, pas un format de diffusion

Le point qui surprend le plus découle des contraintes que publient les plateformes.

Aucune des grandes plateformes n’accepte de fichier vectoriel. Les spécifications LinkedIn imposent du PNG ou du JPEG, dans la limite de 3 Mo. Les spécifications Google Ads acceptent le JPG et le PNG, jusqu’à 5120 Ko. Une fiche d’établissement Google demande du JPG ou du PNG, entre 10 Ko et 5 Mo.

Votre fichier vectoriel ne sera donc jamais déposé tel quel sur ces surfaces. Il sert à produire les exports matriciels aux dimensions exactes qu’elles exigent, sans perte de qualité et sans avoir à redessiner à chaque fois.

Une seconde limite, moins connue, concerne le SVG spécifiquement. C’est un format textuel, qui peut contenir du script. Certains environnements de publication et de messagerie le filtrent ou le refusent pour cette raison. Ce n’est pas un défaut du format, c’est une précaution de sécurité, mais elle explique pourquoi un SVG accepté sur votre site peut être rejeté ailleurs.

D’où la règle de production : une source vectorielle, des exports matriciels aux tailles imposées. Les tailles à couvrir sont détaillées dans logo d’entreprise B2B, et l’essentiel tient en quatre valeurs : 48, 128, 400 et 1200 pixels de côté, plus une version horizontale au rapport 4:1.

Les tailles d’export à produire, et pourquoi celles-là

Un fichier vectoriel ne se dépose nulle part : il sert à produire des exports. Autant les produire une fois pour toutes, aux dimensions réellement exigées, plutôt que de redemander un fichier à chaque besoin.

Deux remarques sur ce tableau.

Produire la plus grande suffit rarement. Réduire une image de 1200 pixels à 48 donne un résultat brouillon si le dessin comporte des détails fins. La version de très petite taille se prépare séparément, parfois en simplifiant le tracé, ce qui est précisément le rôle du monogramme évoqué dans logo d’entreprise B2B.

Prévoyez les deux fonds. Un export à fond transparent et un export à fond blanc pour chaque taille. Plusieurs documentations avertissent que les fichiers transparents sont rendus sur fond blanc, ce qui fait disparaître les logos majoritairement clairs.

Le favicon, un cas à part

Le favicon mérite deux lignes, parce que c’est l’export le plus visible et le plus souvent bâclé.

Le format SVG y est accepté, contrairement aux plateformes évoquées plus haut : les navigateurs modernes acceptent un favicon vectoriel, ce qui donne un rendu net sur tous les écrans. Il reste prudent de fournir aussi un PNG en repli.

La contrainte n’est pas la taille mais la simplicité. À 48 pixels de côté, un logo complet avec sa signature devient une tache. Ce qui fonctionne est une forme, une initiale ou un symbole isolé. Si votre logo ne se réduit pas à un élément identifiable, c’est une information sur le logo, pas sur le favicon.

Un seul favicon par site. La documentation de Google précise qu’un seul favicon par nom d’hôte est pris en compte, et que son adresse doit rester stable. Changer régulièrement l’adresse du fichier revient à empêcher son affichage.

Que vérifier à la réception des fichiers ?

Ces vérifications prennent dix minutes et évitent les découvertes tardives.

Agrandissez fortement chaque fichier vectoriel. Des bords nets à toute échelle confirment le vectoriel. Des pixels révèlent une image matricielle dans une enveloppe vectorielle.

Tentez de sélectionner le texte dans un navigateur. S’il se sélectionne, les textes ne sont pas vectorisés, et le fichier dépendra des polices installées.

Posez chaque export sur trois fonds. Blanc, gris moyen, sombre. C’est le test qui révèle les logos dont la lisibilité repose sur des zones blanches qui sont en réalité des trous.

Ouvrez le dossier six mois plus tard, en pensée. Les noms de fichiers permettent-ils à quelqu’un qui n’était pas là de choisir le bon ? Si la réponse est non, demandez un renommage avant de solder la prestation, pendant que le prestataire est encore mobilisé.

Quels fichiers demander, et dans quels formats ?

La commande se formule par usage, pas par format. Voici la liste à reprendre telle quelle.

Trois exigences à ajouter, qui coûtent une phrase dans le brief et beaucoup de temps si elles manquent.

Les espaces colorimétriques. RVB pour l’écran, CMJN pour l’impression, avec les références de couleur exactes. Une couleur non définie pour l’impression sera convertie par l’imprimeur selon ses propres réglages.

Le nommage. Un dossier contenant logo-final-2 et logo-vrai-final est un dossier dans lequel la mauvaise version finira sur un support imprimé en quantité. Imposez une convention : nom de l’entreprise, déclinaison, version colorimétrique, dimension.

La cession de droits. Payer une prestation ne transfère pas automatiquement les droits sur ce qu’elle produit. Le sujet est développé dans faire faire sa charte graphique.

Intégrer un SVG sur votre site : trois façons, trois conséquences

Le même fichier peut être intégré de trois manières, et le choix n’est pas neutre. C’est une question à poser à votre prestataire plutôt qu’à subir.

En tant qu’image, via une balise d’image classique. C’est la méthode la plus simple. Le fichier est mis en cache par le navigateur, il se comporte comme n’importe quelle image, et vous pouvez lui donner un texte alternatif. En revanche, vous ne pouvez pas modifier ses couleurs depuis la feuille de style : un logo blanc pour un fond sombre suppose un second fichier.

Directement dans le code de la page. Le contenu du fichier est recopié dans la page. Il n’y a plus de requête supplémentaire, et surtout le dessin devient stylable : une seule source peut changer de couleur selon le contexte, par exemple en mode sombre. Le prix à payer est que le dessin alourdit chaque page où il figure et n’est pas mis en cache séparément.

En image de fond : la méthode à éviter

Méthode courante et souvent le mauvais choix pour un logo : le dessin devient invisible pour les technologies d’assistance et pour l’extraction de contenu, puisqu’il n’existe pas dans le contenu de la page.

Pour un logo d’en-tête de site, l’intégration directe dans le code se justifie quand vous avez besoin de changer sa couleur selon le fond. Sinon, la balise d’image suffit et reste plus simple à maintenir.

Deux précisions utiles dans les deux cas.

Le texte alternatif du logo. Il porte le nom de l’entreprise, pas le mot « logo ». Et lorsque le logo sert de lien vers l’accueil, ce texte devient le libellé de ce lien.

L’optimisation du fichier. Un SVG exporté d’un logiciel de dessin contient des métadonnées, des identifiants et parfois des calques masqués. Un passage par un outil d’optimisation réduit souvent le poids de moitié sans changer le rendu. C’est une demande à formuler à la livraison.

Que vous demanderont imprimeurs et fabricants ?

Au-delà du numérique, votre logo sera transmis à des prestataires qui travaillent avec leurs propres contraintes. Anticiper leurs demandes évite les allers-retours en urgence.

L’imprimeur demandera un fichier vectoriel en CMJN, avec les références de couleur, les textes vectorisés et, selon les cas, un fond perdu. Un fichier en RVB sera converti par ses soins, avec un résultat que vous découvrirez sur le tirage.

Le fabricant d’enseigne ou de signalétique demandera des tracés fermés et simples, exploitables par une machine de découpe. Les dégradés, les ombres portées et les traits très fins ne se découpent pas : ils imposent une adaptation, qui sera faite sans vous si vous ne l’avez pas prévue.

Le brodeur demandera une version simplifiée, en un nombre limité de couleurs, sans détail inférieur à quelques millimètres. C’est l’usage le plus contraignant de tous, et c’est aussi celui pour lequel les entreprises fournissent le plus souvent un fichier inadapté.

La régie publicitaire demandera des exports matriciels aux dimensions exactes de son inventaire, avec un fond géré, comme détaillé plus haut.

Le point commun de ces quatre demandes : elles supposent toutes une version monochrome et une version simplifiée. Si votre livraison n’en contient pas, chacun de ces prestataires en fabriquera une, à sa manière, sans vous consulter.

Que faire si vous n’avez plus que du matriciel ?

La situation est courante : l’agence a disparu, le fichier source est perdu, et il ne reste qu’un PNG extrait d’un ancien site.

La vectorisation automatique n’est pas la solution. Les outils de conversion produisent des tracés approximatifs à partir des pixels : contours irréguliers, nombre de points ingérable, courbes qui ne sont pas celles du dessin d’origine. Le résultat paraît acceptable à petite taille et se trahit dès l’agrandissement, c’est-à-dire exactement dans le cas où vous en aviez besoin.

Le redessin est plus rapide qu’il n’y paraît. Un logo simple se retrace proprement en quelques heures à partir de l’image existante. Et l’opération présente un avantage : elle est l’occasion de produire enfin le jeu de déclinaisons manquant, plutôt que de reconstituer à l’identique un fichier unique qui vous manquera de nouveau.

Vérifiez d’abord qui détient les sources. Avant de payer un redessin, demandez formellement les fichiers à votre ancien prestataire. Ils existent souvent, et leur remise relève de ce qui a été convenu au moment de la commande.

Par où continuer

Vous commandez un logo. Le périmètre complet, les déclinaisons et les tests de validation : logo d’entreprise B2B.

Vous encadrez son usage. La charte est le document qui rend le logo utilisable par d’autres que son auteur : faire faire sa charte graphique.

Vous choisissez aussi une typographie. Les mêmes questions de licence et de vectorisation s’y posent : choisir une police de caractère.

Vous changez de logo. Le coût réel est dans les supports à reprendre : changer de nom ou d’identité de marque.

En bref

• Le vectoriel décrit des tracés, le matriciel des pixels. C’est la seule raison d’exiger l’un, et elle est pratique : du favicon de 48 pixels à l’enseigne de plusieurs mètres.
• Un fichier à extension vectorielle peut contenir une image. Le test d’agrandissement le révèle en dix secondes.
• Les textes doivent être convertis en tracés. Sinon le logo s’affiche dans une police de substitution, et personne ne le voit avant l’impression.
• Conservez une version éditable à part, pour le jour où il faudra retoucher.
• Le vectoriel est une source, pas un format de diffusion. LinkedIn, Google Ads et la fiche d’établissement n’acceptent que du PNG ou du JPEG.
• La commande se formule par usage, avec les espaces colorimétriques, une convention de nommage et la cession de droits.
• La vectorisation automatique ne remplace pas un redessin. Elle produit des contours qui se trahissent à l’agrandissement.

Si vous doutez des fichiers en votre possession, les deux tests de cette page suffisent à trancher. Parlons de votre projet, ou découvrez notre approche du branding en B2B.