您需要了解的有关 Hreflang 和 Shopify 的所有信息

已发表: 2020-11-05

随着越来越多的 Shopify 商店走向国际,关注您的搜索引擎排名从未像现在这样重要。 虽然扩展到新地区创造了令人兴奋的新市场机会,但它也可能带来严重的 SEO 挑战。

国际扩张引入的主要 SEO 问题是:

  • 帮助搜索引擎了解哪个页面应该针对哪个地区/语言进行排名
  • 防止特定区域或特定语言的页面创建重复内容问题

在本文中,我们向您介绍了一个名为 Hreflang 的功能,用于解决这些国际 SEO 问题。

为什么我们需要 Hreflang?

首先,为什么我们甚至需要hreflang?

当一个品牌有多个针对不同地区的网站时,搜索引擎如何知道哪个网站针对哪个地区?

让我用健身品牌 Gymshark 来说明这一点。 Gymshark 使用 Shopify 并为不同的受众提供不同的网站:

英国 - https://uk.gymshark.com

德国 - https://de.gymshark.com

法国 - https://fr.gymshark.com

这些网站被翻译成他们的母语,这为谷歌提供了每个网站所属地区的大量线索。 但后来 Gymshark 也有美国网站和加拿大网站:

美国 - https://www.gymshark.com 加拿大 - https://ca.gymshark.com/

这两个网站上的内容都是英文的。 那么搜索引擎如何将这些与英国英语网站区分开来,并确保每个网站都在正确的区域中排名?

这就是hreflang的用武之地。

什么是 Hreflang?

Hreflang 是一个 HTML 属性,当有针对不同地区/语言受众的页面的替代版本时,它会向搜索引擎指示。

Hreflang 可以以不同的方式实现,但最常见的是一个简单的元标记,它出现在具有替代版本的任何页面上。 这是 Gymshark 的一个例子:

 <link rel="alternate" href="https://www.gymshark.com/" hreflang="en-us" />

此 hreflang 标签可在英国 Gymshark 主页“https://uk.gymshark.com/”上找到。

它告诉搜索引擎该页面的美国版本可以在“https://www.gymshark.com/”找到。

hreflang 标签包含两个关键属性:

1 - Href href 是指向备用页面的链接。 它必须是完整的 URL 地址,并且必须是工作页面。 它告诉搜索引擎“这是当前正在查看的页面的替代版本”。

2 - Hreflang hreflang 属性包含备用页面目标受众的语言代码 (ISO 639-1) 和可选的国家代码 (ISO 3166-1)。 国家代码是可选的,但语言代码是必需的。

一些使用不同语言/国家定位组合的 hreflang 属性示例:

  • zh - 说英语的人
  • en-GB - 在英国讲英语的人
  • fr-FR - 在法国讲法语的人
  • en-US - 在美国讲英语的人
  • it - 讲意大利语的人
  • it-CH - 在瑞士讲意大利语的人。

将“href”和“hreflang”拼在一起,搜索引擎将知道这个备用 URL(href)是针对特定受众(hreflang)的。

备用页面

重要的是要记住 hreflang 在页面级别而不是域级别上工作。 Hreflang 标签声明“备用页面”,而不是“备用网站”。 许多网站使用 hreflang 标签来声明同一域上的备用语言/区域特定页面。

例如,您可以使用子文件夹来托管您网站的备用语言/地区版本。 这就是 Apple 使用文件夹设置其国际网站的方式:

  • 英国:https://www.apple.com/uk/
  • ES:https://www.apple.com/es/
  • 法国:https://www.apple.com/fr/

X-默认

有一个特殊的 hreflang 后备值,称为“x-default”。 当没有其他 hreflang 链接与搜索者的语言/区域匹配时,将“x-default”视为网页搜索引擎应该排名。

再次以 Gymshark 为例。 他们在 row.gymshark.com 上有一家世界各地的商店。 这被声明为 x-default。

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

因此,如果有人使用 Gymshark 的 hreflang 标签中未声明的语言/位置进行搜索,Google 很可能会显示 Gymshark 的 RoW 商店。

您需要添加 Hreflang 吗?

当您有两个几乎相同的页面为不同的语言/区域受众提供服务时,您只需要添加 Hreflang 标记。 如果页面没有替代版本,则不需要添加 hreflang 标记。

Hreflang 规则

要验证 hreflang 标记,它们必须遵循特定规则:

1 - 返回链接- 如果页面 hreflang 链接到备用页面,则备用页面必须 hreflang 链接回第一页。 例如,如果英国 Gymshark 有一个指向德国 Gymshark 页面的 hreflang 链接,则德国页面必须有一个指向英国版本的 hreflang 链接。

2 - 工作页面- 您 hreflang 链接到的任何页面都必须返回 200 状态代码。 换句话说,hreflang 链接必须是工作页面。

3 - 自引用 Hreflang 标记- 任何包含 hreflang 链接的页面也必须具有指向自身的 hreflang 链接。 我们称之为自引用 hreflang 链接。 自引用 hreflang 链接必须包含标准语言/国家/地区声明。

Hreflang 挑战

现在我们已经确定了 hreflang 是什么以及它是如何工作的,我们可以讨论为什么它是 SEO 中如此复杂的一部分。 事实上,hreflang 可能是 SEO 中最难做好的部分之一。

这是来自 Google 网站管理员趋势分析师 John Mueller 的推文,解释了 hreflang 的难易程度!

添加标签非常简单,但维护满足上述 3 条规则的 hreflang 标签可能极具挑战性。

要始终进行验证,不同页面之间的 hreflang 标签必须保持同步。 像更改 URL 这样简单的事情可能会破坏两个页面之间的 hreflang 连接。

当您拥有多个网站、动态页面并由不同团队管理时,您可以开始想象这将变得多么复杂。 如果您有多个网站,则需要确保您的团队正在协调以确保您的 hreflang 标签不会损坏!

Hreflang 错误

我们一直在处理损坏的 hreflang 设置。 这些是我们遇到的最常见的 hreflang 问题:

没有返回链接

到目前为止,我们看到的最常见的 Hreflang 问题是没有返回 Hreflang 链接的页面。 这是您需要组织的地方,以确保您的 hreflang 标记始终有效。 如果 URL 路径在一个页面上更改,但在另一个页面上没有更改,则 hreflang 标记将不同步。

非 200 页

Hreflang 标记需要指向返回 200 服务器响应的工作页面。 随着您网站的发展,URL 也会发生变化。 这将破坏您的 hreflang 标签,因此如果您停用并重定向页面,请确保您还更新了任何 hreflang 标签。

没有自引用的 Hreflang 标记

这可能看起来很奇怪,但如果一个页面有 hreflang 标签,那么它也必须包含一个自引用的 hreflang 标签。 这是许多网站常犯的错误。

如何检查 Hreflang 标签

Hreflang 标签检查器

审核 hreflang 标签的最简单方法是使用名为 Hreflang Tag Checker 的 Chrome 扩展程序。 安装扩展程序后,您只需访问任何页面并按工具栏图标即可。 然后扩展程序将检查当前 URL 上是否有任何 hreflang 标签。

此工具的最佳功能是它实际上会抓取 hreflang 链接并确认它们通过了验证检查。

尖叫的青蛙

如果您想大规模审核 hreflang 标签,那么 Screaming Frog 是您的首选工具。 Screaming Frog 将抓取一个网站并验证在抓取过程中发现的任何 hreflang 标签。

搜索控制台

Search Console 的“旧版报告”部分隐藏了一份国际定位报告。 要访问此报告,请在左侧菜单中转到“旧版工具和报告 > 国际定位”。

此报告将显示您的网站上有多少个 hreflang 标记,并详细说明存在任何 hreflang 错误的位置。

添加 Hreflang 的不同方法

实现 Hreflang 的方法不止一个。 上述 HTML 标记方法是迄今为止设置 hreflang 的最简单方法,但有两种替代方法:

XML 站点地图

您可能熟悉 XML 站点地图。 您的 XML 站点地图可以更新为包含站点地图中每个页面的 hreflang 声明。 对于具有复杂系统的大型网站,这通常是最简单的方法。

HTTP 标头

每当 Web 浏览器访问页面时,服务器都会将有关该页面的信息返回到您的 Web 浏览器。 这称为 HTTP 响应。 您可以将服务器配置为在 HTTP 标头响应中返回 hreflang 信息。

如何将 Hreflang 添加到 Shopify

那么,您如何实际将 hreflang 标签添加到 Shopify? 与大多数内容管理系统一样,Shopify 存在细微差别,这些细微差别会影响您在平台上可以做什么和不可以做什么。 虽然可以通过 XML Sitemap 或 HTTP Headers 方法将 hreflang 添加到 Shopify,但它需要大量的技术配置,因此我们不建议这样做。

对于 Shopify 网站,我们推荐的实现 Hreflang 的方法始终是 HTML 标签。 将 hreflang 标签物理添加到您的网站相当容易,但您需要确保您的 hreflang 标签始终有效。 记住上面的三个规则:

  • 必须有来自备用页面的返回 hreflang 链接
  • 备用页面必须是有效的 URL
  • 在任何包含 hreflang 标签的页面上都必须有一个自引用的 hreflang 标签

通过应用程序将 Hreflang 添加到 Shopify

有一些 Shopify 应用会为您将 Hreflang 标签添加到您的页面。 Weglot 和 Langify 等翻译应用程序会自动生成您的 Hreflang 标签并将它们添加到您的页面中。

虽然应用程序可以将 hreflang 标签添加到您的 Shopify 商店,但根据我们的经验,这不是最好的方法。 应用程序方法仅在您拥有提供多语言的单个商店时才有效。 大多数应用程序不提供语言+国家/地区 hreflang 定位,应用程序也不考虑跨不同域的多个商店。 Shopify 应用程序不是我们推荐的 hreflang 方法。

将 Hreflang 标签添加到您的 theme.liquid 文件

如果您有两个具有相同页面和 URL 的商店(只有域不同),那么添加有效的 hreflang 标记可能相当容易。 由于这两个网站是完全克隆的,因此您知道对于站点 A 上的每个页面,站点 B 上都有一个等效页面。

因此,您可以编辑您的主题代码以使用正在查看的页面的 URL 路径动态构建您的 hreflang 标记。

这就是下面的液体代码所做的:

 <link rel="alternate" hreflang="x-default" href="{{ canonical_url | replace: shop.domain, 'www.mystore.com' }}" /> <link rel="alternate" href="{{ canonical_url | replace: shop.domain, 'www.mystore.com' }}" hreflang="en-GB" /> <link rel="alternate" href="{{ canonical_url | replace: shop.domain, 'www.us.mystore.com' }}" hreflang="en-US" />

此代码段可以添加到您的 theme.liquid 文件的部分。 您需要用您的实际域名替换“mystore.com”实例。 当此代码段到位时,您的页面将使用页面规范输出 hreflang 标记以构建 URL 路径。

由于此方法涉及编辑您的网站代码,如果您选择此方法,我们强烈建议您聘请 Shopify 专家为您应用更改。

使用自定义字段(推荐 Shopify Hreflang 方法)

如何在多个 Shopify 网站中添加 Hreflang 标签,其中包含 URL 句柄不匹配的数千种产品? 您将没有时间逐页添加 hreflang 标记,并且应用程序无法为您执行此操作。

在这种情况下,我们建议使用另一个名为自定义字段的应用程序。 使用自定义字段,您可以在您的网站上创建全新的元字段。 每当我们在 Shopify 上处理复杂的 hreflang 情况时,我们建议我们的客户使用自定义字段来创建 hreflang 元字段。 hreflang 元字段的值输出到页面的部分。

使用这种方法,您可以在 Excel 中构建自己的 hreflang 标记,然后逐页将它们直接添加到自定义字段中。

更好的是,如果您有 Custom Fields Plus 计划,您可以通过 csv 上传导入您的产品 hreflang 标签。 我们经常使用这种方法在几分钟内将数千个产品 hreflang 标签上传到 Shopify。

尽管此方法不是最简单的,因为您需要设置自定义元字段(这需要 Shopify 专家)并构建您自己的 hreflang 标签,但它对于大规模 Shopify hreflang 管理来说是迄今为止最有效的。 如果您想要一种简单的方法来构建自己的 hreflang 标签,我们推荐 Aleyda Solis 的免费 hreflang 标签生成器。

国际域名(新)

Shopify 最近宣布了一项名为国际域名的新功能。 这一发展将允许 Shopify 商家在针对不同语言/国家/地区的备用域/子域上展示他们的商店。

使用国际域名,您可以使用目标国家/地区的 2 个字母 ISO 代码(例如 gb.yourdomain.com)注册备用域名/子域名。 Shopify 然后将自动在每个域/子域中配置 hreflang 标签。 可以在 Shopify 上找到有关如何执行此操作的完整说明。

国际域名确实有一些缺点。 您将不得不在您的域中托管完全相同的页面和产品,这并不适合每个商家。 您也无法跨不同域编辑您的内容(翻译除外)。

话虽如此,这是向前迈出的一大步,表明 Shopify 听取了商家的意见。 我们确信 International Domains 会及时成为我们为 Shopify 推荐的 hreflang 解决方案。

在 Hreflang 方面需要帮助吗?

管理 hreflang 是 SEO 中最复杂的部分之一。 我们的 SEO 团队成功管理了数十个网站的国际 SEO。 如果您需要帮助优化您的国际 SEO,请告诉我们。