Smartcat Website Translator: do czego służy i jak działa

Tłumacz stron internetowych Smartcat to oparte na skryptach narzędzie do lokalizacji, które tłumaczy Twoją stronę internetową bez zmiany systemu CMS, zaplecza lub kodu źródłowego.

Zamiast tworzyć osobne wersje językowe witryny z wieloma adresami URL, rozwiązanie to działa bezpośrednio na stronie wyświetlanej w przeglądarce. Wystarczy dodać do witryny niewielki fragment kodu JavaScript, wybrać języki docelowe, a strony zostaną automatycznie przetłumaczone i udostępnione międzynarodowym użytkownikom.

Przetłumaczona treść jest przechowywana w sieci CDN i wyświetlana dynamicznie w momencie, gdy użytkownicy wchodzą na stronę.

Ponieważ tłumaczenie odbywa się na już wygenerowanej stronie internetowej, a nie na poziomie zaplecza, zazwyczaj można je wdrożyć bez większego zaangażowania inżynierów. Krótko mówiąc, dzięki Smartcat tłumaczeniem mogą zająć się zespoły ds. treści i marketingu.

Tłumaczenie Smartcat sprowadza się do tego, by – przetłumaczyć to, co użytkownicy widzą w swojej przeglądarce.

Kiedy ktoś odwiedza Twoją stronę, jego przeglądarka wyświetla ją na podstawie kodów HTML, CSS i JavaScript, które razem tworzą ostateczny wygląd strony.

Ta wyświetlona strona istnieje jako struktura zwana DOM ( Model obiektowy dokumentu ), i właśnie z tym pracuje tłumacz.

Krótki fragment kodu JavaScript dodany do witryny uruchamia się po załadowaniu strony. Wykrywa on ustawienia językowe użytkownika, pobiera odpowiednie tłumaczenia z sieci CDN Smartcat i zastępuje nimi widoczny tekst na stronie. Użytkownicy mogą ręcznie zmieniać język, a wybrane ustawienia pozostają aktywne podczas poruszania się po witrynie.

Ponieważ cały system tłumaczenia działa na poziomie przeglądarki, nie ma tu znaczenia, na jakich technologiach opiera się zaplecze strony internetowej. Niezależnie od tego, czy strona została zbudowana przy użyciu WordPressa, Shopify, Webflow, interfejsów React, czy nawet starszych systemów. Tłumacz działa, o ile strona wyświetla się w przeglądarce.

Skrypt nie zatrzymuje się również po początkowym załadowaniu strony. Nowoczesne strony internetowe nie ładują wszystkich elementów od razu. Po kliknięciu mogą pojawiać się okna modalne, rozwijane menu wypełniane danymi z interfejsów API i/lub komunikaty o walidacji wyświetlane po przesłaniu formularza.

Zamiast więc przeskanować stronę raz i zakończyć działanie, skrypt na bieżąco monitoruje pojawianie się nowych węzłów tekstowych w modelu DOM i tłumaczy je w miarę ich renderowania.

Proces konfiguracji Smartcat trwa krócej, niż można by się spodziewać.

Projekt rozpoczyna się po wprowadzeniu adresu URL witryny i wybraniu języków docelowych. Następnie Smartcat generuje wersję podglądową witryny w swoim interfejsie, wykorzystując serwer proxy do renderowania stron i ich tłumaczenia.

Następnie zespół ds. treści może sprawdzić przetłumaczone strony, wprowadzić poprawki i zatwierdzić ostateczną wersję.

Po zatwierdzeniu tłumaczeń Smartcat publikuje je w postaci niewielkich plików JSON w swojej sieci CDN. Następnie wystarczy tylko dodać jeden fragment kodu JavaScript do nagłówka strony internetowej, aby tłumaczenie zaczęło działać na stronie

Od tego momentu, za każdym razem, gdy użytkownik odwiedza stronę, przetłumaczona treść jest pobierana z sieci CDN i wyświetlana odwiedzającemu w wybranym przez niego języku.

Możesz zapoznać się z przewodnik konfiguracji krok po kroku tutaj.

Architektura Smartcat oferuje kilka kluczowych zalet w porównaniu z tradycyjnymi metodami tłumaczenia. Należą do nich:

Jedną z największych niedogodności związanych z tradycyjnymi narzędziami do tłumaczenia stron internetowych jest ich zakres. Treść strony głównej zostaje przetłumaczona, ale elementy interaktywne często pozostają nietłumaczone.

Formularze pozostają w języku oryginalnym, czasowniki modalne pojawiają się bez zmian, a listy rozwijane i komunikaty o walidacji pozostają nieprzetłumaczone. Dla odwiedzającego strona wygląda na przetłumaczoną tylko częściowo.

Ponieważ tłumacz Smartcat działa bezpośrednio na wyrenderowanym DOM, może on uwzględniać treści pojawiające się po początkowym załadowaniu strony. Obejmuje to dynamicznie renderowane elementy interfejsu użytkownika, takie jak okna modalne, wyskakujące okienka, powiadomienia, listy rozwijane oraz wszelkie komponenty renderowane przez frameworki JavaScript po tym, jak strona stanie się interaktywna.

Zamiast więc tłumaczyć statyczny zrzut ekranu strony, skrypt na bieżąco monitoruje pojawiający się w interfejsie tekst i tłumaczy go w trakcie renderowania.

Smartcat dostarcza opublikowane tłumaczenia za pośrednictwem sieci CDN, a nie bezpośrednio ze swoich serwerów.

W rezultacie zasoby tłumaczeniowe są niewielkie, buforowane i udostępniane z lokalizacji brzegowych położonych blisko użytkownika, co zapewnia szybkie dostarczanie treści nawet w przypadku dużych, wielojęzycznych witryn.

Oznacza to również niezawodność. Po opublikowaniu tłumaczeń nadal działają one nawet wtedy, gdy serwis Smartcat jest niedostępny z powodu awarii.

System nie wymaga też, aby każda strona była tłumaczona z góry.

Gdy użytkownik trafi na nieprzetłumaczoną treść, skrypt może wygenerować tłumaczenie na żądanie, zapisać je w pamięci podręcznej i wykorzystać ponownie podczas kolejnych wizyt. Dzięki temu każdy kolejny użytkownik natychmiast otrzymuje wersję z pamięci podręcznej. Smartcat nazywa ten mechanizm „crowdingiem”

Jedynym minusem jest niewielkie opóźnienie, tj. opóźnienie w tłumaczeniu, podczas pierwszej wizyty na stronie zawierającej nowe lub zaktualizowane treści.

Smartcat obsługuje wielu dostawców usług tłumaczeniowych, w tym Google, DeepL, Gemini, ChatGPT, Claude, Apple, Amazon i Microsoft, a także wykorzystuje własną logikę do wyboru najlepszego z nich dla każdej pary językowej.

Strony internetowe często zawierają specyficzne terminy, nazwy marek oraz żargon branżowy, które należy stosować w sposób spójny. Terminy te często giną w tłumaczeniu.

Smartcat obsługuje pamięć tłumaczeniową i umożliwia spójne wykorzystywanie określonych terminów we wszystkich językach. Można również dopracować tłumaczenie, stosując niestandardowe wskazówki dla silników LLM dotyczące tonu i stylu.

Strony internetowe zawierają powtarzające się sekcje, takie jak nagłówki, stopki, menu nawigacyjne i banery, które pojawiają się na wszystkich stronach.

Atrybut st-shared-section umożliwia zespołom definiowanie sekcji wspólnych, dzięki czemu powtarzające się elementy są tłumaczone tylko raz i konsekwentnie wykorzystywane we wszystkich miejscach.

Oprócz widocznego tekstu strony Smartcat oferuje również możliwość tłumaczenia elementów mających wpływ na SEO.

Tłumaczeniu podlegają również metadane witryny, takie jak tytuły stron, opisy, atrybuty alt obrazów, tekst zastępczy, etykiety ARIA oraz tagi hreflang.

Niektóre strony internetowe mogą zawierać dane osobowe lub informacje wrażliwe, których nie należy przetwarzać w celu tłumaczenia.

Aby temu zaradzić, Smartcat umożliwia właścicielom stron wyraźne wykluczenie niektórych sekcji strony z tłumaczenia.

Elementy oznaczone atrybutem st-ignore są całkowicie pomijane przez system tłumaczeniowy wraz z zawartą w nich treścią. Dzięki temu zespoły mogą oddzielić dane konta, szczegóły płatności, narzędzia wewnętrzne lub inne wrażliwe obszary interfejsu od procesów tłumaczeniowych.

Witryny, które chcą mieć większą kontrolę nad przetwarzaniem danych, mogą również całkowicie wyłączyć tłumaczenie na żądanie i korzystać wyłącznie z gotowych zasobów tłumaczeniowych.

Każdy model tłumaczenia wiąże się z pewnymi kompromisami. Oparte na skryptach podejście firmy Smartcat ma kilka zalet, o których wspomnieliśmy powyżej, ale ma też swoje ograniczenia, wynikające głównie ze środowiska przeglądarki, w którym działa.

Jedną z największych przeszkód są ramki iframe międzydomenowe.

Jeśli strona zawiera osadzone narzędzie rezerwacyjne innej firmy, formularz płatności, osadzone narzędzia do planowania lub zewnętrzne widżety, zasady bezpieczeństwa przeglądarki uniemożliwiają skryptowi dostęp do treści wewnątrz.

Ograniczenie to dotyczy wszystkich systemów tłumaczeniowych działających w przeglądarce. Jedynym rozwiązaniem jest osobna instalacja skryptu tłumaczącego wewnątrz ramki iframe, co jest możliwe tylko wtedy, gdy użytkownik ma również kontrolę nad osadzonym źródłem.

Układ strony to kolejny częsty przypadek graniczny, zwłaszcza w przypadku języków pisanych od prawej do lewej, takich jak arabski czy hebrajski. Smartcat może zmienić kierunek strony, korzystając z natywnej obsługi pisania od prawej do lewej w przeglądarce, ale nie może przerobić arkusza CSS witryny.

Układy oparte na elementach o stałej szerokości, sztywno zdefiniowanym pozycjonowaniu lub założeniach dotyczących wyrównania do lewej lub prawej strony często nie działają poprawnie w przypadku dłuższych tekstów w tłumaczeniach lub interfejsów lustrzanych.

Ten sam problem pojawia się przy rozszerzaniu tekstu w językach takich jak niemiecki czy francuski. Edytor kontekstowy pomaga wykryć te problemy podczas weryfikacji, ale naprawa samego układu strony wykracza w tym przypadku poza możliwości Smartcat. Kwestią układu strony musi zająć się właściciel witryny lub zespół techniczny.

Gdy użytkownik trafi na treść, która nie została jeszcze przetłumaczona, system generuje i buforuje tłumaczenie przed jego wyświetleniem.

Kolejni użytkownicy otrzymują natychmiast wersję z pamięci podręcznej, ale przy pierwszej wizycie może wystąpić krótkie opóźnienie.

Systemy ochrony przed botami, takie jak Cloudflare, czasami blokują ładowanie podglądu Smartcat podczas konfiguracji, ponieważ żądania pochodzą z adresów IP AWS i wyglądają jak ruch automatyczny. Rozwiązaniem jest dodanie statycznych adresów IP Smartcat do białej listy.

Aplikacje jednostronicowe tworzone przy użyciu frameworków takich jak React mogą czasami napotykać problemy z renderowaniem, jeśli przetłumaczona struktura HTML nie zostanie poprawnie zachowana.

Rozszerzenia przeglądarki, które wstawiają treści do modelu DOM, mogą również generować zakłócenia, które warstwa tłumaczenia próbuje przetworzyć. Smartcat oferuje filtry dla znanych rozszerzeń oraz funkcję wykrywania języka źródłowego, które pozwalają temu zapobiegać.

Narzędzie Smartcat Website Translator nie jest przeznaczone dla wszystkich stron internetowych.

Rozwiązanie to najbardziej przydaje się zespołom, które muszą obsługiwać wiele języków bez konieczności przebudowywania istniejącej infrastruktury.

Mogą to być produkty typu SaaS przeznaczone dla użytkowników z całego świata, strony internetowe zawierające duże ilości treści oraz firmy wkraczające na nowe rynki, które nie chcą, aby lokalizacja była uzależniona od cykli wydawniczych działu technicznego.

W przypadku mniejszych stron internetowych, składających się zaledwie z kilku stron lub obsługujących tylko jeden lub dwa języki docelowe, często wystarczy prostsza wtyczka CMS lub ręczny proces redakcyjny.

Zalety systemu tłumaczeń działającego w przeglądarce, takiego jak Smartcat, stają się oczywiste wraz ze wzrostem ilości treści, liczby języków i częstotliwości aktualizacji.

Jeśli więc szukasz narzędzia do tłumaczenia swojej strony internetowej i nie chcesz męczyć się z modyfikowaniem kodu źródłowego ani zarządzaniem zduplikowanymi adresami URL, sprawdź Smartcat Website Translator .