电子商城的分页策略 – 电子商务推广

电子商城的分页策略 – 电子商务推广

电子商城的分页策略 – 电子商务推广

当您弄错时,分页可能是一个棘手的 SEO 问题。对于拥有大量产品的电子商务网站来说尤其如此,这些产品无疑会严重依赖分页,以便用户可以找到他们想要的东西。

您可以将本文中解释的概念应用于任何地方的任何分页实现,但鉴于分页问题在电子商务网站上往往更为普遍,而且我在处理它们方面有很多经验——我将专注于这个领域。

我们将开始:

确保电子商务分页对搜索友好的步骤

什么是分页?

网站上下文中的分页是存档页面的排序,用于链接到站点层次结构/结构中较低的其他页面。这些类型页面的最常见示例可以在电子商务类别页面或博客存档页面中找到。

在改进网站结构和内部链接时,分页是一个需要理解的关键概念,我最近在我的博客上写了这个概念 。

电子商务网站上的分页是什么样的?

如果您不太确定分页是什么样的,那么您以前肯定见过它!

分页的两种最常见的实现方式是加载更多按钮和页面底部的编号序列。

 

两者都有效,但使用加载更多按钮还有一些额外的注意事项,我将在本文后面深入探讨。

加载更多分页按钮示例:

New Item Boutique Vancouver

New Item Ring Shop Online

 

 

无限滚动也是浏览档案的一个考虑因素。但是,由于研究表明它具有一些负面的用户体验影响,例如无法轻松到达页面的页脚,因此这变得越来越不受欢迎 。

为什么我应该专注于分页?

分页的非最佳实现会导致一些 严重的问题,尤其是电子商务网站。我个人看到分页问题会导致各种问题,包括:

  • 产品页面被孤立(未在内部链接到)。
  • 不必要的 深层站点结构。
  • 减少分页序列的爬行。

在本文中,我将介绍您需要了解的有关分页的一些关键事项,以确保您的电子商务网站以搜索友好的方式实施它。

1. 小心 JavaScript

使用 JavaScript 在您的分页序列客户端加载下一页而不刷新整个页面是为您的电子商务用户提供良好体验的好方法。

我是使用 AJAX 的大力倡导者,我建议您考虑使用它在您的网站上进行分页。但是,您需要 非常小心地 实现这一点。

基于 AJAX 的分页在电子商务网站中非常普遍,不幸的是,以非 SEO 友好的方式实现它也很常见。当谈到通过 AJAX 实现分页时,主要标准是确保到序列中下一页的 href 链接仍然存在

这意味着在您的产品档案中,指向后续页面(例如 example.co.uk/shop/shoes/?page=2)的链接仍应在页面的 HTML 源代码中或至少 浏览器创建的 DOM 中可见 .


如何查看 DOM 中的内容?

查看浏览器在 DOM 中构建的内容的最佳方法是打开开发工具(通常按 F12 完成),然后前往 Chrome 上的“元素”部分。

此处显示的内容与您查看源代码时看到的内容不同,因为这显示了浏览器实际呈现的内容, 包括已执行的任何 JavaScript。

链接是 DOM,而不是 HTML 源代码

请注意,根据页面呈现的速度,Google 可能不会总是看到这些链接。如果您想检查一下,我建议您熟悉 Google Search Console URL 检查器工具

如果您在其中任何一个中都看不到这些链接,那是因为您很可能使用 JavaScript 加载存档的第二个页面,而没有提供非 JavaScript 替代方法,即经典的 href 链接。

如果您的分页以这种方式运行,  Google 将无法查看存档中的下一页。发生这种情况是因为 Googlebot 和其他搜索机器人不会像用户那样点击执行 JavaScript 的元素。

因此,虽然用户可以为您的分页获得基于 AJAX 的漂亮导航,但 Googlebot 仍然需要能够导航到第 2 页,序列中的每个页面都 包含一个唯一的产品列表,没有重叠

正确执行此操作的站点的一个示例是 Argos。在他们的类别页(像这样 一个),当你检查自己的分页元素,你可以看到序列中HREF链接到每一页。

 


意识到

理想情况下,这些链接需要在 HTML 源代码中可用,而不仅仅是通过检查元素可见。如果它们仅在您检查元素时可见,而在 HTML 源代码中看不到它们,则您将使用 JavaScript 注入它们,这可以降低 Google 看到链接的可能性。


在 Argos 站点上,您可以看到单击链接到第 2 页的按钮后,一个新页面,加载未触发;您将被带回页面顶部,第 2 页上的所有产品都已加载。这是用户将看到的行为,而 Google 将跟随链接并被带到 此页面。

你可以说这是通过AJAX实现通过或者使用一个插件,监测记录,如HTTP标头请求 这一个 或刚刚开放,在Chrome浏览器开发工具,网络选项卡,并检查“文件的要求,当您导航到不同的页面使用分页。

这是正确实现基于 AJAX 的分页的一个很好的例子。

他们甚至还使用来自HTML5 历史 API 的pushState  来更新 URL,因此看起来整个页面都刷新了。

虽然要求不高,但我还建议使用基于 AJAX 的分页系统来实现这一点。您可以在此处查看由 John Mueller 创建的历史 API 实践示例,其中包含无限滚动/编号分页序列 。

如果这似乎是一个很大的考虑,也有图书馆在那里,这将使这个过程变得更容易,比如这 一个

2. 考虑加载更多按钮 – 温哥华手机程序开发

如果您要使用加载更多按钮方法而不是编号分页或无限滚动,则还需要考虑一些其他事项。

按照之前的建议,即使您在加载中添加了更多的 href 链接,您仍然会使您的网站变得不必要地深入。

这是因为与允许您添加从第 1 页到第 6 页的深层链接(例如)的编号分页不同,您只会从第 1 页链接到第 2 页,然后从第 2 页链接到第 3 页等等。

这将有助于您拥有 更深的站点结构, 因为在站点中到达更深层次的产品页面的点击深度会增加。

这 将对 链接资产如何分配到站点层次结构中更深层次的产品页面产生负面影响。反过来,这将对您的产品页面在长尾搜索查询中的排名产生负面影响 。

为了避免这种情况,您可以做的是同时实现加载更多和编号分页。然后,您可以获得加载更多按钮的 UX 优势,同时还允许用户跳转到特定页面并让 Google 执行相同操作。

加载更多和编号分页组合的示例。

此选项可防止在涉及站点结构时加载更多按钮引起的问题,并让您利用编号分页的好处。

编号分页将点击深度缩短到档案中更深的分页页面。

另一种选择是实现编号分页,但将其包装在 <noscript> 标签中。

这意味着当用户禁用 JavaScript 时,他们将看到带编号的分页并可以使用该分页导航网站。此选项的缺点是不能 100% 确定 Google 实际上会查看 noscript 标签中的内容。

我们听到的最后一次更新,Google 倾向于 忽略 noscript 中的内容,因此请仔细测试。

如果您不想同时显示加载更多按钮和编号分页,您还可以像上面的模型一样在页面上实现编号分页,但添加一个 display:none 以通过 CSS 隐藏它。

这样,链接位于 HTML 源代码中,但隐藏在前端,因此 Google 仍应 正常查看链接并抓取它们。但是,我们从Reasonable Surfer 专利 中了解到 ,Google 似乎喜欢根据链接被点击的可能性来分配 PageRank。

一种系统基于与从链接文档到链接文档的链接的不同特征相关的特征数据和与与该链接相关联的导航动作相关的用户行为数据来生成模型。系统还会根据模型为文档分配等级。

— 根据用户行为和/或特征数据对文档进行排名

尽管该专利没有特别指出与隐藏链接有关的任何事情,但如果您打算使用 CSS 隐藏链接,请务必谨慎行事并考虑测试对爬行和排名的影响。

3. 使用查看所有页面来扁平化您的电子商务结构 – Web Design Vancouver

规避分页所有并发症的一种方法是简单地让类别页面默认显示所有产品。

如果您还有预先存在的分页 URL,您可以更新这些上的规范标签以指向新的查看所有页面的 URL。

这有利于 扁平化您的网站结构, 因为访问产品的点击次数减少了。虽然这种方法非常适合 UX 和 SEO,但唯一的复杂之处在于 网站速度。

如果您在该类别中有大量产品。你可能会大量增加:

  • 浏览器需要呈现的 HTML。
  • 要加载的图像数量。
  • 数据库调用的大小。

虽然其中一些可以通过延迟加载图像 和页面缓存/静态交付您的站点以及使用 JS 加载动态元素来规避 。您仍然需要进行一些测试并密切监视以确保性能良好。


如何测试速度影响?

  • 如果您正在寻找有关网站速度测试的建议,请查看我关于一些最好的网站速度工具使用的帖子。
  • 如果您想衡量此更改对用户的影响,请查看我的数据工作室模板,该模板使用 CrUX 数据显示有关您网站速度的真实用户数据。
  • 如果您正在寻找有关提高速度的建议,请在此处查看我的 SEMrush 指南, 或者在我的可过滤站点速度提示列表中查找一些顶级建议。

如果您发现查看全部方法由于速度问题而不起作用,请在速度成为问题之前确定您在类别存档页面中包含的产品数量。

您可以通过逐步增加您可见的产品数量来检查这一点。

这种技术是电子商务网站改进内部链接的好方法, 因为当您将单个存档页面中的产品数量从 12 个增加到 24 个时,您已经 有效地 将序列中分页页面的数量减半

虽然这不会像查看所有页面那样扁平化您的网站结构,但您仍然设法减少点击深度以到达产品页面。

4. 使用自引用规范

我不会在这里详细介绍,但是设置分页时的一个常见错误是:

  • 将序列中的所有页面规范化为第一页。
  • Noindex 所有分页(稍后会详细介绍)。

在标准分页设置中,您应该做的是在每个页面上添加一个自引用规范,而不是犯这些错误,如下所示。

 

我在分页中看到的一个常见错误是有时 CMS 也可能创建一个 /dresses/1/ 的页面,它是 /dresses/ 的副本。在拥有大量档案的大型站点上,这可能会导致大规模复制问题。

如果是这种情况,您应该将重复的 /1/ URL 规范化到存档的正确第一页(在本例中为 /dresses/)。

5. 如果你真的需要,只有 Noindex – 温哥华网页设计公司

在分页页面上发现的一个常见问题是它们不必要地包含 noindex 标签。

虽然向分页页面添加 noindex 标签并不总是有问题,但这样做可能会 降低抓取频率。

基本上,我们会尝试多爬几次,看看 noindex 是否消失了,或者页面是否从 500 或其他情况恢复,如果 noindex 仍然存在,那么我们将慢慢开始移动或不爬取该页面那经常。

— 加里·伊利斯 – https://www.youtube.com/watch?v=GVKcMU7YNOQ

理想情况下,每个页面在序列中都应该是有价值的,因此您应该在存档中的每个页面上都包含自引用规范

但是,在某些情况下,分页页面上的 noindex 标记是有意义的。我们最近从 John Mueller 那里听到了关于在分页页面上添加 noindex 标签的见解:

……最后,我认为主要归结为:“分页系列中的这个页面是否带来欢乐?” 如果没有,那么就 noindex 吧。
一些站点认为分页系列中的所有页面都很重要,因此他们将它们编入索引(使用 rel-next/prev 的奇特页面)。一些站点将分页系列限制在某个数量上,也许让第一个被索引,而其余的则没有。
该决定有时也基于分页系列的内容。例如,如果它是链接的详细信息页面列表,那么您可以决定是否可以访问所有页面,即使您没有索引完整的分页集(如果您交叉链接到相关帖子/产品,那么通常情况就是这样)。

— Reddit 上的 John Mueller – https://www.reddit.com/r/TechSEO/comments/ag77vi/canonicals_and_angular_js/eh9zqut?utm_source=share&utm_medium=web2x

所以,总结一下:

  • 尝试使分页页面尽可能有价值。
  • 如果您觉得它们对用户没有价值,请不要将它们编入索引,但请注意,这可能会减少它们被抓取的频率。
  • 如果您决定不建立索引,请考虑是否有其他爬行路径来查找在不建立索引的页面上列出的这些产品,例如,通过其他类别或过滤器。
  • 在大多数情况下,您将希望使用自引用规范而不是 noindex 标签。

人们倾向于不索引存档后第 2 页的一个常见原因是他们看到 Google 向用户显示了错误的页面,例如第 4 页而不是第一页。这将我们带到提示