什么是 Hreflang 以及如何以正确的方式实施 – 大鹏笔记 – WordPress建站|谷歌广告|谷歌SEO|SNS社媒|CRO转化率优化|EDM邮件营销

Hreflang 是您添加到网站中的代码，用于告诉搜索引擎您页面的不同语言版本。

这就像给 Google 一张多语言内容的地图，以便向合适的用户展示合适的语言。

但是，重要的是要了解 hreflang 是一个信号，而不是一个指令。这意味着虽然它指导搜索引擎，但不能保证它们会始终显示您指定的确切版本。

下面是一个工作原理示例：

当您在您的网站上正确实施 hreflang 时，从德国进行搜索的人更有可能在他们的搜索结果中看到您网站的德语版本。

而美国人很可能会看到英文版本。

hreflang 标签的主要优点是：

您的用户将被定向到您网站最相关的版本
它们可以帮助您页面的国际版本对本地相关关键字进行排名
它们有助于确保 Google 了解页面的不同版本不是重复的，从而最大限度地减少重复内容问题

要获得这些好处，您需要正确实现 hreflang。但 Ahrefs 的一项研究发现，67% 的网站的 hreflang 标签有问题。

在我们了解如何以正确的方式实现 hreflang 之前，让我们先谈谈如何构建 hreflang 标签。

如何构建 Hreflang 标签

hreflang 属性被添加到网页的 link 元素（<link>）的 <head> 部分或 HTTP 标头中。

Hreflang 属性（从技术上讲不是 HTML“标签”）遵循特定的结构，由几个关键元素组成：

让我们来分析一下。

link rel=“alternate”：表示网页有多个版本
href=“https://yourwebsite.com/us/”：指定备用版本的绝对 URL
hreflang=“en-us”：指示 hreflang 属性，指定内容适用于美国的英语使用者

因此，要构建自己的 hreflang 标签，您需要知道相关的 ISO 639-1 语言代码（以及 ISO 3166-1 alpha-2 国家和地区代码，如果您指定了它们）。

例如，如果要指定应向比利时的法语使用者和法国的法语使用者显示的页面，则可以执行以下作：

对于比利时的法语使用者，您可以使用语言代码 “fr” 和国家代码 “be”：

<link rel="alternate" href="https://yourdomain.com/be/" hreflang="fr-be" />

对于在法国讲法语的人来说，它看起来像这样：

<link rel="alternate" href="https://yourdomain.com/fr/" hreflang="fr-fr" />

您无需同时包含语言和区域代码。

例如，如果您的网页只有一个法语版本供所有法语使用者使用，则您的 hreflang 标签可能如下所示：

<link rel="alternate" href="https://yourdomain.com/fr/" hreflang="fr" />

但是，如果说同一种语言的国家/地区存在本地细微差别（例如美国与英国的运动鞋与运动鞋），区域代码可以帮助您提供网页的本地化版本。

但您确实需要指定语言代码。

我们稍后将讨论更多最佳实践。现在，让我们看看如何实际将 hreflang 添加到您的网站中。

如何在 HTML 中正确实现 Hreflang

您可以通过几种不同的方式将 hreflang 属性添加到您的网站中：

选项 1：将 Hreflang 添加到您的 HTML 中

直接将 hreflangs 嵌入到每个页面的 HTML <head> 部分相当简单。

例如，以下是 Jeep 的网站如何将 hreflang 合并到 <head> 部分，以管理其许多网站变体的语言和区域定位：

可以想象，对于大型网站来说，在数百（或数千个）页面中保持 hreflang 属性的一致性和准确性可能很棘手。

因为每个页面的每个版本都需要包含带有 hreflang 标签的所有其他版本的列表。包括一个用于自身的（稍后会详细介绍）。

例如，如果 Jeep 决定在一个新的国家/地区启动其网站，则需要更新网站每个版本的所有页面，以将新的国家/地区作为变体包含在内。

选项 2：将 Hreflang 添加到您的站点地图

或者，您可以在站点地图中添加 hreflang 注释。

这是处理 hreflang 的有效方法，尤其是对于具有多种语言的广泛内容的网站（如上面的 Jeep 示例）。

这种方法集中管理、简化更新并整理 HTML head 部分，从而可能加快页面加载时间。（尽管这通常只适用于具有大量 hreflang 标签的网站的潜在问题。

以下是定位美国购物者以及加拿大讲英语和法语的网站的站点地图中的 hreflang 属性示例。

<url>
<loc>https://yourwebsite.com/english-page-us/</loc>
<xhtml:link rel="alternate" hreflang="en-ca" href="https://yourwebsite.com/english-page-ca/" />
<xhtml:link rel="alternate" hreflang="fr-ca" href="https://yourwebsite.com/french-page-ca/" />
<xhtml:link rel="alternate" hreflang="en-us" href="https://yourwebsite.com/english-page-us/" />
</url>
<url>
<loc>https://yourwebsite.com/english-page-ca/</loc>
<xhtml:link rel="alternate" hreflang="en-ca" href="https://yourwebsite.com/english-page-ca/" />
<xhtml:link rel="alternate" hreflang="fr-ca" href="https://yourwebsite.com/french-page-ca/" />
<xhtml:link rel="alternate" hreflang="en-us" href="https://yourwebsite.com/english-page-us/" />
</url>
<url>
<loc>https://yourwebsite.com/french-page-ca/</loc>
<xhtml:link rel="alternate" hreflang="en-ca" href="https://yourwebsite.com/english-page-ca/" />
<xhtml:link rel="alternate" hreflang="fr-ca" href="https://yourwebsite.com/french-page-ca/" />
<xhtml:link rel="alternate" hreflang="en-us" href="https://yourwebsite.com/english-page-us/" />
</url>

您会注意到，它为加拿大的英语和法语使用者以及美国的英语使用者指定了页面的每个版本。并且每个目标版本都会重复此配置。

选项 3：将 Hreflang 添加到您的 HTTP 标头中

对于非 HTML 文件，如 PDF，您可以使用 HTTP 标头指定 hreflang 属性。

此方法涉及调整 Web 服务器配置，可能有点复杂。具体过程因您的 Web 服务器而异，无论是 Apache、Nginx、IIS 还是其他服务器。

您需要添加配置规则，以便为每条内容包含正确的链接标头。

例如，如果您的内容提供英语（美国）、英语（英国）、德语和西班牙语版本，则 HTTP 标头的格式如下：

<https://yourwebsite.com/en-us/example.pdf>; rel="alternate"; hreflang="en-us",
<https://yourwebsite.com/en-gb/example.pdf>; rel="alternate"; hreflang="en-gb",
<https://yourwebsite.com/de/example.pdf>; rel="alternate"; hreflang="de",
<https://yourwebsite.com/es/example.pdf>; rel="alternate"; hreflang="es"

关于实现 hreflang 标签的一些说明

在我们讨论 hreflang 属性的工具、最佳实践和错误之前，这里有几点需要注意：

首先，您可以按任意顺序添加 hreflang 属性。

因此，您可以将它们放在链接目标之前：

<link rel="alternate" hreflang="en" href="https://yourwebsite.com/en" />

或之后：

<link rel="alternate" href="https://yourwebsite.com/en" hreflang="en" />

这不重要。无论哪种方式，搜索引擎都会理解它。

接下来，hreflang 不区分大小写。

大写在文档中经常被用来表示国家或地区代码，但实际上你如何为 hreflang 写它们并不重要。因为搜索引擎仍然会理解它们。

Google 自己关于该主题的指南甚至引用了大写和小写示例。

Hreflang 实现工具

以下是一些工具，可以更轻松地在您的网站上实施 hreflang：

CMS 插件

许多内容管理系统（CMS）都有专为 hreflang 管理而设计的插件。

对于 WordPress 用户，请查看“Hreflang Manager”插件。

Shopify 店主可以将针对其平台量身定制的类似工具与 GWA Hreflang Manager 一起使用。

专用的 Hreflang 工具

除了特定于 CMS 的选项之外，还有多种工具可以帮助您正确实施 hreflang。

就像 Relgrowth 的 hreflang 生成器一样：

或者 Aleyda Solis 的 hreflang 工具。

它允许您通过 HTML 或 XML 站点地图轻松实现 hreflang。

AI 工具

您还可以使用 ChatGPT 等 AI 工具来帮助为您的页面生成 hreflang 属性。尽管我们始终建议仔细检查准确性。

然后，您可以将这些内容复制到 HTML 中：

或生成 XML 站点地图：

甚至对于像 PDF 这样的文件上的 HTTP 头实现：

您可以根据自己的特定需求定制提示。你可能需要稍微调整一下，才能让它大规模地有效地工作。

进一步阅读：ChatGPT for SEO：终极指南，提示和提示

Hreflang 最佳实践

Hreflang 属性无法保证搜索引擎始终显示您的首选网站版本。

但它们是一个强烈的信号，可以帮助搜索引擎根据用户的位置和语言识别与用户最相关的版本。

请遵循以下最佳实践来确定您的 hreflang 实现：

包括双向链接

您网站的每个版本都应该包含指向所有其他语言或区域版本的链接。以及返回自身的链接。

这将在所有版本之间创建双向连接。Google 需要能够在页面的所有版本上找到相关标签，以确认它们之间的关系。

它还确保只有您控制的页面才能作为备用版本相互引用。如果没有互惠链接，搜索引擎可能会忽略 hreflang 属性。

例如，如果您网站上的特定页面具有英语（美国）和德语版本，则这两个页面应包含相同的 hreflang 标签，如下所示：

<link rel="alternate" hreflang="en-us" href="https://yoursite.com/en-us/apple-watch" />
<link rel="alternate" hreflang="de" href="https://yoursite.com/de/apple-watch" />

使用绝对 URL

始终使用完整的 URL，例如“https://backlinko.com/google-analytics-4”，以避免搜索引擎混淆。

避免使用相对 URL，例如“/google-analytics-4”。

在所有相关页面上应用 hreflang 属性

不要将 hreflang 属性限制为主页或几个选定的页面。在具有语言或区域替代语言的每个页面上实施它们。

此外，在网站的桌面和移动版本上都包含 hreflang。这将为用户提供正确的页面版本，无论他们的设备如何。

包括 “x-default” hreflang 属性

x-default hreflang 属性为您未指定的语言和区域设置默认页面版本。

让我们以 ASOS 的类别页面之一为例。从 UK 版本开始：

这是一个相当标准的 hreflang 集群，但它只涵盖了该页面的 11 个替代版本。

当您浏览他们的网站时，您会注意到您可以从广泛的国家/地区中进行选择进行购物，而不仅仅是 hreflang 集群中列出的国家/地区。

那么，是什么原因呢？

输入 “x-default”。

“x-default”值为位置或语言与 hreflang 群集中指定的任何访客不匹配的访客提供回退 URL。

您可以像这样构建它：

<link rel="alternate" href="https://yoursite.com" hreflang="x-default" />

对于新加坡（hreflang 集群未明确覆盖的区域）的购物者，“x-default”设置可确保他们访问网站的通用版本。

对于使用非 hreflang 标签专门针对的语言的用户，请使用 “x-default” 值，以便将他们定向到您网站的通用版本。

定期监控您的 Hreflang 属性

一旦你实现了你的 hreflang 标签，你需要掌握它们以防止将来出现问题。特别是如果您开始扩展到新的语言和区域。

你可以使用 Semrush 的 Site Audit（网站诊断）等工具来查找和修复常见的 hreflang 错误。

方法如下：

首先输入您的网站 URL。然后，单击“开始审核”。

您可以尝试使用配置设置，也可以将其保留为默认值。

然后，单击“开始站点诊断”。

然后该工具将开始抓取和审核您的网站。

审计完成后，您将看到一份详细的报告，其中概述了所有发现的问题。

但是您想单击 “Issues” 选项卡。

使用搜索栏键入 “hreflang”。

这将过滤列表以仅显示与 hreflang 相关的问题。

如您所见，Backlinko 没有任何 hreflang 问题。

但是，如果您在网站上发现问题，您可以单击每个问题旁边的链接数字以获取详细报告。

这将带您进入包含该特定问题的 URL 列表。

您还可以单击每个问题旁边的“为什么以及如何修复它”链接，了解有关如何解决该问题的更多信息。

定期审核 hreflang 标签可确保您的用户始终获得最相关的页面版本。

注意：一个免费的 Semrush 帐户允许您审核多达 100 个 URL。或者您可以使用此链接访问 Semrush Pro 订阅的 14 天试用期，一次最多可审核 20K URL。

要避免的常见 Hreflang 错误

即使经过仔细规划，在使用 hreflang 标签时也很容易遇到问题。

以下是一些最常见的 hreflang 错误：

省略自引用 Hreflang 属性

每个页面都必须包含一个自引用 hreflang 标签，以指示其目标语言和区域。

例如，假设您有一个关于 red sneakers 的网页，它有三个不同的版本：英语（美国）、英语（UK）和法语（法国）。

这些页面中的每一个都应该有一个指向自身的 hreflang 标签，以及其他版本的标签。

这意味着页面的美式英语版本应包含所有三个 hreflang 标签：

<link rel="alternate" hreflang="en-us" href="https://yourwebsite.com/en-us/red-sneakers" />
<link rel="alternate" hreflang="en-gb" href="https://yourwebsite.com/en-gb/red-sneakers" />
<link rel="alternate" hreflang="fr-fr" href="https://yourwebsite.com/fr/red-sneakers" />

永远不要省略自引用的 hreflang 标签，就像这样：

<link rel="alternate" hreflang="en-gb" href="https://yourwebsite.com/en-gb/red-sneakers" />
<link rel="alternate" hreflang="fr-fr" href="https://yourwebsite.com/fr/red-sneakers" />

使用不正确的语言或国家/地区代码

语言和国家/地区代码可能很棘手，因为它们并不总是直观的。

例如，英国的正确代码是 “GB” （而不是 “UK”）。对于定位到香港，您使用“zh-HK”而不是“zh-CN”，后者适用于中国大陆。

为避免错误，请始终仔细检查这些代码的准确性。请参阅官方语言和国家/地区代码列表，以确保您做对了。

错误地将 canonical 标记和 hreflang 属性一起使用

当您的页面版本不同时，规范标签和 hreflang 属性都应该出现在您的 HTML 页面上。

hreflang 标签告诉搜索引擎页面的语言和区域定位。而 canonical 标签指定用于索引的主要版本。

例如，如果一个页面有两个版本（一个是美国的英语页面，另一个是墨西哥的西班牙语页面），则每个页面都应该包含一个指向其各自 URL 的规范标签。

所以不要只这样做：

<link rel="alternate" hreflang="en-us" href="https://yourwebsite.com/en-us/" />
<link rel="alternate" hreflang="es-mx" href="https://yourwebsite.com/es-mx/" />

同时添加 canonical link 元素。

对于美国版本：

<link rel="alternate" hreflang="en-us" href="https://yourwebsite.com/en-us/" />
<link rel="alternate" hreflang="es-mx" href="https://yourwebsite.com/es-mx/" />
<link rel="canonical" href="https://yourwebsite.com/en-us/" />

对于墨西哥版本：

<link rel="alternate" hreflang="en-us" href="https://yourwebsite.com/en-us/" />
<link rel="alternate" hreflang="es-mx" href="https://yourwebsite.com/es-mx/" />
<link rel="canonical" href="https://yourwebsite.com/es-mx/" />

将页面的替代版本指向同一 URL

页面的每个版本都应该有自己唯一的 URL。

因此，当你添加 hreflang 属性时，每个 hreflang 链接元素都必须是不同的 URL。

不要错误地将不同的版本指向同一个 URL：

<link rel="alternate" hreflang="en-ca" href="https://yourwebsite.com/page" />
<link rel="alternate" hreflang="en-au" href="https://yourwebsite.com/page" />

相反，每个版本都应该指向其特定的 URL：

<link rel="alternate" hreflang="en-ca" href="https://yourwebsite.com/en-ca/" />
<link rel="alternate" hreflang="en-au" href="https://yourwebsite.com/en-au/" />