来到一个新的城市,用全新的视角去体验一切总是很有趣的。然而,这种兴奋只会持续很长时间,直到你需要找到你的酒店或吃饭的地方。为此,你需要一张地图或向导才能到达那里;没有方向,你可能很快就会迷路或沮丧,宁愿离开。

同样的观点也适用于网站导航。当用户点击你的登陆页面时,你要确保网站上有他们需要的一切来回答他们的问题——并成功地销售你的产品或服务。

下面是导航类型的分类,如何为网站的成功做好准备,以及什么时候你会知道你已经尽了一切努力来定位你的网站访问者。让我们开始吧。

什么是网站导航?

如果你以前没有听说过这个术语,网站导航是一个内部链接的菜单,它允许用户通过一次点击快速访问网站的不同部分。在电脑上浏览时,导航栏通常放在网站的顶部横幅上。移动导航可能是设备角落的可折叠菜单。

网站导航的一些常用名称包括:

  • 主要的导航。
  • 横幅。
  • 菜单栏。
  • 菜单。
  • 导航栏。
  • 导航。
  • 上面的链接。

在这里,网站访问者可以找到主页按钮和其他一些重要页面的快速链接,这取决于公司。它就像目录一样,为每个登陆页面的基本内容提供一般指导。

域导航和用户体验

如果你的网站有一个以上的页面,那么你需要一个导航栏。您希望您的客户能够快速轻松地找到他们需要的信息,以避免混淆或沮丧。这种易于使用和直观的导航系统将改善用户体验(UX)。

糟糕的用户体验会赶走客户;英国和美国60%的消费者根据storyblock的一项调查,如果一个网站提供了糟糕的用户体验,他们就会彻底放弃它。有了一个改进的网站导航设计,客户更有可能花更多的时间在你的网页上挖掘你的产品,阅读博客,下载电子书等。用户体验不仅仅是锦上添花,而且是SEO成功的必要条件。

简单的网页导航

糟糕的用户体验设计也会让你的SERP排名处于危险之中。搜索引擎算法“爬行”浏览你的网站,了解每个页面链接在一起的情况,以及用户是否能直接找到信息——对谷歌来说,这就是可用性。机器人会点击每一个页面,就好像他们是一个客户,回来的信息是如何抓取你的网站。点击你的网站越容易,你的SERP分数就会越高。

让我们从一个例子开始:

网站导航的最佳实践,你需要导航地图好

这个来自Well&Good的主页为用户提供了一个简单的方法来找到他们想要阅读更多的主题。作为一个生活方式博客的来源,Well&Good希望帮助他们的读者在他们的页面上感到舒适,无论他们只是在寻找最新的话题,还是对某些特定的东西感兴趣。

当你浏览他们网站的每个部分时,都有指向其他页面的链接,并且每个页面都以某种方式连接在一起——使得导航非常简单。

在某些站点上,您可以将鼠标悬停在某个主题上,然后会出现一个包含更多选项的下拉菜单。另外,在Well&Good的例子中,链接直接跳转到另一个登录页面。哪个更好?嗯,这取决于你的客户的需求和他们认为最有价值的内容。

但是现在,让我们深入挖掘一下网站导航术语。

表面之下是什么?

改进导航菜单的结构可以帮助用户更容易地参与其中。无论你是什么类型的组织,用户自然会对你的价值观、使命、服务或产品等有疑问——他们希望你能给出答案。

用户可能无法一下子理解你网站的全部内容,这没关系。然而,他们应该能够毫不费力地找到他们想要的东西。所有这些都在于构建网站结构,也称为信息架构。

建筑信息体系结构

当你构建你的网站设计的这一部分时,有很多复杂的事情要考虑。网站结构中每个页面之间的关系是一个开始的地方。

你不会在杂货店的指甲油旁边找到鸡蛋,就像你不会把你的服务页面和你的博客放在一起一样。每个页面一起工作的方式进一步改善了每个访问者的体验信息架构(IA)。IA是您的网站以用户可访问的方式构建的方式。

网站导航结构

为了了解内部页面是如何协同工作的,您可能需要从站点映射开始。这是你所有页面的列表,以及它们如何相互作用——从你的主页到你的联系页面。

从这里开始,您应该为站点的每个部分设置层次结构。首页应该在你的站点地图的顶部,或者与你的域名相关的页面列表的顶部,然后是对你的客户最重要的子页面。

网站导航的最佳实践,你将需要UX展位SiteMap的例子

在这里,您可以看到每个页面如何与其他页面相关,所有页面都从主页开始。第二行的3个部分可能出现在导航栏上,每个子页面可以作为下拉菜单项出现,也可以通过提示导航到下一页。

让我们来看看一些例子,这样你就可以看到不同类型的网站导航结构之间的差异,因为它们与不同的行业有关。

6种网站导航(附示例)

你的导航是针对你的行业、产品和服务的。更重要的是,它应该代表客户的需求。这里有一些更常见的菜单栏类型给你一些想法。

全球网站导航

也被称为水平导航条,全局网站导航在屏幕顶部飞行,永远不会改变,不管你目前正在查看的页面。在这里,你可以找到一家公司的“产品”、“博客”、“作品集”和“联系我们”页面,但这在很大程度上取决于行业。

HydroJug的网站通常是具有全球导航的电子商务网站的标准:

你需要的网站导航最佳实践

通过“商店”下的下拉菜单,购物者可以快速找到他们的水瓶产品。接下来是一些有用的链接,网站访问者可以在博客上了解更多关于这个行业的信息,或者找到如何装饰和定制他们的水瓶——这些都是购物者的重要物品。

分级网站导航

对于一些用户来说,在浏览网站时体验个性化是有帮助的,也是他们所期待的。使用分层网站导航,菜单栏会根据用户点击的链接而变化。这是典型的许多报纸和杂志网站,那里有很多不同的信息都挤在一起。

网站导航的最佳实践,你需要CNN分层

美国有线电视新闻网网站,否则一些子类别将占据整个页面。当用户点击进入一个类别时,子类别就会出现在相应的位置。

网站导航的最佳实践,你需要CNN分层的例子

这是一种主导航,读者可以快速进入更多的小众主题。如果没有这些分类和子页面,主页会让任何读者不知所措。相反,用户可以像浏览纸质报纸一样翻到他们感兴趣的主题,或者浏览主页上的标题。

下拉菜单

下拉菜单对于具有相当复杂的IA系统的产品页面特别有用。横向列出产品类型会使页面不堪重负,并且需要用户向下滚动太多。然而,通过按类型和/或用途组织产品,网站访问者可以很容易地找到他们需要的东西。

网站导航的最佳实践,你将需要家得宝

家得宝(Home Depot)的网站是一个很好的例子,有用的下拉菜单风格。如果你曾经走进过这些家装店,你就会知道他们有大量的产品和部分。对于这些类型的零售商来说,组织是保持顾客回头客、在线和店内消费的关键。

水平菜单栏

有一种方法可以在网站的一侧组织网站导航,而不是在顶部组织。为《福布斯》其他使用这种风格的网站,用户可以找到他们想要的东西,而不需要导航占据整个页面。

你需要的网站导航最佳实践

汉堡菜单

不是为了让你饿肚子,但汉堡菜单已经迅速成为移动设备上最常见的导航样式之一。水平菜单将折叠成我们已经习惯的3行汉堡包图标。当移动设备上的屏幕空间有限时,这个图标可以帮助用户浏览网站,找到他们需要的东西,并返回到他们正在寻找的东西。

你需要的网站导航最佳实践

耐克的健身移动应用程序让你可以轻松地在应用程序中漫游,并立即进入你的锻炼——无论是从主页还是通过下拉菜单选择一个项目或保存的锻炼。

页脚菜单

并不是所有的东西都应该放在页面的顶部。网站导航策略的优先级是很重要的。有些页面对用户体验来说是必不可少的,因为客户经常使用它们,而其他页面则不是,比如你的公共关系页面、军事折扣或职业信息。然而,这些页面需要出现在你的网站上,为那些将使用它。介绍:页脚菜单。

让我们一起来看看三星的网站。虽然顶部的横幅菜单栏有9个部分和许多不同的副标题,但页脚有49个-一对甚至不能放在折叠下面。这个全面的页脚菜单让用户有机会直接点击一些他们可以在横幅中找到的子类别,并找到其他不相关的页面。

你需要三星的网站导航最佳实践

8 .网站导航最佳实践

正如你所看到的,有很多选择,只有一两个可能是最适合你的品牌。这里有一些网站导航的最佳实践,可以帮助你优化你的用户体验设计。

1.衡量什么是有效的

退后一步,看看什么已经为你的网站工作是一个很好的开始。虽然这一步可能是其他6个步骤中更技术性的,但它是最重要的一个。

问自己以下几个问题:

  • 用户如何找到你的网站?
  • 他们到达哪个登陆页面?
  • 登陆页面附加了哪些关键字?
  • 用户通常在你的网站上停留多长时间?
  • 他们大部分时间都在哪里度过?
  • 他们最常使用哪个CTA按钮?
  • 你的网站在serp上排名如何?

这里的重点是发现阻碍你的网站在网上取得成功的障碍。浏览每个页面是容易还是困难?你的网站是否针对无痛爬行进行了优化?使用谷歌分析创建关于网站运行状况和用户模式的报告。

2.规划你的网站结构

每个网站访问者都有一个共同点:他们想知道你能提供什么。你可以使用一个简单的站点地图创建器来模拟你的网站导航,这样每个类别都有它的位置。

另一种方法叫做卡片分类。在自己的卡片上写下一些导航部分和子类别。让你的同事过来把每张卡片按他们认为最有意义的部分分类。寻找模式和常见的配对,直到您的团队能够形成您的IA的主干。

3.遵循行业标准

通过对行业内的竞争对手做一些调查,你会找到一些通用的标准和术语,在你的菜单中使用。虽然你想要尽可能地保持对你的品牌的忠诚,但客户可能会对你的业务有一定的期望。

寻找放置菜单的位置,以及如何通过汉堡包下拉按钮等可识别的图标来指示其功能。

4.在整个网站中保持菜单的一致性

无论你是使用像CNN那样的响应式菜单,还是像HydroJug那样提供相同的菜单,都要确保用户无论在哪里都知道该去哪里。

你的用户永远不应该觉得他们已经陷得太深而没有出路。(就连《爱丽丝梦游仙境》也有点厌倦了这种混乱,想再在花下小睡一会儿!)无论你是选择汉堡包下拉菜单还是页脚菜单,在台式机还是平板电脑上,用户都应该有办法回到他们开始的地方。

5.整理

考虑最重要的主题和子类别,这将帮助用户找到他们正在寻找的东西,并坚持这些。在这里使用留白将有助于让用户专注于导航的开始和结束位置。较低优先级的菜单项可以放在页脚横幅中,以帮助减少顶部导航栏的混乱。

6.包含搜索栏

在滚动了一会儿之后,用户可能只想输入一个关键字来找到他们要找的东西。确保您的网站有一个强大的搜索栏,使这一努力尽可能容易。通常,在菜单横幅的右上角有一个搜索栏,它有一个可以立即输入或展开的空间。

7.链接你的Logo

我们总是需要知道回家的路。你的logo不仅应该出现在整个网站的同一位置,而且还应该是可点击的,作为返回主页的一种方式。它将作为一个重置按钮,当用户已经有点太深入你的网站杂草。

8.考虑手机用户

在3.319亿美国人口中,85%的人拥有智能手机。在你的手机上从一边到另一边滚动阅读一个段落是一种快速的方法,以确保用户从你的网站反弹。当你开发你的网站设计时,考虑开发一个特定的移动友好的主菜单。

什么是优秀的导航菜单?

提高网站的可用性和可访问性需要一些挖掘和用户研究。关键是始终确保用户(和SERP机器人)可以浏览您的网站,找到他们正在寻找的内容,并了解每个页面之间的关系。

当你看到转化率上升,用户在你的网站上花费更多的时间时,你就知道你已经达到了终点线。无论是购物还是探索,友好的指导都是值得赞赏和必要的。

网站导航可以大大提高用户体验。虽然这需要一些工作,但你所需要的只是适当的策略。

Lauren是Brafton的一名内容作家。她来自美国各地,目前住在夏威夷大岛。她喜欢水彩画,瀑布狩猎,并成为她的三只猫和一只狗的宠物妈妈。