Un même logo peut n'afficher que 24 pixels de haut dans la navigation d'un site et s'agrandir à deux mètres de large sur un mur de stand. PNG ou SVG : regardez d'abord le scénario d'usage. Web et interfaces produit privilégient le SVG, le logo étant enregistré en tracés et redessiné par le logiciel à toute taille ; les points d'entrée qui n'acceptent que le bitmap (avatars sociaux, certains documents de bureau) reçoivent un PNG transparent ; affiches, enseignes et supports imprimés prennent le SVG ou un fichier vectoriel qui en découle, net à tout agrandissement. N'avoir qu'un PNG sous la main ne condamne pas à tout refaire : confirmez le format exigé par chaque scénario, puis complétez celui qui manque.
Points clés
- Web, interfaces et usages exigeant mises à l'échelle et changements de couleur répétés : SVG — le graphisme en tracés se redessine à l'agrandissement, sans bords flous.
- Entrées n'acceptant que le bitmap (avatars sociaux, certains logiciels de bureau) : PNG transparent, sans chercher à forcer la plateforme à accepter le SVG.
- Logos graphiques et logotypes méritent un fichier maître SVG ; mascottes photo-réalistes et images de marque à textures complexes restent en PNG haute résolution.
- Le SVG n'est pas forcément plus léger que le PNG : la taille dépend de la complexité du graphisme ; le critère de choix est l'usage, pas le poids.
Choisissez à partir de trois scénarios d'usage
Ces trois tâches de livraison, les plus courantes, couvrent presque toutes les destinations d'un fichier logo.
Logo de navigation web. Les logos de barre de navigation, de pied de page et d'interfaces mobiles s'affichent à des tailles variables selon la densité d'écran. Le SVG s'impose ici : le navigateur dessine les tracés en temps réel, net du pictogramme à la grande bannière de pied de page ; pour changer la couleur, tout se fait dans le fichier ou le code, et le même fichier se transmet tel quel au designer pour la suite.
Avatar social en petit format. Les entrées d'avatar n'acceptent généralement que JPG et PNG : un PNG à fond transparent suffit — quand la plateforme recadre l'avatar en rond ou en carré, aucun bloc blanc n'accompagne le logo. La taille d'affichage des avatars étant limitée, la netteté du bitmap suffit largement ; ce scénario n'a pas besoin de SVG.
Affiches et supports imprimés en grand format. Affiches, roll-up et enseignes de façade agrandissent le logo de dizaines de fois. Le SVG règle le problème à la source : les tracés sont indépendants de la résolution, et la taille de sortie relève de l'usage. Avec un petit PNG seul, l'agrandissement direct donne flou et escaliers de pixels : ce scénario, et lui seul, exige vraiment un fichier vectoriel.
Où se joue la différence entre PNG et SVG
La différence fondamentale tient à la manière d'enregistrer le graphisme. Le PNG utilise une grille de pixels : chaque point porte une couleur, et si grand soit-il, le fichier totalise un nombre fixe de pixels ; au-delà, le logiciel ne peut qu'étirer les pixels existants, et les bords floutent et crénelent. Le SVG décrit le graphisme en tracés et formes : où la ligne commence, comment la courbe s'incurve, quelle couleur remplit la zone ; à l'agrandissement, le logiciel redessine selon ces descriptions, bords toujours lisses.
Le fond transparent existe dans les deux formats, différemment. Le PNG garde les découpes autour du logo par un canal de pixels transparents ; le SVG n'a nativement pas de « fond », le graphisme étant lui-même un ensemble de tracés. L'édition ultérieure marque le vrai partage des eaux : un SVG s'ouvre pour recolorer en bloc, déplacer des points d'ancrage, démonter et recomposer ; un PNG ne se traite que pixel par pixel, et changer un aplat exige une retouche de zone dans un éditeur bitmap.
Le poids du fichier se lit souvent de travers. Graphisme simple : le SVG n'enregistre que quelques tracés, généralement minuscule ; une image riche en dégradés et en bruit, une fois vectorisée, se fragmente en une multitude de tracés et peut dépasser largement le PNG d'origine. « Le SVG est plus léger » est faux ; ce qui est vrai, c'est « le SVG d'un graphisme simple est léger ».
Un tableau scénarios et formats
Le type de visuel décide plus que les paramètres de format. Recommandations pour trois familles d'images de marque :
| Type de visuel | Caractéristiques | Recommandation | Raison |
|---|---|---|---|
| Logo graphique, logotype | Contours nets, aplats limités | Fichier maître SVG, plus un PNG transparent en secours | Tracés propres et éditables : le SVG sert la mise à l'échelle, le PNG couvre les cas sans support SVG |
| Mascotte photo-réaliste | Dégradés continus, ombres riches | Conserver le PNG haute résolution | La vectorisation fragmente en une multitude de tracés, difficiles à éditer, et perd le bénéfice de l'échelle libre |
| Image de marque à textures complexes | Détails nombreux, grain marqué | Bitmap dominant, vectorisation partielle au besoin | La conversion globale coûte plus qu'elle rapporte ; pour plus grand, réexporter d'abord un bitmap haute résolution |
Une règle suffit : plus les contours sont nets et les aplats rares, plus la vectorisation se justifie ; plus l'image s'approche de la photo, plus elle doit rester en bitmap.
Compléter le SVG quand vous n'avez qu'un PNG
Le besoin de SVG confirmé, la conversion ne représente qu'un petit bout du chemin. Importez le PNG dans Image vers vectoriel : l'outil accepte PNG, JPG et WebP, largeur et hauteur d'au moins 256 pixels, une conversion à la fois après connexion, puis téléchargement du SVG. Les captures d'écran de chaque étape — import, vérification, téléchargement — figurent dans le tutoriel de la même série « Comment convertir PNG et JPG en SVG », non repris ici.
La conversion faite, le résultat s'organise selon l'usage. Le panneau de résultat offre des agrandissements 1×, 2×, 4× : avant livraison, examinez la propreté des courbes, des découpes et des traits fins. Deux points à accepter d'avance : le texte devient des tracés de contour, sans retour à la police d'origine éditable — changer un libellé exige une ressaisie dans l'outil de design ; la qualité des bords dépend de l'image source, un PNG très compressé sort aux bords rugueux — reprenez d'une source plus nette, méthodes détaillées dans « Logo vectorisé aux bords rugueux : que faire ».
Composer un pack de fichiers de marque
Formats arrêtés, organisez le logo en un jeu de fichiers nommés : plus aucun aller-retour de demandes, quel que soit le destinataire. Un pack minimal viable ressemble à ceci :
| Fichier | Usage | Exemple de nom |
|---|---|---|
| Fichier maître SVG | Source unique pour le web, les supports, les agrandissements et les éditions futures | acme-logo.svg |
| PNG transparent | Avatars sociaux, documents de bureau et autres entrées bitmap uniquement | acme-logo-transparent.png |
| Aperçu sur fond sombre | Vérifier la lisibilité du logo sur fond foncé | acme-logo-preview-dark.png |
| Aperçu sur fond clair | Vérifier le rendu du logo sur fond clair | acme-logo-preview-light.png |
Nommage : préfixe commun plus suffixe d'usage ; à chaque version, mettez le numéro à jour sans dupliquer sous un nouveau nom, sinon le pack finit par mêler logo-final-2.png et logo-version-finale.png. Les aperçus sur fonds clair et sombre gagnent à partager le même dossier : le destinataire constate d'un coup d'œil si le logo fonctionne sur les deux fonds.
Les fichiers d'impression se traitent à part. Quand l'imprimeur exige un PDF vectoriel, un mode colorimétrique ou des fonds perdus précis, ces fichiers de production relèvent du flux de design : partez du SVG, convertissez et exportez dans le logiciel de design, et validez chaque norme couleur avec l'imprimeur. L'outil Image vers vectoriel livre un SVG, pas un fichier de production print.
Questions fréquentes
Le SVG est-il toujours plus léger que le PNG ?
Non, la taille dépend de la complexité du contenu. Un graphisme simple en SVG n'enregistre que quelques tracés, généralement minuscule ; un bitmap riche en dégradés, ombres et bruit produit en SVG une multitude de fragments, parfois plus lourds que l'original. Le format se choisit sur l'usage et les besoins de mise à l'échelle, pas sur le poids.
Un PNG flou à l'agrandissement doit-il forcément passer en vectoriel ?
Tout dépend de l'avenir de ce logo. Pour un agrandissement ponctuel unique, réexportez un PNG plus résolu ; les mises à l'échelle répétées, les changements de couleur globaux, l'impression ou un fichier maître de marque durable justifient le SVG. Un logo photo-réaliste ne gagne, même converti, que des tracés fragmentaires inéditables : le bitmap haute résolution reste plus réaliste.
Que faire quand l'imprimeur réclame un PDF ?
Suivez les exigences de l'imprimeur dans le flux de design : ouvrez le fichier maître SVG dans le logiciel de design, exportez au type de PDF demandé, et validez un à un mode colorimétrique, fonds perdus et autres paramètres. L'outil Image vers vectoriel sort du SVG ; le PDF de production print se fabrique à l'étape de design.
N'ayant qu'un PNG, commencez par ajouter le SVG
Commencez par le manquant du pack : avec seulement une version PNG, ajoutez d'abord un SVG via Image vers vectoriel, contrôlez-le dans les aperçus sur fonds clair et sombre, puis décidez s'il devient le fichier maître. Cette étape faite, les trois scénarios — site, avatar, affiche — disposent chacun de son format.
