Pourquoi la police de ton SVG change après export ou import

La police de ton SVG change parce que le texte éditable nomme généralement une police sans intégrer automatiquement la forme de ses lettres. Si le navigateur, l’éditeur, le logiciel de découpe ou l’ordinateur du destinataire ne peut pas utiliser cette police, il choisit un remplacement. Les largeurs de glyphes différentes changent alors retours à la ligne, alignement et position des éléments voisins.

Deux stratégies de livraison sont fiables. Garde le texte éditable lorsque la destination nécessite des mots sélectionnables, recherchables ou modifiables et que tu peux fournir correctement la police. Convertis en contours vectoriels lorsque l’apparence doit rester fixe et que la formulation n’a plus besoin de changer. Dans les deux cas, garde un fichier maître modifiable séparé.

Pour un export PNG automatique, charge explicitement les polices dans resvg et compare les lettres rendues à la source avant livraison.

Pour les figures de documents, compare illustrations SVG et étiquettes composées dans LaTeX. Séparer la géométrie du texte permet au document de composer les mots tout en conservant le fichier maître SVG.

Détermine d’abord si le SVG contient encore du texte

L’extension ne répond pas à cette question. SVG peut représenter les lettres au moins de deux façons :

<text font-family="Example Sans" font-weight="600">Sample</text>

C’est du texte éditable. Le SVG stocke caractères et instructions de style. Le moteur doit trouver une police correspondante pour produire les glyphes visibles.

Le texte converti en tracés ressemble plutôt à ceci :

<path d="M ... Z" />

Chaque lettre est ici devenue une géométrie vectorielle. Le destinataire n’a pas besoin de la police, mais le mot n’est plus une chaîne de texte ordinaire modifiable.

Tu peux vérifier sans comprendre tout le balisage :

1. fais une copie du SVG ;
2. ouvre-la dans un éditeur de texte brut ;
3. cherche <text et <tspan ;
4. cherche le nom visible de la police ;
5. s’ils sont absents, vérifie si les lettres sont des éléments <path>.

Dans un éditeur vectoriel, utilise l’outil texte et clique sur une lettre. Un curseur clignotant indique du texte éditable. Des nœuds autour de chaque glyphe indiquent des contours.

Trois états typographiques

Cause 1 : la police prévue n’est pas installée

L’attribut SVG font-family est une liste ordonnée de noms de familles. Comme l’explique la référence font-family de MDN, le moteur choisit dans cette liste. Sans correspondance pour la première famille, il passe à la suivante et finalement à une famille générique comme sans-serif ou serif.

Cela arrive souvent lorsque :

• le designer utilise une police locale que le destinataire ne possède pas ;
• une police est activée par un abonnement sur une seule machine ;
• le SVG passe d’un éditeur desktop à un téléphone, tablette, application de découpe ou suite bureautique ;
• le nom interne de la famille diffère du nom de fichier ou du nom affiché dans le dossier téléchargé ;
• un seul style est installé tandis que le SVG demande une autre graisse ou une variante italique.

Installer « quelque chose de similaire » ne restaure pas la mise en page. Deux polices sans empattement peuvent avoir des largeurs de lettres, hampes ascendantes, crénages et métriques de ligne de base différents. Le remplacement peut sembler proche tout en déplaçant un mot centré. Une fois la bonne police disponible, l’exemple d’alignement vertical du texte SVG aide à distinguer ligne de base, boîte de texte et centrage visuel.

Cause 2 : la police web attendue ne s’est pas chargée

Un SVG dans une page peut recevoir les polices de son CSS. Il peut aussi inclure un bloc de style @font-face ; SVG 2 exige la prise en charge des polices téléchargeables via CSS Fonts. Cela échoue si l’URL est incorrecte, le fichier non déployé, l’accès bloqué, le format non pris en charge ou le SVG ouvert seul plutôt que dans la page fournissant ses styles.

Utilise les outils de développement et recharge. Dans Network, filtre les polices et cherche les requêtes échouées. Dans les styles calculés de <text>, confirme la police réellement rendue plutôt que le seul nom déclaré.

Un SVG fonctionnant seulement dans un site n’est pas forcément autonome. Teste directement l’export dans une fenêtre privée et sur un autre appareil pour révéler les dépendances à un service connecté, une police en cache ou une feuille de style.

Intégrer une ressource de police peut faciliter le transport, mais augmente la taille, peut rencontrer des limites propres aux applications et nécessite l’autorisation de la licence. Vérifie la licence réelle plutôt que de supposer qu’une licence desktop autorise la redistribution des données de police.

Cause 3 : famille ou graisse ne correspondent pas exactement

La correspondance CSS utilise plus que le nom visible. Le SVG peut demander :

font-family: "Example Sans";
font-style: normal;
font-weight: 600;

Si seuls les fichiers 400 et 700 sont disponibles, le moteur peut synthétiser la graisse ou choisir une variante proche. Les polices variables ajoutent axes et noms d’instances interprétés différemment selon l’application. Les anciens logiciels de design ou découpe peuvent ignorer certaines fonctions OpenType, ligatures ou variations.

Compare le document original et le SVG :

• nom exact de famille ;
• style et graisse numérique ;
• espacement des lettres ;
• capitalisation et caractères réels ;
• fonctions OpenType comme les ligatures ;
• valeurs d’axes de police variable ;
• comportement sur tracé ou vertical.

Ne corrige pas une mauvaise famille en redimensionnant chaque mot manuellement. Cela masque le symptôme en gardant les mauvais glyphes.

Cause 4 : l’export garde le texte, mais l’application l’interprète autrement

La disposition du texte SVG n’est pas celle d’un document de publication desktop. L’exporteur peut utiliser des <tspan> imbriqués, coordonnées individuelles, text-anchor ou <textPath>. L’application peut aplatir, regrouper ou réinterpréter ces fonctions. Pour reconstruire un badge, le guide de texte SVG modifiable sur tracé sépare emblème, courbe guide et lettres pour tester chacun.

Pour placer des illustrations dans des documents, suis la procédure de figures et dessins SVG dans Typst. Garder les légendes comme texte natif permet de vérifier les lettres de l’illustration séparément de la numérotation et typographie des paragraphes.

La documentation actuelle d’export SVG d’Adobe indique que le texte sur tracé peut ne pas rester visuellement identique dans tous les visualiseurs. Elle distingue aussi le texte conservé avec sa police de Convert To Outlines, transformant le texte en tracés pour préserver l’apparence.

Si la bonne police est présente mais que le placement change, examine la structure plutôt que de changer de police :

1. compare le navigateur à l’éditeur source ;
2. vérifie si chaque caractère a sa propre position x ;
3. examine les transformations imbriquées du groupe texte ;
4. vérifie la suppression éventuelle de text-anchor, du crénage ou des réglages de ligne de base ;
5. teste une copie avec un texte horizontal simple pour isoler le comportement sur tracé.

Pour un logo, badge ou titre d’une ligne dont l’apparence compte plus que la modification, les contours sont généralement plus sûrs.

Cause 5 : tu as converti le texte et le croyais encore éditable

Le texte en tracés ne subit aucun remplacement de police puisqu’il n’en référence plus. Il peut toutefois surprendre à l’importation :

• les lettres peuvent être des tracés composés plutôt qu’un mot éditable ;
• les évidements peuvent se remplir si un tracé composé est libéré ;
• de nombreux glyphes peuvent être regroupés ;
• une application limitée peut fusionner ou simplifier les tracés ;
• le fichier peut être plus lourd que la version texte.

Ce sont des changements de géométrie et de modification, pas de police. Si les formes correspondent, l’export a fait son travail.

Garde toujours deux fichiers :

• Fichier maître modifiable : texte éditable, informations originales des polices, calques nommés et format de l’application source.
• Copie de livraison : SVG, EPS ou PDF en tracés pour une apparence critique.

Ne convertis jamais l’unique fichier maître. Correction, traduction ou nouveau slogan deviennent un redessin lent une fois le texte transformé en tracés.

Quelle correction choisir ?

La destination décide du compromis. Le texte conserve sens et modification ; les contours conservent l’apparence. Un seul fichier ne maximise pas les deux sans dépendances ou données supplémentaires.

Procédure prudente de conversion en tracés

Pour une livraison à apparence critique :

1. enregistre la source avec texte éditable ;
2. duplique-la et ajoute -outlined ou -delivery au nom ;
3. sélectionne le texte et utilise Create Outlines, Convert to Curves, Object to Path ou l’équivalent ;
4. examine trous et chevauchements ;
5. exporte SVG ;
6. ouvre-le dans un navigateur et un deuxième éditeur ;
7. compare à taille normale et fort zoom à la source ;
8. envoie le fichier en tracés et archive le maître et les informations de licence.

Ne rastérise pas le texte seulement pour éviter une police manquante. Un PNG dans SVG empêche le remplacement mais supprime la géométrie redimensionnable. Les contours gardent de vrais vecteurs.

Si seul un logo matriciel reste

Parfois, ni texte éditable ni maître en tracés ne survivent. Il peut ne rester qu’un petit PNG, JPG ou une capture. Le guide de décision de vectorisation des logos explique quand vectoriser ou redessiner. Installer des polices ne répare pas le matriciel et une police similaire peut ne pas reproduire les lettres personnalisées.

PerfectVector peut alors aider sous conditions : la vectorisation de logos reconstruit les lettres visibles en formes vectorielles. Le résultat est un dessin en tracés, pas du texte récupéré. Il n’identifie pas la police originale, ne restaure pas le crénage et ne rend pas les mots saisissables. Utilise-le pour retrouver la géométrie visible, séparément de tout nouveau maître recomposé.

Pour la stratégie générale de transmission, le guide des formats de logo indique les formats maîtres et livrables à conserver.

FAQ

Pourquoi mon SVG utilise-t-il une autre police sur un autre ordinateur ? Il contient probablement un texte nommant une police indisponible. Le moteur choisit une autre famille dans la liste de remplacement, changeant formes, largeurs, espacements et parfois alignement.

Un SVG intègre-t-il automatiquement sa police ? Non. Il peut nommer une police, la recevoir du CSS ou inclure une ressource, mais le texte ordinaire ne fournit pas automatiquement le fichier de police desktop. Disponibilité, prise en charge et licence restent à gérer.

Faut-il convertir le texte SVG en tracés ? Convertis une copie lorsque l’apparence doit rester fixe, notamment logos, lettres décoratives, impression et fabrication. Garde le texte éditable dans le maître si formulation, accessibilité, recherche ou localisation comptent.

Pourquoi le texte en contours est-il devenu non éditable à l’importation ? La conversion remplace les caractères par des tracés. Le destinataire peut modifier nœuds et formes, mais ne peut placer un curseur ou changer la police. C’est attendu : conserve et partage un maître avec texte éditable pour de futurs changements.

PerfectVector peut-il récupérer la police originale d’un logo matriciel ? Non. Il peut reconstruire les lettres visibles en contours, sans identifier la police ni restaurer caractères, crénage et réglages. Utilise-le si l’objectif est la géométrie visible du logo.

Sources

1. W3C — Texte SVG — Contenu <text> et <tspan>, propriétés de police, disposition et polices téléchargeables.
2. W3C — CSS Fonts Module Level 3 — Correspondance des familles, variantes, familles absentes et remplacement système.
3. MDN — SVG font-family — Listes ordonnées et familles génériques.
4. Adobe Illustrator — Créer du texte en tracés — Conversion et perte de modification du texte.
5. Adobe Illustrator — Enregistrer un dessin — Export texte SVG, contours et limites du texte sur tracé.

Si un maître perdu ne laisse qu’un logo matriciel, reconstruis ses lettres visibles en contours avec PerfectVector, puis vérifie dans un deuxième éditeur. Si le texte éditable existe, corrige la dépendance de police ou convertis une copie plutôt que de le revectoriser.