网站首页设计指南:如何利用面包屑导航提高用户体验

2024-11-12
来源:网络整理

所有网站都有一个主页或“根”页面,这通常是许多访问者最常访问的页面,也是他们在网站内导航的起点。除非您的网站的页面数量非常少,否则您应该考虑访问者如何从具有一般内容的页面(根页面)转到具有更具体内容的页面。是否有太多围绕某个特定主题的页面,以至于您需要创建一个页面来介绍这些相关页面(例如,根页面 -> 相关主题列表 -> 特定主题)?您是否有数百种不同的产品需要分类到多个类别页面和子类别页面?

使用面包屑

面包屑是网页顶部或底部的一行内部链接,允许访问者快速返回到上一个部分或根页面。许多面包屑将最广泛的页面(通常是根页面)作为最左侧的第一个链接,右侧列出了更具体的部分。我们建议在显示面包屑时使用面包屑结构化数据标记 28。

!使用面包屑导航列表(指示当前网页层次结构)的网站。

为用户打造简洁的导航页面

导航页面是网站上显示网站结构的简单页面,通常包含网站页面的分层列表。如果访问者在网站上找不到该页面,则可以访问此页面。尽管搜索引擎也会访问此页面以尝试抓取网站上尽可能多的页面,但它们的主要目标是人类访问者。

最佳实践

创建自然流动的层次结构

让用户尽可能轻松地从网站上的广泛内容转移到他们需要的更具体的内容。在必要时添加导航页面,并将其有效地合并到内部链接结构中。确保您网站上的所有页面都可以通过链接访问,并且无需内部“搜索”功能即可找到。在适当的情况下,链接到相关页面以使用户更容易发现类似内容。

*要避免什么*:

使用文本进行导航

通过文本链接控制网站页面之间的大部分导航,可以使搜索引擎更轻松地抓取和理解您的网站。创建页面时,使用“a”元素,使用URL作为“href”属性值,并在页面加载时生成所有菜单项,而不是等待用户交互。

*要避免什么*:

为用户创建导航页面,为搜索引擎创建站点地图

为了方便用户,您可以为整个网站或最重要的页面(如果您有数百或数千个页面)提供干净的导航页面。同时,创建XML站点地图文件,以确保搜索引擎可以发现网站上新的和更新的页面。该文件应列出所有相关 URL 及其主要内容的最后修改日期。

*要避免什么*:

显示有用的 404 页面

有时,用户单击损坏的链接或输入错误的 URL 会被定向到您网站上不存在的页面。使用自定义 404 页面 31。

*要避免什么*:

简洁的URL轻松传达内容信息

为网站上的文档创建描述性类别和文件名不仅可以帮助您更好地组织网站,还可以为想要链接到您的内容的用户创建更简单、“更友善”的 URL。如果 URL 极其冗长、含糊不清并且包含很少的可识别单词,访问者可能会感到害怕。

下面显示的 URL 不方便用户使用,并且可能会造成混淆。

!包含无意义数字页面名称的 URL。

如果您的 URL 具有明确的含义,那么它在不同的上下文中可能会更有用且更容易理解。

!此图像显示了一个带有有用且易于理解的页面名称的 URL。

URL 将出现在搜索结果中

最后要注意的一件事是,文档的 URL 通常出现在搜索结果中文档标题的下方。

我们擅长抓取所有类型的 URL 结构(即使它们非常复杂),但最好花时间让您的 URL 尽可能简单。

最佳实践

在 URL 中使用单词

包含与网站内容和结构相关的文字的 URL 对于网站访问者来说更加友好。

*要避免什么*:

创建一个简单的目录结构

使用有效组织内容的目录结构,让访问者轻松了解他们在您网站上的位置。尝试使用目录结构来指示在 URL 中找到的内容的类型。

*要避免什么*:

提供文档访问 URL 的版本

为了防止某些用户链接到某个版本的 URL,而其他用户链接到另一个版本(这可能会导致内容的信誉在两个 URL 之间分散),请确保在您的页面结构和内部链接中使用并引用 1 个 URL。如果您确实发现用户从多个 URL 访问相同的内容,请设置从非首选 URL 到主要 URL 的 301 重定向 33 链接元素。

*要避免什么*:

优化您的内容,使您的网站有趣且有用

创建引人入胜且有用的内容可能比此处讨论的任何其他因素对您的网站产生更大的影响。看到此类内容的用户知道这是优质内容,并且可能很乐意向其他用户推荐该内容。他们可能通过博客文章、社交媒体服务、电子邮件、论坛或其他方式提出建议。

自然的口碑可以帮助您的网站在用户和用户中建立声誉,如果没有优质的内容,很难产生有机的口碑。

!如果您创建有趣的新内容,其他网站可能会将其作为链接推荐给用户。

了解读者的想法(并为他们提供所需的信息)

考虑用户可能用来查找您的内容的搜索词。对某个主题了解很多的用户可能会在搜索查询中使用与刚接触该主题的用户不同的关键字。例如,资深足球迷可能会搜索 fifa(Fédé de 的缩写),而新球迷可能会使用更通用的查询,例如足球季后赛。预测搜索行为的这些差异并在编写内容时考虑到它们(通过使用正确的关键词短语)可以产生积极的影响。 Ads 提供了一个方便的关键字规划器35,可让您查看使您的网站出现在搜索结果中的热门搜索查询,以及为您的网站带来最多用户的搜索查询。

考虑创建一项其他网站尚未提供的有用的新服务。您还可以撰写原创研究内容、发布引人注目的新闻报道或利用您独特的用户群。其他站点可能缺乏这样做的资源或专业知识。

最佳实践

写简单易懂的文字

用户喜欢写得好的、易于理解的内容。

*要避免什么*:

合理安排主题结构

正确地构建内容总是有益的,以便访问者清楚地知道一个内容主题从哪里开始,另一个内容主题从哪里结束。将内容划分为逻辑块或部分,可以帮助用户更快地找到他们正在寻找的内容。

*要避免什么*:

创造新鲜独特的内容

新内容不仅可以让您现有的访客群回头,还可以吸引新的访客。

*要避免什么*:

了解有关重复内容的更多信息36

为用户而不是搜索引擎优化内容

搜索优化优秀 乐云seo包效果_搜索优化优秀 乐云seo包效果_搜索优化优秀 乐云seo包效果

根据访问者的需求设计网站并确保搜索引擎可以轻松访问网站通常会产生积极的影响。

*要避免什么*:

旨在建立用户信任

如果用户发现您的网站可靠,他们将更有可能访问它。

具有良好声誉的网站具有较高的可信度。通过使其在特定领域变得专业和权威来提高您的网站的声誉。告诉用户谁发布了您的网站、谁提供了内容以及网站的目标是什么。购物网站和其他金融交易网站应提供清晰、满意的客户服务信息,帮助用户解决问题。新闻网站应该向用户明确谁对内容负责。

使用适当的技术也很重要。如果购物结帐页面上没有安全连接,用户就无法信任该网站。

展现专业性和权威性

一个网站越专业、越权威,其质量就越高。确保您网站上的内容是由相关主题的专家创建或编辑的。例如,提供来自专家或信息资源的信息可以帮助用户了解文章的专业知识。如果存在这样的共识,最好在您的网页中显示有关科学主题的广泛共识。

提供适量的内容来说明您的主题

制作高质量的内容至少需要以下之一:时间、精力、专业知识和才能/技能。内容应准确、清晰、全面。例如,如果您在网页上描述食谱,请提供易于理解的完整食谱,而不仅仅是一组配料或菜肴的基本描述。

*要避免什么*:

避免分散注意力的广告

我们希望用户看到广告。但是,您不应让广告分散用户的注意力或阻止他们与网站内容互动。例如,广告、补充内容或插页式广告(出现在用户希望看到的内容之前或之后的页面)使用户难以使用网站。了解有关此主题的更多信息。 38

*要避免什么*:

明智地使用链接并编写高质量的链接文本

链接文本是链接内的可见文本。这种类型的文本告诉用户和有关您链接到的页面的信息。您页面上的链接可能是内部链接,指向您网站上的其他页面,也可能是外部链接,指向其他网站上的内容。在这两种情况下,锚文本越好,用户就越容易导航和理解他们链接到的页面上的内容。

!旨在推荐您网站上有用的链接文本的图形。

使用适当的锚文本可以使用户和搜索引擎轻松理解链接页面包含的内容。

最佳实践

选择描述性文字

用于链接的锚文本应至少提供所链接页面的基本描述。

*要避免什么*:

文字简洁明了

尝试使用简短但描述性的文本——通常是几个单词或一个短语。

*要避免什么*:

设置链接格式以使其易于识别

锚文本允许用户轻松区分常规文本和链接。如果用户看不到链接或意外点击链接,您的内容的用处将会降低。

*要避免什么*:

也考虑内部链接的锚文本

通常,您可能会考虑链接是否正确指向外部网站,但更多地关注内部链接的锚文本可以帮助用户更好地浏览您的网站。

*要避免什么*:

注意您链接到的网站

当您将您的网站链接到其他网站时,这些网站将从您的声誉中受益。有时,用户会利用这一点,在您网站的评论部分或留言板中添加指向自己网站的链接。或者有时您提到某个网站的方式可能会对它产生负面影响,但同时您又不希望它抢占您网站的声誉。例如,假设您正在撰写有关垃圾评论的博客,并且想要引用最近向您的博客发送垃圾评论的网站。您想警告其他人注意此网站,因此您在内容中包含指向该网站的链接;但是,您当然不希望这样的链接导致该网站抢占您的声誉。非常适合这个时候使用。

另一个例子,在处理小部件链接时,“”属性将是一个方便的工具。如果您使用第三方小部件来丰富您网站的体验并吸引用户,请检查该小部件是否包含您不希望与其一起放在您网站上的链接。某些小部件可能会添加指向您网站的链接,这些链接不属于您想要向用户显示的编辑选择的一部分,并且它们可能包含您作为网站管理员无法控制的锚文本。如果您无法从小部件中删除垃圾链接,您可以随时使用“”停止关注它们。如果您为您提供的功能或内容创建小部件,请务必在默认代码段中包含链接。

最后,如果您不希望搜索引擎跟踪网页中的所有链接,您可以向页面的标签添加标签。您可以在网站站长博客上了解有关机器人元 的更多信息。

使用“”来处理垃圾评论

如果您将链接的“rel”属性值设置为“”或“ugc”,则表示您的网站上的链接不被关注,并且该链接指向的页面无法从您的页面声誉中受益。为了防止搜索引擎跟踪链接,您需要在链接的锚标记中添加 rel="" 或更具体的属性(例如“ugc”),如下所示:

将文本定位在此处

或者:

将文本定位在此处

什么时候适合使用这个标签?如果您网站上的博客启用了公共评论,这些评论中的链接可能会将您的声誉转移到您可能不想认可的某些页面。网页上的博客评论区域容易出现垃圾评论。不跟踪该区域中用户添加的链接会确保您的页面来之不易的声誉被垃圾网站所玷污。

!此图像显示包含外部链接的用户评论。

自动添加“”到评论栏和留言板

许多博客软件包会自动指示搜索引擎不要跟踪用户评论中的链接,但那些不提供此功能的博客软件包很可能可以通过手动编辑来执行此操作。此建议还适用于您网站上可能涉及用户生成内容的其他区域,例如留言簿、论坛、留言板、推荐人列表等。如果您想认可第三方添加的链接(例如,如果您网站上的评论值得信赖),则无需定位该链接;但是,链接到被视为垃圾邮件的网站可能会影响您自己网站的声誉。 。网站站长帮助中心提供了更多有关如何避免垃圾评论的提示,40 例如使用验证码和启用评论审核。

!此图片显示了一个 () 弹出窗口

使用 HTML 图像优化您的图像

使用 HTML 图像元素将图像嵌入到您的内容中。

最佳实践:

使用 HTML

或者

元素。

语义 HTML 标记可帮助爬虫查找和处理图像。使用

元素中,您还可以为不同屏幕尺寸的响应式图像指定多个选项。您还可以在图像上使用“lazy”属性来提高用户的页面加载速度。

*要避免什么*

使用 CSS 来显示您希望我们索引的图像。

使用“alt”属性

提供图像的描述性文件名和 alt 属性描述。 “alt”属性允许您为图像指定替代文本,如果图像由于某种原因无法显示,该属性可以提供帮助。

搜索优化优秀 乐云seo包效果_搜索优化优秀 乐云seo包效果_搜索优化优秀 乐云seo包效果

!此图像说明了出色的图像替代文本的有用性。

为什么要使用这个属性呢?如果用户使用辅助技术(例如屏幕阅读器)查看您的网站,则 alt 属性的内容会提供有关图像的信息。

另一个原因是,如果您使用图像作为链接,则图像的替代文本将相当于文本链接的锚文本。但是,如果文本链接可以达到相同的目的,我们建议不要在网站导航中的链接中使用太多图像。最后,优化图像文件名和替代文本可以帮助图像搜索程序(例如图像搜索)更好地理解您的图像。

最佳实践

使用简短但具有描述性的文件名和替代文本

与网页的许多其他需要优化的部分一样,简短但具有描述性的文件名和替代文本是理想的选择。

*要避免什么*:

使用图像作为链接时提供替代文本

如果您决定使用图像作为链接,提供替代文本可以帮助您更深入地了解您链接到的页面。这就像您为文本链接编写锚文本一样。

*要避免什么*:

帮助搜索引擎找到图像

图片站点地图 41 提供有关您网站上的图片的更多信息。这将增加您的图像出现在图像搜索结果中的机会。该文件的结构与网页的 XML 文件类似。

使用标准图像格式

使用常用支持的文件类型 – 大多数浏览器支持 JPEG、GIF、PNG、BMP 和 WebP 图像格式。另外,最好将文件扩展名与文件类型相匹配。

建立适合移动设备的网站

当今世界由移动设备主导。绝大多数人在移动设备上进行搜索。该网站的桌面版本可能不容易在移动设备上导航和使用。因此,拥有一个适合移动设备的网站是提高您在线形象的重要因素。事实上,自 2016 年底以来,人们已经尝试主要使用网站的移动内容42来排名、解析结构化数据并生成片段。

了解设备之间的差异

我们的建议主要针对智能手机,但我们也鼓励针对多媒体手机和非智能手机的网站的所有者酌情采用这些建议。

选择移动策略

有多种方法可以使您的网站适合移动设备,并且支持不同的实施方法:

创建适合移动设备的网站后,您可以通过移动设备友好测试 47 来修复影响网站在移动设备上的可用性的问题。

如果您的网站在多个页面(例如博客文章或产品登陆页面)上提供大量静态内容,请考虑使用 AMP 实现静态内容。 AMP 是一种特殊形式的 HTML,可确保您的网站保持快速且用户友好,并且可以在包括搜索在内的各种平台上进一步加速。

配置您的移动网站,以便准确地为您的网站建立索引

无论您选择哪种配置来设置移动网站,都需要注意以下几点:

如果您使用动态服务或拥有单独的移动网站,请告知我们页面何时针对移动设备进行格式化(或何时具有适合移动设备的等效内容)。这有助于在搜索结果中准确地向移动搜索用户提供内容。如果使用响应式设计,请使用meta name=""标签告诉浏览器如何调整内容。如果您使用动态服务,请使用 Vary HTTP 标头来指示基于用户代理的更改。如果您使用单独的 URL,请使用带有 rel="" 和 rel="" 元素的标签来指示两个 URL 之间的关系。确保资源可供爬网。阻止 Web 资源会阻止您完整查看您的网站。当您的 .txt 文件阻止访问部分或全部 Web 资源时,通常会发生这种情况。如果我们无法访问页面的资源(例如 CSS 或图像),我们可能无法检测到该页面是专门为在移动设备浏览器中显示和正常运行而构建的。这意味着我们可能无法检测到这是一个“适合移动设备”的页面并将其适当地提供给移动搜索用户。避免影响移动访问者体验的常见错误,例如视频无法播放(例如,将视频视为页面的重要部分)。如果该页面的移动版本不能提供令人满意的搜索体验,它将在移动搜索结果中排名较低或在移动搜索结果中出现警告。这包括但不限于移动设备上干扰用户体验的全页插页式广告。49 所有功能均可在所有设备上使用。移动用户期望移动设备上具有与其他设备相同的功能(例如发表评论和查看)和内容。除了文本内容之外,请确保所有重要的图像和视频都嵌入到移动版本中,并且用户可以通过移动设备访问。对于搜索引擎,使所有结构化数据和其他元数据(例如标题、描述、链接元素和其他元标记)在页面的所有版本上可用。确保桌面站点中的所有结构化数据、图像、视频和元数据都包含在移动站点上。最佳实践

有关更多信息,请参阅移动适用性指南。 51

推广您的网站

当人们通过搜索或其他方式发现您的内容并链接到您的网站时,您网站的大多数链接都会逐渐添加到您的网站。了解您希望其他人了解您对网站上的内容所做的事情。努力。有效推广新内容将帮助对同一主题感兴趣的人更快地发现您的内容。与本文中提到的大多数建议一样,极端做法实际上可能会损害您网站的声誉。

在您的网站上撰写博客文章,告诉您的访问者群您添加了新内容,是推广新内容或服务的好方法。关注您的网站或 RSS 提要的其他网站管理员也可能能够帮助您传播信息。

努力在线下推广您的公司或网站也非常有帮助。例如,如果您有一个商业网站,请确保将 URL 打印在您的名片、信笺、海报等上。您还可以通过电子邮件定期向客户发送新闻通讯,让他们了解您公司网站上的新内容。

如果您拥有一家本地企业,将您的商家信息添加到“我的企业 52”将帮助您通过地图和网络搜索吸引客户。

!显示与实体商店相对应的富媒体搜索结果的搜索结果示例。

最佳实践

了解社交媒体网站

围绕用户交互和共享构建的网站使感兴趣的人更容易找到相关内容。

*要避免什么*:

吸引来自与您网站相关的社区的用户

许多网站上的主题很可能与您网站上的主题相似。与这些网站建立通信通常对您有利。您的生态系统或社区中的热门话题可以激发新的内容创意或构建出色的社区资源。

*要避免什么*:

分析搜索结果和用户行为 分析搜索结果

主要搜索引擎(包括 搜索)为网站管理员提供免费工具来分析其网站在搜索引擎中的表现。该工具是。

有两种重要的可用信息类型: 我的内容可以找到吗?我的网站在搜索结果中的表现如何?

使用它不会给您的网站带来优先级,但它可以帮助您识别问题,如果解决这些问题,可以帮助您的网站在搜索结果中排名更高。

通过这项服务,网站管理员可以:

微软的Bing 55也为网站管理员提供免费工具。

分析网站上的用户行为

如果您已使用或其他服务来改善网站的抓取和索引编制,您可能会对重定向到您网站的流量感到好奇。像(分析)这样的网站分析程序是理解这一点的有用来源。您可以使用这些网站分析程序:

对于高级用户,分析包提供的信息与服务器日志文件中的数据相结合,可以更全面地了解访问者如何与文档交互(例如,搜索者可能用来查找您网站的其他关键字)。

其他资源

网站站长中心博客 56 网站站长中心博客中的最​​新新闻,您将找到有关搜索更新、新功能等的信息。

网站站长帮助论坛 57 在网站站长产品论坛中,您可以发布有关您网站的问题并查找创建优秀网站的提示。论坛中有许多经验丰富的贡献者,包括杰出贡献者 58,以及临时员工。

网站管理员帐户 59 请关注我们以获取新闻和资源,以帮助您建立一个出色的网站。

" " 60 观看我们为网站站长社区录制的数百个有用视频,让我们的工作人员回答您的问题。

搜索的工作原理 61 使用“搜索”进行搜索时,查看后台发生的活动。您将学到一些非常酷有趣的事实!

在线创业 62 如果您在美国有一家小型企业,您可以免费注册一个网站。 GYBO 是与 GYBO 合作的一个项目,帮助小型企业注册网站并免费使用一年。

原文链接:

分享