Smartcat Website Translator : ses fonctionnalités et son fonctionnement

Le Website Translator de Smartcat est un outil de localisation basé sur des scripts qui traduit votre site web sans modifier le CMS, le backend ou le code source.

Au lieu de créer des versions linguistiques distinctes d'un site avec plusieurs URL, cette solution agit directement sur la page affichée dans le navigateur. Il suffit d'ajouter un petit bout de code JavaScript au site, de choisir les langues cibles, et vos pages sont traduites et proposées automatiquement aux visiteurs internationaux.

Le contenu traduit est stocké sur un CDN et s'affiche de manière dynamique lorsque les visiteurs chargent le site.

Comme la traduction s'effectue directement sur le site web mis en ligne plutôt qu'au niveau du backend, elle peut généralement être mise en place sans intervention technique majeure. En résumé, grâce à Smartcat, les équipes chargées du contenu et du marketing peuvent se charger elles-mêmes de la traduction.

La traduction proposée par Smartcat revient à - traduire ce que les utilisateurs voient dans leur navigateur.

Lorsqu'un utilisateur se rend sur votre site, son navigateur affiche la page à partir des fichiers HTML, CSS et JavaScript, qui, ensemble, constituent le résultat visuel final.

Cette page affichée est constituée d'une structure appelée DOM ( Document Object Model ), et c'est sur cette structure que travaille le traducteur.

Un petit bout de code JavaScript ajouté au site s'exécute au chargement de la page. Il détecte les paramètres linguistiques du visiteur, récupère les traductions correspondantes depuis le CDN de Smartcat et remplace le texte affiché sur la page. Les utilisateurs peuvent changer de langue manuellement, et leur choix reste enregistré lorsqu'ils naviguent sur le site.

Étant donné que l'ensemble du système de traduction fonctionne au niveau du navigateur, la pile technique du site web n'a ici aucune importance. Que le site soit construit avec WordPress, Shopify, Webflow, des interfaces React ou même d'anciens systèmes hérités. Tant que le site s'affiche dans un navigateur, le traducteur fonctionne.

Le script ne s'arrête pas non plus une fois la page chargée initialement. Les sites web modernes ne chargent pas tout dès le début. Des fenêtres modales peuvent s'afficher après un clic, des menus déroulants peuvent se remplir à partir d'API et/ou des messages de validation peuvent apparaître après l'envoi d'un formulaire.

Ainsi, au lieu de parcourir la page une seule fois puis de s'arrêter, le script surveille en permanence l'apparition de nouveaux nœuds de texte dans le DOM et les traduit au fur et à mesure de leur affichage.

La procédure d'installation de Smartcat est plus rapide que vous ne le pensez.

Un projet démarre dès que vous saisissez l'URL du site et sélectionnez les langues cibles. Smartcat génère alors une version de prévisualisation du site au sein de sa propre interface en mettant en proxy les pages rendues et en les traduisant.

Ensuite, l'équipe chargée du contenu peut reviser les pages traduites, y apporter des modifications et valider la version finale.

Une fois les traductions validées, Smartcat les publie sous forme de fichiers JSON légers sur son CDN. Il vous suffit ensuite d'ajouter un simple extrait de code JavaScript dans l'en-tête de la page de votre site web pour que la traduction s'affiche sur le site en ligne.

À partir de là, chaque fois qu'un utilisateur se rend sur le site, le contenu traduit est récupéré depuis le CDN et proposé au visiteur dans la langue de son choix.

Vous pouvez consulter le guide d'installation étape par étape ici.

L'architecture de Smartcat offre plusieurs avantages clés par rapport aux méthodes de traduction traditionnelles. Parmi ceux-ci, on peut citer :

L'un des principaux inconvénients des outils traditionnels de traduction de sites web réside dans leur champ d'application. Le contenu de la page d'accueil est traduit, mais ce n'est souvent pas le cas des éléments interactifs.

Les formulaires restent dans la langue d'origine, les verbes modaux apparaissent tels quels, et les menus déroulants ainsi que les messages de validation ne sont pas traduits. Pour un visiteur, le site semble n'être traduit que partiellement.

Comme le traducteur de Smartcat travaille directement sur le DOM rendu, il peut prendre en compte le contenu qui s'affiche après le chargement initial de la page. Cela inclut les éléments d'interface utilisateur générés dynamiquement, tels que les fenêtres modales, les pop-ups, les notifications, les menus déroulants et tous les composants générés par des frameworks JavaScript une fois que la page est interactive.

Ainsi, au lieu de traduire un instantané statique de la page, le script surveille en permanence l'apparition de nouveau texte dans l'interface et le traduit au fur et à mesure de son affichage.

Smartcat fournit les traductions publiées via un CDN plutôt que directement depuis ses serveurs.

Ainsi, les ressources de traduction sont légères, mises en cache et diffusées à partir de serveurs périphériques proches du visiteur, ce qui permet une diffusion rapide, même sur les grands sites multilingues.

Cela signifie également résilience. Une fois les traductions publiées, elles continuent de fonctionner même si Smartcat est hors service et temporairement indisponible.

Le système n'exige pas non plus que toutes les pages soient traduites dès le départ.

Lorsqu'un visiteur accède à un contenu non traduit, le script peut générer la traduction à la demande, la mettre en cache et la réutiliser lors des visites suivantes. Ainsi, chaque visiteur suivant obtient instantanément la version mise en cache. Smartcat appelle ce mécanisme « crowding »

Le seul inconvénient réside dans un léger coût de latence, c'est-à-dire un délai de traduction, lors des premières visites sur du contenu nouveau ou mis à jour.

Smartcat prend en charge plusieurs fournisseurs de traduction, notamment Google, DeepL, Gemini, ChatGPT, Claude, Apple, Amazon et Microsoft, et utilise son algorithme pour sélectionner le meilleur pour chaque paire de langues.

Les sites web utilisent souvent une terminologie spécifique, des noms propres à certaines marques et un jargon propre au secteur, qui doivent être réutilisés de manière cohérente. Ces termes risquent souvent de se perdre dans la traduction.

Smartcat prend en charge les mémoires de traduction et vous permet de réutiliser certains termes de manière cohérente d'une langue à l'autre. Vous pouvez également affiner la traduction en fournissant des instructions personnalisées aux moteurs LLM concernant le ton et le style.

Les sites web comportent des sections récurrentes, telles que les en-têtes, les pieds de page, les menus de navigation et les bannières, qui apparaissent sur toutes les pages.

L'attribut st-shared-section permet aux équipes de définir des sections partagées afin que les éléments récurrents soient traduits une seule fois et réutilisés de manière cohérente partout.

Au-delà du corps du texte visible, Smartcat offre également la possibilité de traduire les éléments qui ont une incidence sur le référencement.

Les métadonnées du site, telles que les titres de page, les descriptions, les attributs alt des images, le texte de remplacement, les étiquettes ARIA et les balises hreflang, sont également traduites.

Certains sites web peuvent contenir des informations personnelles ou sensibles qui ne doivent pas être traitées dans le cadre de la traduction.

Pour remédier à cela, Smartcat permet aux propriétaires de sites d'exclure explicitement certaines sections de la page de la traduction.

Les éléments marqués de l'attribut st-ignore sont entièrement ignorés par le système de traduction, ainsi que leur contenu. Cela permet aux équipes d'isoler les données de compte, les informations de paiement, les outils internes ou d'autres zones sensibles de l'interface des workflows de traduction.

Les sites qui souhaitent exercer un contrôle plus strict sur le traitement des données peuvent également désactiver complètement la traduction à la demande et s'appuyer uniquement sur des ressources de traduction pré-publiées.

Tout modèle de traduction comporte des compromis. L'approche basée sur des scripts de Smartcat présente plusieurs avantages, que nous avons évoqués plus haut, mais elle comporte également des contraintes, liées principalement à l'environnement du navigateur dans lequel elle s'exécute.

L'un des principaux obstacles réside dans les iframes interdomaines.

Si un site intègre un outil de réservation tiers, un formulaire de paiement, des outils de planification intégrés ou des widgets externes, les règles de sécurité du navigateur empêchent le script d'accéder au contenu situé à l'intérieur.

Cette limitation s'applique à tout système de traduction basé sur un navigateur. La seule solution consiste à installer séparément un script de traduction à l'intérieur de l'iframe, ce qui n'est possible que si vous contrôlez également la source intégrée.

La mise en page constitue un autre cas particulier courant, notamment pour les langues s'écrivant de droite à gauche (RTL) comme l'arabe ou l'hébreu. Smartcat peut inverser le sens de lecture de la page en utilisant la prise en charge native RTL du navigateur, mais il ne peut pas réécrire le CSS du site.

Les mises en page basées sur des conteneurs à largeur fixe, un positionnement codé en dur ou des hypothèses concernant l'alignement à gauche ou à droite présentent souvent des dysfonctionnements lorsque le texte traduit est plus long ou que l'interface est inversée.

Le même problème se pose avec l'expansion de texte dans des langues telles que l'allemand ou le français. L'éditeur contextuel permet de mettre en évidence ces problèmes lors de la révision, mais la correction de la mise en page sous-jacente dépasse ici les capacités de Smartcat. C'est au propriétaire du site web ou à l'équipe technique de corriger la mise en page.

Lorsqu'un visiteur accède à un contenu qui n'a pas encore été traduit, le système génère et met en cache la traduction avant de l'afficher.

Les visiteurs suivants obtiennent immédiatement la version mise en cache, mais la première visite peut entraîner un léger délai.

Les systèmes de protection contre les bots, tels que Cloudflare, bloquent parfois le chargement de l'aperçu de Smartcat lors de la configuration, car les requêtes proviennent d'adresses IP AWS et ressemblent à du trafic automatisé. Pour résoudre ce problème, il suffit d'ajouter les adresses IP statiques de Smartcat à la liste blanche.

Les applications monopages développées à l'aide de frameworks tels que React peuvent parfois rencontrer des conflits d'affichage si la structure HTML traduite n'est pas correctement préservée.

Les extensions de navigateur qui injectent du contenu dans le DOM peuvent également générer du bruit que la couche de traduction tente de traiter. Smartcat dispose de filtres pour les extensions connues et d'une fonctionnalité de détection de la langue source afin d'atténuer ce problème.

Smartcat Website Translator n'est pas adapté à tous les sites web.

Cette solution est particulièrement utile pour les équipes qui doivent prendre en charge plusieurs langues sans avoir à refondre leur infrastructure existante.

Il peut s'agir de produits SaaS destinés à une clientèle internationale, de sites web riches en contenu, ou encore d'entreprises qui se développent sur de nouveaux marchés sans souhaiter que la localisation soit subordonnée aux cycles de déploiement technique.

Pour les petits sites ne comptant qu'une poignée de pages ou proposant une ou deux langues cibles, un plugin CMS plus simple ou un processus manuel suffit souvent.

Les avantages d'un système de traduction au niveau du navigateur tel que Smartcat apparaissent clairement à mesure que le volume de contenu, le nombre de langues et la fréquence des mises à jour augmentent.

Alors, si vous cherchez un outil de traduction pour votre site web et que vous souhaitez éviter les tracas liés à la modification du code ou à la gestion des URL en double, découvrez le Smartcat Website Translator .