Ustawianie hreflang i x-default na wielojęzycznej stronie (z Hugo)

Ustawienie meta tagu hreflang na Twojej wielojęzycznej stronie powinno być tak proste jak bułka z masłem. Wystarczy umieścić odpowiedni meta tag na stronie, odnieść się do przetłumaczonej wersji i w wersji przetłumaczonej odnieść się z powrotem do oryginalnej.

Wygląda to na takie proste. Koniec historii? Nieprawda!

Choć brzmi to prosto, w praktyce nie zawsze tak jest. Jeśli prowadzisz stronę w wielu językach, ale nie cała zawartość jest przetłumaczona, ustawienie i używanie tagu hreflang na całej stronie stanowi pewne wyzwanie. Jeśli dodasz do tego poprawne użycie meta tagu x-default, staje się to jeszcze większym wyzwaniem.

Gdy zaczynasz myśleć, jak poprawnie to zaimplementować, pojawia się więcej pytań, a szukanie odpowiedzi w internecie daje sprzeczne wyniki.

Nawet Google w swojej dokumentacji Google Search Central ma post zatytułowany Poinformuj Google o lokalizowanych wersjach swojej strony, który nie wyjaśnia niektórych scenariuszy.

Na szczęście, 8 marca 2023 roku, pojawił się nowy post zatytułowany Jak x-default może ci pomóc, który zmienia twoją perspektywę na to, jak należy patrzeć na implementację meta tagów hreflang i x-default.

Chodzi o konwersje, a nie o międzynarodowe celowanie, jak wielu myśli. Nawet Google odstąpiło od tego.

Ten post w końcu odpowiada na niektóre z moich pytań.

Główne podejście polega na zmianie sposobu myślenia o tagach hreflang i x-default.

Twoim celem jest bardzo prawdopodobnie w jakiś sposób konwertowanie użytkowników, którzy trafiają na Twoje strony.

(…) jeśli opublikowałbyś esej tylko po niemiecku, jest mało prawdopodobne, że osoby nieposługujące się językiem niemieckim dokonałyby konwersji na tej stronie, więc być może zechciałbyś wysłać je gdzie indziej, gdzie mogłyby faktycznie dokonać konwersji w inny sposób (…).

Pomyśl o powyższym, czytając dalej.

Mój główny adres strony (/) odnosi się do wersji polskiej. Jeśli przejdziesz do /en/, trafisz na wersję angielską.

Niektóre posty są przetłumaczone i ładnie połączone ze sobą za pomocą flagi w prawym górnym rogu. Jeśli post jest dostępny w języku angielskim, a jesteś w części polskiej, możesz kliknąć flagę angielską i czytać po angielsku.

Dla tego typu strony istnieje meta tag hreflang dla polskiego i angielskiego w obu postach, które odwołują się do siebie nawzajem.

Jeśli nie, oferuję automatyczne tłumaczenie za pomocą Tłumacza Google, które nie jest takie złe, jak było kilka lat temu.

Problem polega na tym, że nie tłumaczę wszystkiego na język angielski, jeśli piszę po polsku. Podobnie, jeśli zaczynam pisać post po angielsku (jak ten), nie zawsze decyduję się przetłumaczyć go na polski. Czasami jest to po prostu bezcelowe i niepotrzebnie pochłania mój czas bez żadnych korzyści dla moich czytelników.

Czasami decyzja o tłumaczeniu lub nie jest dyktowana kontekstem postem. Czasami coś napisane po angielsku będzie miało sens dla anglojęzycznego użytkownika, ale nie będzie miało sensu dla polskiego czytelnika, zwłaszcza jeśli czyta to z Polski (z polskim podejściem), a nie jak ja z Wielkiej Brytanii z odziedziczonym brytyjskim stylem życia.

Prawdopodobnie zrozumiesz, jeśli spróbuję przetłumaczyć słowo lub znaczenie, które ma doskonały sens w brytyjskim angielskim, ale w polskim po prostu nie istnieje. To wymagałoby pełnego wyjaśnienia, co masz na myśli, gdy w angielskim to tylko jedno słowo (i na odwrót).

Post Jak x-default może ci pomóc pomógł mi zrozumieć, jak zaimplementować hreflang i jak używać ustawienia x-default do celów konwersji.

Zawsze miałem trudności z x-default, ponieważ moja strona w języku polskim nie zawiera wszystkiego, co jest w części angielskiej.

Nie chciałbym sugerować dla osób nie-(domyślnie)-anglojęzycznych i nie polskojęzycznych, aby domyślnie przechodziły na polską stronę, jeśli mają ustawiony inny (domyślny) język, niż te dwa.

Jest znacznie łatwiej dla osób nieanglojęzycznych i nie polskojęzycznych (powiedzmy francuskojęzycznych z francuskim ustawionym jako domyślny język w systemie operacyjnym) wylądować na angielskiej części strony, niż domyślnie na polskiej. Bardziej prawdopodobne jest, że zrozumieją angielski, niż polski.

Ale też chciałbym, aby niektórzy wiedzieli, że jeśli napiszę coś po polsku i nie jest to dostępne po angielsku, mogą użyć przycisku tłumaczenia w prawym górnym rogu, aby je przetłumaczyć, zamiast po prostu zamknąć stronę, której nie rozumieją.

Właśnie tutaj przydaje się odpowiednie ustawienie i zrozumienie, jak wykorzystać meta tag x-default z konwersją na uwadze.

Zaczynając od podstawowego podejścia, gdy obie strony są przetłumaczone (tak jak moja strona O mnie), hreflang w nagłówku będzie wyglądać tak.

Na polskiej stronie o mnie (/o/)

<html lang=pl-pl xml:lang=pl-pl>
...
<link rel=alternate hreflang=pl href=https://dariusz.wieckiewicz.org/o/>
<link rel=alternate hreflang=en href=https://dariusz.wieckiewicz.org/en/about/>

Na tej samej stronie w języku angielskim (/en/about/)

<html lang=en-gb xml:lang=en-gb>
...
<link rel=alternate hreflang=en href=https://dariusz.wieckiewicz.org/en/about/>
<link rel=alternate hreflang=pl href=https://dariusz.wieckiewicz.org/o/>

To proste podejście, gdy obie strony są przetłumaczone.

W Hugo zostanie to zaimplementowane w <head> za pomocą poniższego kodu.

<link rel="alternate" hreflang="{{ .Lang }}" href="{{ .RelPermalink }}">
{{ range .Translations }}
	<link rel="alternate" hreflang="{{ .Lang }}" href="{{ .RelPermalink }}">
{{ end }}

Ale co, jeśli napiszę post, który jest tylko po angielsku?

Mogę dodać warunek, że tam, gdzie nie ma tłumaczenia, cały hreflang zostanie pominięty.

{{ if .IsTranslated }}
	{{ range .Translations }}
		<link rel="alternate" hreflang="{{ .Lang }}" href="{{ .RelPermalink }}">
	{{ end }}
	<link rel="alternate" hreflang="{{ .Lang }}" href="{{ .RelPermalink }}">
{{ end }}

To spowoduje, że niektóre strony będą miały hreflang, a inne nie.

Podejście z konwersją na uwadze polega na tym, że jeśli wynik jest w języku, którego użytkownik domyślnie nie rozumie, zasugeruj mu coś innego, co może go zainteresować. W ten sposób jest bardziej prawdopodobne, że odkryją coś innego w języku, który rozumieją, zamiast po prostu opuścić stronę.

W cytowanej sugestii wciąż będę serwować tag hreflang, nawet jeśli ta strona ma tylko jeden język, a jeśli język nie jest tym, który użytkownik rozumie, zaproponuję alternatywę. Alternatywna strona będzie stroną wyboru języka, na której wyjaśnię dostępne języki, fakt, że nie wszystkie strony będą tłumaczone domyślnie i że użytkownicy mogą nadal korzystać ze stron, których nie rozumieją za pomocą opcji automatycznego tłumaczenia.

To będzie wyglądać jak poniżej:

<html lang=en-gb xml:lang=en-gb>
...
<link rel=alternate hreflang=en href=https://dariusz.wieckiewicz.org/en/minimal-google-analytics-4-snippet/>
<link rel=alternate href=https://dariusz.wieckiewicz.org/en/language-selector/ hreflang=x-default>

Lub

<html lang=pl-pl xml:lang=pl-pl>
...
<link rel=alternate hreflang=pl href=https://dariusz.wieckiewicz.org/microsoft-mial-racje-nie-aktualizuj-do-windows-11/>
<link rel=alternate href=https://dariusz.wieckiewicz.org/en/language-selector/ hreflang=x-default>

W ten sposób każda strona będzie wykorzystywać podejście hreflang. Jeśli jest tłumaczenie, będzie dodatkowy język wymieniony. Jako alternatywa będzie odniesienie do dedykowanej strony, którą zrozumie większość odwiedzających, z której bardziej prawdopodobne jest, że dokonają dalszej konwersji (czytaj więcej).

Do tego wykorzystam następujący kod na mojej stronie Hugo:

<link rel="alternate" hreflang="{{ .Lang }}" href="{{ .RelPermalink }}">
{{ range .Translations }}
	<link rel="alternate" hreflang="{{ .Lang }}" href="{{ .RelPermalink }}">
{{ end }}
<link rel="alternate" href="{{ .Site.Params.langSelector | absURL }}" hreflang="x-default">

W moim pliku konfiguracyjnym Hugo (hugo.toml) określę adres strony wyboru języka

[params]
	langSelector = "/en/language-selector/"

W frontmatterze pliku markdown, gdzie umieszczę swoją treść, przedstawię URL.

---
url: '/en/language-selector/'
---

To zadziała, jak wyjaśniono w najnowszym wpisie na blogu Google.

Jednak jeśli opublikujesz esej tylko po niemiecku, jest mało prawdopodobne, że osoby nieznające tego języka dokonają konwersji na tej stronie, więc możesz chcieć skierować je gdzieś indziej, gdzie mogą faktycznie dokonać konwersji w inny sposób. Możesz to wyrazić za pomocą hreflang=“x-default”

Mam nadzieję, że to wyjaśnia coś dla osób w podobnej sytuacji jak moja, gdzie nie wszystkie posty są tłumaczone równomiernie.

Istnieją narzędzia dostępne w internecie, które powiedzą Ci, czy poprawnie zaimplementowałeś hreflang. Inne powiedzą Ci coś innego. To dlatego, że podejście opisane powyżej nie jest typowym, najczęściej znanym sposobem implementacji, a jednak nadal jest poprawne.

Gary Illyes, analityk w Google powiedział to na swoim profilu LinkedIn:

Chociaż wartość hreflang x-default została zaimplementowana, aby pomóc w bardzo specyficznych potrzebach, przypadkowo może również pomóc w dostarczaniu Googlebotowi adresów URL, których biedak w przeciwnym razie by nie zobaczył. To nie jest nowa rzecz, ale myślę, że to całkiem fajne, że ma “ukryte” przypadki użycia.

Jeśli chcesz dowiedzieć się więcej, przejdź do dokumentacji na temat Poinformuj Google o lokalizowanych wersjach swojej strony.