移动企业官网移动导航设计要点
移动优先已经成为共识,即便是响应式网站,也会优先考虑移动端。如此一来,就需要重视官网导航设计。
什么是移动导航?
在手机上浏览时,网站导航是用户体验的核心。移动导航是通过应用程序或移动网站通知和引导访问者的功能。与桌面导航相比,由于空间限制,移动导航往往面临更多挑战。
随着手机使用量的增加,用户体验和用户界面设计师多年来通过进行用户体验研究和测试不同的手机模式,将手机导航变成了一种艺术形式。移动网站导航和移动应用程序导航都是本次对话的一部分,调查用户如何使用移动设备,以更好地了解以较小规模交付内容的最有效方式。
好的移动导航不仅仅是为用户找到从A点到B点的最快方式。它有助于用户进行合理的旅程,防止用户受挫,并允许他们通过移动网站或应用程序了解更多关于您的品牌和产品的信息。
四种基本的移动导航模式
了解最常用的移动导航模式和网站菜单是制作让用户满意的应用程序或移动网站的**步。下面,我们介绍四类常见的移动导航。
汉堡菜单
到目前为止,构成经典汉堡菜单的三条水平线在移动网站设计领域无处不在。小图标隐藏菜单,直到用户点击它。这是移动用户界面非常流行的导航模式。
因为汉堡图标将菜单隐藏在主页上,所以设计师可以提供更多菜单项或使标题更长,而不会挤占页面。大多数时候,使用汉堡菜单,因为它有更多的信息。
选项卡栏
标签栏是当今移动应用程序中最常见的导航模式,它确实适用于所有类型。它位于屏幕底部,是一种更易于发现的设计导向导航模式。通常,选项卡栏包括提供直接访问导航项的图标。它的互动性和在拇指区的位置使它成为一种特别舒适的导航模式。
由于操作系统指南允许您一次最多包含五个项目,作为所有者,您需要选择要在主导航上显示的最重要的内容。
基于网格的导航
包括移动应用程序主屏幕上的大多数菜单项。与汉堡菜单类似,可以使用基于网格的导航来容纳你想要的任意多个项目,因此它是多功能的,在设计时有很多选择。
抽屉导航
顾名思义,抽屉导航是一种移动导航模式,其中大多数导航内容都包含在选项卡或侧边栏菜单后面。使用与汉堡菜单类似的概念,导航抽屉可以隐藏许多菜单项。虽然菜单项是隐藏的,但如果没有清晰的组织,导航系统将无法正常工作。
移动导航设计技巧
技巧一:确保内容清晰可辨。
由于移动屏幕较小的限制,确保用户轻松阅读您的内容非常重要。注意字体大小和样式,当它们放在小屏幕上时,可能会让人目不暇接,并尽可能减少书面内容的数量。
技巧二:在导航菜单中包含基本项。
如果使用的移动导航模式限制了可以包含的菜单项的数量,请战略性地考虑只包含用户最重要的页面。尽管基于网格和汉堡菜单的移动导航允许更多的选项,但您仍然应该认识到它们的过载。
技巧三:使用基于手势的导航吸引观众。
基于手势的导航是指使用手势来控制和导航移动网站或应用程序的用户界面。可以使用它来增强您的导航模式,允许用户在设备上执行操作,例如向左或向右滑动、在屏幕之间移动或捏住并展开手指以放大和缩小。通常,手势交互提供了与电子设备交互的更自然和直观的方式。
技巧四:使用浮动动作按钮
浮动动作按钮(FAB)是显示在用户界面顶部的圆形按钮,当按下时触发主要动作。设计师通常将其放置在屏幕的角落,并使其突出以吸引用户的注意力。FAB可快速方便地访问导航抽屉等基本功能。
技巧五:应用单手导航原则。
单手导航使用户能够仅使用一只手在移动设备上执行常见任务。