跳至主要內容
导航栏设计技巧

评判导航菜单的设计好坏有多种不同的维度,由于它太过常用,它的好坏并没有得到更多重视。实际上,导航作为网站设计的一个基础组成部分,对于可用性的要求并不低。以下是一些常见的设计技巧。

超大菜单栏

超大菜单栏

即使许多设计师不喜欢这样的设计,而且从美学的角度上它也是反智的,但是对于许多客户而言,它依然是一个客户反响很好的设计方案。但是这样的设计对于用户可能还是有一些困扰,并且没有提供真正有用的功能。

只有极少数的电商类网站能够真正适合使用超大导航栏的,因为他们确实需要足够的空间来承载大量的导航栏目。不过过大的导航栏可能还是存在一些可用性问题的。


J.F.Gaufrid大约 6 分钟设计导航Navbar
导航栏设计

其实网页或者 App 中的导航(Navigation)这个概念远不止我们熟悉的导航栏,而是一个更加广的交互概念: 引导用户和产品进行有效的交互,实现用户的目标。

导航栏究竟在哪里

导航栏 Navigation Bar,也简称为 Navbar。一定会有不少刚入门的 UI 新人,在诸多的 Bar 控件中,难以区分它所指代的区域。

在 iOS 上,导航栏是指显示在应用程序顶部,位于状态栏下方的容器区域,层级应高于当前页面内容。

在安卓上,Google 公司在 Material Design 中也赋予了它同样的定义,但是却给了它另一个名称,顶部应用栏(Top App Bar)。


J.F.Gaufrid大约 8 分钟设计导航Navbar