What is a hreflang tag?
O que é a tag hreflang?
Hreflang is a tag that informs search engines the different languages that are available on the page you published on your website. Search engines will use these tags to display to the user the direct URL of the page in his language, based on the country of the user or the language of the browser selected by the user that is visiting your page.
A hreflang é a tag que informa os motores de pesquisa quantas línguas tem a página publicada no teu site. Os motores de pesquisa vão usar estas tags para mostrar ao user que visita a tua página o link direto para a tradução na sua língua sem que ele tenha de selecionar manualmente, isto com base no seu país ou na língua que este escolheu no seu browser.
When do should I have to add hreflang tags?
If you have a multi-language website, or even some pages translated you should use hreflang tags to inform the search engine which version of the page(s) should be displayed in the user’s browser.
Quando é que devo adicionar tags hreflang?
Se o teu site é multilingual ou mesmo que tenhas apenas algumas páginas traduzidas deves usar as tags hreflang para informar os motores de pesquisa que versão da página(s) deve(m) aparecer no browser do user.
What is the difference between hreflang and canonical?
Hreflang identifies the language of the page and allows a search engine to show the translation version of the user’s country instead of the default one. A Canonical tag is used when there is duplicated content and it lets identify which is the page that should appear in search results so that it doesn’t create a duplication.
Qual é a diferença entre hreflang e canonical?
A hreflang identifica a língua da página e permite que o motor de pesquisa mostre a versão traduzida do país do user em vez da versão pré-definida. Se tivermos dois conteúdos idênticos a tag Canonical faz a identificação de qual é a página principal e informa o motor de pesquisa que essa é que deve aparecer nos resultados.
The hreflang tags are very useful for webmasters that manage multi language websites. Let’s see in practice how to implement.
As tags hreflang são muito utéis para os webmasters que fazem a gestão de sites com várias línguas. Vamos ver como fazer isto na prática!
How to implement hreflang tags?
In the <head> of the HTML add the following code:
Dentro das tags <head></head>, adiciona o código seguinte:
<link rel="alternate" href="https://www.link.com" hreflang="language-iso-code" />.Replace the link link.com with the URL of the website in the main language, then look for the iso code and replace language-iso-code with the appropriate language code.
Substitui o endereço link.com pelo URL da página na língua standard. Depois substitui o código iso da língua e coloca em language-iso-code para que assuma o código de língua apropriado.
Webtec Lab in practice
Your webpage link.com has 2 different languages, English (link.com/en) and French (link.com/fr). You must add 2 lines of code, corresponding to each language, and the same code should be copied for each page. This is how it will look like:
A tua página tem 2 línguas, inglês e francês. Assim devem ser colocas duas linhas código em cada página, o que corresponde a cada língua, e o mesmo código deve ser copiado para cada página.
<link rel="alternate" href="https://www.link.com/en" hreflang="en" />
<link rel="alternate" href="https://www.link.com/fr" hreflang="fr" /.What if I have 2 different scripts of the same language?
The same process will apply. Hreflang considers it as if they are different languages because its one as its own code.
Example: I have one page written in Simplified Chinese and another page with the text translated into Traditional Chinese. The code to add in both pages inside the tags <head></head> will be the following:
E se eu tiver 2 padrões da mesma língua?
O processo é o mesmo. A hreflang considera que são línguas diferentes, pois cada uma tem o seu código.
Exemplo: O mesmo texto é escrito em chinês simplificado e noutra página em chinês tradicional. O código a utilizar nas duas páginas deverá ser este:
<link rel="alternate" href="https://www.link.com/sc" hreflang="zh-Hans" />
<link rel="alternate" href="https://www.link.com/tc" hreflang="zh-Hant" /.Tip: Add the global lang attribute at the beginning of your HTML to define the language of the current page. Example: <html lang=”en”>
Dica: Adiciona sempre o atributo global lang com o respetivo código da língua no início do teu HTML para definir a língua da página. Exemplo: <html lang=”en”>
Do you need help implementing your multi-language website? Do you need help? Send me a message!
To know more about SEO, and to test your code, check this link with useful tools for webmasters.
Category: Content and SEO
Hi! I am Filipa Pimentel.
I am a webmaster and web specialist. I also write articles on SEO, content, analytics and I am a huge fan of digital photography and games.
