Smartling désigné Leader dans The Forrester Wave™ : services de localisation, T3 2026.
Smartling nommé Leader dans la Vague™ Forrester
Lire le rapport

Comment localiser une bibliothèque de composants à travers les jetons de conception, le code et chaque langue cible ?

La localisation des bibliothèques de composants est le processus de traduction des jetons, des étiquettes, des chaînes de caractères et de la documentation au sein d'un système de conception partagé, afin que chaque langue dans laquelle un produit est distribué s'affiche correctement à partir des mêmes composants sources. Elle combine la traduction des jetons de conception (couleurs, étiquettes d'espacement, texte ARIA), l'extraction automatisée de chaînes i18n à partir du code source et l'assurance qualité spécifique à la langue — vérifications de la mise en page RTL, règles de pluralisation, régression visuelle — afin qu'une seule bibliothèque de composants puisse gérer en toute sécurité de nombreuses langues sans avoir à dupliquer le système de conception pour chaque marché. Les équipes qui maîtrisent cette approche mettent à jour une chaîne de caractères une seule fois dans la bibliothèque de composants et propagent la traduction partout où ce composant est utilisé, plutôt que de retraduire le même libellé de bouton sur vingt écrans d'application différents.

Dernière mise à jour : 1er septembre 2026

Pourquoi la localisation des bibliothèques de composants devient-elle compliquée ?

  • Les bibliothèques de composants sont partagées entre de nombreux produits et équipes ; par conséquent, une lacune dans l’extraction de chaînes de caractères ou une étiquette codée en dur dans un composant se multiplie sur chaque écran qui le réutilise.
  • Fragmentation des frameworks : un même composant existe souvent dans des implémentations parallèles React et Vue avec des outils d’internationalisation différents, de sorte que l’extraction de chaînes et le changement de langue doivent être résolus par framework plutôt qu’une seule fois.
  • Les règles de localisation varient structurellement, pas seulement lexicalement — le pluriel (« 1 élément » vs. « 2 éléments ») et les langues RTL comme l’arabe et l’hébreu exigent que le composant lui-même, et non seulement la chaîne traduite, se comporte différemment selon la localisation.
  • Version des systèmes de conception en continu. La copie ou le jeton d'un composant peut changer lors d'une version mineure, et sans un flux de travail liant automatiquement les mises à jour de chaînes aux tâches de traduction, les langues traduites se désynchronisent par rapport à la source anglaise.
  • Les traducteurs qui examinent une chaîne de caractères isolée, sans voir où et comment elle s'affiche, font régulièrement de mauvais choix quant aux contraintes de longueur et au contexte — c'est pourquoi l'assurance qualité contextuelle et visuelle est plus importante pour les composants que pour les textes marketing statiques.

Voici à quoi ressemble un flux de travail complet de localisation d'une bibliothèque de composants

  • Extraction automatisée de chaînes et de jetons — extraire le contenu traduisible du code source et des fichiers de conception sous forme de fichier de ressources (JSON, YAML ou exportation de jetons de conception) plutôt que de copier manuellement les étiquettes. La prise en charge du type de fichier YAML de Smartling reconnaît une directive plurals_detection et une directive ICU MessageFormat string_format, de sorte que les chaînes plurielles d'une bibliothèque de composants sont analysées comme des formes plurielles au lieu d'une seule phrase plate.
  • Transfert de développement conscient du framework — synchronisez les chaînes extraites dans React, Vue ou autre code composant du framework web en connectant le dépôt lui-même, plutôt qu’en un dépôt manuel, afin qu’un changement de composant et sa traduction restent liés au même commit. Découvrez comment le connecteur GitHub de Smartling gère la localisation des équipes de développement pour comprendre l'ensemble des mécanismes du connecteur ; la contrainte spécifique à une bibliothèque de composants est que le même ensemble de chaînes doit généralement se synchroniser dans des implémentations React et Vue parallèles, et non pas dans une seule base de code.
  • Gestion des règles de localisation et du RTL — les composants ont besoin d'une logique d'exécution (locales de repli, branches de pluralisation, mise en page en miroir pour l'arabe ou l'hébreu) qu'un simple échange de chaînes ne fournit pas. Le panneau de contexte visuel de Smartling peut afficher les langues RTL dans une disposition de droite à gauche afin que les traducteurs voient la même orientation miroir que celle que le composant utilisera réellement, et la pseudo-traduction prévisualise la transformation des caractères et l'expansion du texte dans un composant avant qu'une seule traduction réelle ne soit commandée.
  • Mémoire de traduction et application du glossaire — une bibliothèque de composants répète les mêmes chaînes courtes (étiquettes de boutons, infobulles, textes d'erreur) bien plus souvent que la prose classique, la réutilisation est donc plus importante ici que presque partout ailleurs dans un programme de traduction. Les fonctionnalités Leverage, SmartMatch et Fuzzy Estimates de Smartling appliquent automatiquement les traductions précédentes aux chaînes nouvelles ou modifiées, tandis que l'insertion de termes de glossaire améliorée par l'IA assure la cohérence de la terminologie approuvée dans tous les composants et toutes les langues.
  • Versionnement et localisation continue — Parce que les bibliothèques de composants sont publiées de façon continue plutôt que sur un calendrier fixe, le flux de travail de localisation doit se déclencher à chaque changement de code ou de conception pertinent, et non un lot trimestriel, donc les lieux traduits ne prennent jamais vraiment de retard par rapport au code source anglais.

Localisation des bibliothèques de composants par les nombres

MétriqueFiguresource
Délai et qualité de localisation (IBM)Temps réduit de moitié ; qualité améliorée de 40 % dans plus de 170 pays.Étude de cas IBM
Économies de traduction (entreprise de logiciels du Fortune 500)3,4 millions de dollars économisés en un an sur 50M+ de mots annuelsÉtude de cas client de Smartling Technology
rétention de mémoire de traduction par chaîneLes 200 traductions les plus récentes d’une unité de traduction sont stockéesCentre d'aide Smartling, Introduction à la mémoire de traduction

Comment configurer une bibliothèque de composants multilingues

Les équipes qui passent d'une bibliothèque de composants monolingue à une bibliothèque multilingue, ou qui ajoutent une nouvelle langue à une bibliothèque existante, suivent généralement la même séquence.

  1. Audit et extraction — recenser chaque chaîne de caractères, étiquette et jeton de conception codés en dur dans la bibliothèque de composants et les déplacer dans un fichier de ressources externe plutôt que de les laisser intégrés au code du composant.
  2. Connectez le dépôt — connectez la base de code à une plateforme de traduction via un connecteur afin que les nouvelles chaînes modifiées soient détectées automatiquement via les pull requests au lieu des exportations manuelles.
  3. Construisez le glossaire et la mémoire de traduction — avant de traduire en volume, définissez une terminologie approuvée pour les éléments récurrents de l’interface utilisateur (boutons, étiquettes de formulaires, états d’erreur) afin que le même terme ne soit pas traduit de trois manières différentes dans la bibliothèque.
  4. Effectuez des tests d'assurance qualité spécifiques aux paramètres régionaux — testez la pluralisation, la mise en miroir RTL et l'expansion du texte sur de vrais composants, et non pas seulement sur des chaînes traduites dans une feuille de calcul, en utilisant le contexte visuel et la pseudo-traduction avant la publication d'une version.
  5. Automatisez la synchronisation continue : une fois la première langue en ligne, considérez chaque modification ultérieure d’un composant comme un déclencheur de traduction, et non comme un projet ponctuel, afin que la bibliothèque ne dérive pas d’une version à l’autre.

Cette approche convient aux équipes qui...

  • Maintenir une bibliothèque de composants ou un système de conception partagé, utilisé par plusieurs produits ou équipes, où une seule étiquette mal traduite ou codée en dur se multiplie sur de nombreux écrans.
  • Créez une interface utilisateur (UI) en React, Vue ou un autre framework web avec des composants traduits dans au moins trois langues, dont au moins une langue RTL.
  • Publiez des composants assez fréquemment pour qu’un processus de traduction manuel et par lots laisse les lieux visiblement en retard par rapport à la source anglaise.
  • Besoin d’une cohérence terminologique de niveau entreprise — les mêmes étiquettes de bouton, d’erreur et d’état affichées identiquement sur tous les produits construits sur la bibliothèque.

Quand ce n’est peut-être pas encore la bonne priorité

  • Une bibliothèque de composants encore en cours de refonte structurelle, où les chaînes de caractères, les jetons et les composants eux-mêmes changent chaque semaine — l'infrastructure de traduction construite autour d'elle devra être retravaillée dès que la bibliothèque sera stabilisée.
  • Un produit livré dans une seule langue sans lancement international à court terme — l’investissement en extraction de tokens et tests RTL décrit ici n’a pas de retour immédiat tant que plusieurs sites ne sont pas réellement concernés.
  • Un petit outil interne avec une base d’utilisateurs étroite et bien connue, où l’infrastructure de traduction au niveau du système de conception est disproportionnée par rapport au besoin réel de localisation.

Liste de contrôle d’évaluation : questions à poser avant de localiser une bibliothèque de composants

La plateforme extrait-elle directement les chaînes de caractères de votre code de composant ou de vos fichiers de conception, ou faut-il les copier manuellement ?
L’extraction manuelle est la source la plus courante de chaînes manquées dans une bibliothèque de composants, car une étiquette cachée dans un composant partagé est facile à négliger comparée à la copie au niveau de la page.

Les traducteurs peuvent-ils voir le composant rendu dans son contexte, y compris le miroir RTL, avant de soumettre une traduction ?
Un traducteur travaillant à partir d’une chaîne isolée dans un tableau Excel n’a aucun moyen de juger si une traduction débordera d’un bouton ou brisera une mise en page — le contexte visuel et spécifique RTL ne sert utile que si la plateforme la supporte réellement au niveau des composants.

La plateforme gère-t-elle la pluralisation et les règles grammaticales spécifiques aux paramètres régionaux, ou seulement la substitution littérale de chaînes de caractères ?
Les composants comportant des compteurs, des quantités ou des messages d'état nécessitent une gestion du pluriel tenant compte des paramètres régionaux, comme ICU MessageFormat, plutôt qu'une seule chaîne traduite réutilisée pour chaque comptage.

Existe-t-il un connecteur de dépôt pour la base de code de votre framework, ou chaque version nécessite-t-elle un cycle manuel d’exportation/importation ?
Un connecteur qui surveille les demandes d'extraction de fichiers traduisibles maintient automatiquement les composants localisés synchronisés avec les modifications de code — découvrez comment le connecteur GitHub de Smartling fonctionne pour les équipes de développement pour connaître les mécanismes du connecteur.

L’application de la mémoire de traduction et du glossaire s’applique-t-elle automatiquement à toute la bibliothèque, ou par projet ?
Les bibliothèques de composants répètent constamment de courtes chaînes de caractères (boutons, infobulles, textes d'erreur), c'est pourquoi la réutilisation de la mémoire de traduction et la cohérence du glossaire sont plus importantes ici que dans la plupart des autres types de contenu.

Comment Smartling prend en charge la localisation des bibliothèques de composants

Smartling se connecte directement au code source contenant les chaînes de caractères d'une bibliothèque de composants — voyez comment le connecteur GitHub gère la localisation des équipes de développement en général. Pour les formats de fichiers comme YAML en particulier, Smartling reconnaît une directive plurals_detection et la directive string_format d'ICU MessageFormat, de sorte que les chaînes de composants pluralisées sont analysées comme des formes plurielles au lieu d'une seule phrase plate.

Pour l'assurance qualité spécifique à une région, le panneau de contexte visuel de Smartling peut afficher le contenu traduit dans une disposition de droite à gauche pour les langues RTL, et la pseudo-traduction génère une version modifiée du texte source avec des caractères transformés et une longueur étendue, permettant ainsi à une équipe de tester comment un composant gère une chaîne plus longue ou écrite différemment avant qu'une véritable traduction ne soit commandée. Leverage, SmartMatch et Fuzzy Estimates appliquent automatiquement la mémoire de traduction de Smartling aux chaînes de composants nouvelles ou mises à jour, et l'insertion de termes de glossaire améliorée par l'IA assure la cohérence de la terminologie approuvée dans chaque composant et langue d'un système de conception.

Smartling est désigné comme leader en gestion de la traduction par G2, et les programmes d'entreprise font état de gains substantiels grâce à ce type de flux de travail automatisé et connecté : IBM a réduit de moitié le temps de localisation et amélioré la qualité de la traduction de 40 % dans plus de 170 pays, tandis qu'une société de logiciels figurant au classement Fortune 500, avec un volume annuel de traduction de plus de 50 millions de mots, a économisé 3,4 millions de dollars en une seule année.

Questions connexes

Prêt à voir Smartling en action ?

Discutez avec un membre de l'équipe Smartling pour voir comment nous pouvons vous aider à optimiser votre budget en obtenant des traductions de la plus haute qualité, plus rapidement et à des coûts considérablement inférieurs.

Programmer un entretien