Hellohello,各位小伙伴们早上好呀!又来到疯狂星期四啦~今天我们来分享一下有关网站导航的内容吧。感兴趣的小伙伴可以点点赞和关注哦!良好的网站导航是网站必不可少的功能。根据 Top Design Firms 的一项研究,38% 的消费者在第一次浏览网站时会查看页面的导航链接和布局。
导航的重要性不容低估。而且,不难理解为什么访问者更喜欢实施网站导航最佳实践的网站。它可以帮助他们快速轻松地找到他们正在寻找的信息,因此导航是用户体验和网站策略的重要组成部分。什么是网站导航?网站导航是一组用户界面组件,可帮助访问者查找网站上的内容和功能。这些组件可以是副本、链接文本和按钮以及菜单。虽然帮助访问者从一个网页移动到另一个网页是主要任务,但这并不是唯一的任务。导航还可以帮助访问者理解网站上各个页面之间的关系。但在实践中,导航究竟是什么样的呢?让我们来分析一下。什么是网站导航菜单?网站导航菜单是指向其他网页(通常是网站内部页面)的有组织的链接列表。导航菜单出现在网站的页眉或侧边栏中,使访问者能够快速访问最有用的页面。据UXmatters 的一篇文章称,导航被视为网站信息架构 (IA) 的冰山一角。水面之下是前端访问者无法看到的这座冰山的部分:构建网站信息架构所投入的研究、策略、管理和组织。水面之上是导航界面,通常以一系列超文本链接和搜索栏的形式呈现。
因此,您的网站信息架构在导航界面中不可见,但却是该界面的基础。这最终让访问者感觉到内容是相互联系和分类的,以满足他们的需求和期望,但实际上从未显示用于识别和组织内容之间关系的所有电子表格和图表。以下是一个网站层次结构的示例。乍一看有点吓人,但当你了解每个术语的含义时,它就很容易理解了。您可能只会在第一级的主导航菜单中看到三个部分名称。然后,子页面可能会嵌套在子导航菜单中。
网站上的子导航是什么?子导航或本地导航是网站访问者可以找到网站信息架构下级类别的界面。这些通常是主导航链接的子类别。以纳什维尔动物园的非营利网站为例。主导航菜单包含导航项“支持”。当您将鼠标悬停在该项目上时,会出现一个子导航菜单,提供多种支持动物园的方式。这种做法很有效,因为访问者可以无缝找到他们想要的内容,但菜单乍一看并不让人眼花缭乱。这是一个双赢的结果。
网站导航有哪些类型?为什么网站导航如此重要?首先,它会影响访问者是否到达您的主页并浏览或点击“返回”按钮,从而导致更高的跳出率。因此,您应该深入思考构建网站导航的最佳方式。这就是不同类型的网站导航发挥作用的地方。如何构建网站导航取决于您的目标受众以及您认为最直观、最易用的格式。下面我将分享一些您在构建网站时可以考虑的常见网站导航类型。水平导航栏让我们从水平导航栏开始。您可能已经猜到了,水平导航栏是最常见的类型。它将主要页面并排列出并放在网站标题中。许多网站都具有相同的部分,例如“关于”、“产品”、“定价”和“联系”,因为访问者希望看到它们。虽然这些部分受欢迎是有原因的,但您不应该害怕通过定制菜单来定制您的网站。构建导航栏时,请考虑网站的目的和受众。您想在网站上实现什么目标,访问者在寻找什么?我建议您先回答这两个问题,然后再从哪里开始。以Blavity上的导航栏为例。特色部分包括三个内容类别——“娱乐”(带有子菜单)、“文化”和“小型企业”——以及“Blavity U”和“Blavity Brands”的链接。这些精心策划的类别更有可能让访问者轻松访问他们正在寻找的页面,而不是标准的“关于”、“定价”和“联系”页面。
下拉导航菜单接下来,我们有下拉导航菜单。此选项非常适合内容丰富且 IA 复杂的网站。如果您希望菜单包含大量页面链接,您可以考虑使用此选项,因为您无法并排列出所有选项。相反,您可以在顶级导航栏中列出最关键或最一般的项目。然后,您可以在下拉菜单中添加其余内容。以丝芙兰为例。该网站提供了一个很好的例子,因为它提供了如此多的产品和服务。您可以将鼠标悬停在其网站上的任何主要导航链接上,然后会出现一个详细的下拉菜单。在下面的屏幕截图中,当我将鼠标悬停在“护肤”上时,会出现子菜单。
汉堡导航菜单另一个您应该牢记的网站导航选项是汉堡包。您可能已经熟悉此菜单,因为它在移动网页设计中很流行。如果您使用此方法,您的导航项将在较大的屏幕尺寸上水平列出。然而,在较小的屏幕上,它们会折叠在汉堡按钮后面。当访问者点击这个三行图标时,会出现一个垂直下拉或水平弹出的导航链接。如果您的网站空间有限,或者您不想让导航占用大量空间,汉堡导航菜单可能是正确的选择。查看 Nettle Studio 移动网站上的汉堡菜单。
垂直侧边栏导航菜单接下来我们有垂直侧边栏导航菜单。这是网站导航的绝佳选择,因为它提供了无缝的用户体验。项目堆叠在一起并放置在侧边栏中。不可否认,这不如水平导航受欢迎,但垂直导航有好处。空间不那么有限,因此您可以编写更长的导航链接。还有更多顶级选项的机会。请看一下下面 Arbor Restaurant 的垂直侧边栏。
页脚导航菜单另一个选项是页脚菜单。它通常与水平导航栏配对,并对其进行扩展。如果访问者在页眉中没有看到他们需要的链接,他们可以向下滚动到页面底部,在那里他们会找到更多选项。《纽约时报》页面顶部的水平导航菜单中有很多导航链接。其页脚菜单有 50 多个链接,其中大多数属于主导航菜单中列出的类别之一。虽然这确实可以轻松访问重要的子页面,但它可能会让人不知所措——所以请谨慎使用。
OK啊小伙伴们,我们今天的内容暂时先到这里,明天我们继续分享网站导航的相关内容吧!感兴趣的小伙伴们不要忘记点赞关注和收藏哦!我们明天见啦~
ps:有需要国区谷歌苹果无限额收款结汇的小伙伴可以后台dd我!!祝大家天天开心,万事顺意!!!
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。