回到主页

为移动优先索引设计内容

您的移动网页很快就会成为Google搜索排名中使用的默认版本。如何确保它们提供易于在较小屏幕上阅读的优质内容?专栏作家Patrick Stox有一些想法。

面对现实:你不是一个文学作家,人们不会盯着你写的每一个字。不要误解我的意思,在网页上提供全面的信息非常棒,但用户也不想永远滚动 - 特别是在移动设备上。

移动内容需要使用户更容易到达主要点而不会删除内容,因为用户可能希望更多地挖掘细节。您的内容结构比以往任何时候都更重要,您的内容需要可导航,可浏览和易消化。

目录
目录是展示您如何组织内容的好方法,并结合HTML书签,它允许用户快速跳转到可能感兴趣的页面部分。例如,我的本文目录是:

目录
HTML标题
可扩展内容
选项卡
过滤器
摘要,突出显示,TL; DR项目
符号或列表
粗体或斜体文本
突出显示要点
桌面怎么样?

我最喜欢的一个实现是Google Developer文档,您可以在标题下方导航,并可以快速找到您需要的任何部分。它们甚至使它可扩展,因此它不会立即压倒用户。

HTML标题
HTML标题或标题标签有助于将您的内容组织成各个部分,使用h1 - h6以逻辑方式构建您的页面。本文的主题副标题包含在h2标记中,而文章标题本身包含在h1标记中。标题标签使内容易于浏览,并且是目录中锚链接的良好目标。

可扩展的内容
可扩展内容区域(也称为“手风琴”)通常用于更多详细信息或常见问题解答部分。它们是保持页面更短,更易于导航的好方法,同时仍然可以访问重要信息。Google网站管理员趋势分析师Gary Illyes表示,出于用户体验隐藏的内容将在移动优先索引中获得全部权重,而桌面索引会略微折扣这些隐藏内容。

了解Lowe's如何通过一个页面上的产品描述,规格,评论,问答和文档来实现这一点 - 但即使对于移动用户来说,它也不会令人难以理解。如果他们默认扩展了所有这些内容,那么在我到达页面底部之前,我会厌倦滚动。

标签
由于空间限制,选项卡式内容在移动设备上的使用较少,但这是可扩展内容的替代方案。它起到同样的作用,即隐藏可能不需要的内容。了解Staples如何让您在一页上保留内容的同时查看说明,规格和评论。

过滤器
过滤器是一种简单的方法,可以删除用户可能不感兴趣的大部分内容。通过为他们提供仅查看他们想要查看的内容的选项,您可以更轻松地找到他们正在查找的内容经历所有的事情到达那里。我最喜欢的视觉效果之一是Northcutt的谷歌排名因素。

摘要,亮点,TL; DR
没有时间阅读故事?如何快速掌握文章的要点?这有助于移动阅读器快速消化您的内容,并确定他们是否想要更深入地阅读。我通常认为这是在新闻,金融和体育网站上完成的,其中最重要的信息可以归纳为几点。这是来自CNBC的一个:

子弹点或列表
项目符号和列表是快速传达大量信息的好方法。

第1点
第2点
第3点
清单项目1
清单项目2
清单项目3
粗体或斜体文字
大胆的文字引人注目 - 斜体文字也是如此。粗体文本也可以成为列表中的一个很好的补充,使主要项目或点更加突出。

突出重点
引号,块引号或可推文的时刻很容易让读者识别并告诉他们您发现这些信息非常重要,足以让它脱颖而出。这些格式的统计工作非常好。

到目前为止,90%的人可能会阅读这个拉引号。
桌面怎么样?
我专注于移动设计,但许多相同的实践也适用于桌面。其中一个最好的例子是谷歌开发者,其中目录实际上变成了一个粘性边栏,随之而来,允许您在各部分之间快速导航。

我将添加一个警告,特别是对于可能默认使用CSS或JS隐藏的内容。确保将所有内容加载到DOM中。如果您必须在将内容加载到DOM之前采取措施,那么Google将无法看到它。默认情况下加载然后隐藏是可以的。

现在是时候考虑一​​下您的移动阅读器以及他们将如何使用您的内容。尽可能简单地让他们找到他们正在寻找的信息,他们会继续访问您的网站并与您开展业务,这将感谢您。

所有文章
×

还剩一步!

确认邮件已发至你的邮箱。 请点击邮件中的确认链接,完成订阅。

好的