设计导航——《点石成金》读书笔记(5)

设计导航

网络是真实世界的虚拟映射，我们在网络上浏览就好像在逛商店一样。我们进入网站：

• 通常是为了寻找某个目标
  一个耳机？ 一部电影？ 一条资讯？

• 会决定先询问还是先浏览
  在现实世界，我们会先问问导购。用户在web上的等价服务是搜索。

• 用户如果选择浏览
  用户需要在导航栏之间选择，点击。运气不错的话可以在几次点击之后就找到自己想要的内容

关于网络浏览的事实：

• 感觉不到大小。即使在频繁使用某个网站之后，除非它特别小，否则我们很难感觉到它有多大( 50个页面? 1 000个页面? 17 000个页面? )。我们只知道，可能有很多的角落我们从未涉足过。同一本杂志，一间博物馆，或者一家百货商场相比，在那些地方你通常有个大概的“ 视野之内”/“视野之外”的规模估计。
  实际上,你很难知道是否已经看到了这个网站上所有感兴趣的内容，因此也很难知道什么时候该停止寻找。
• 感觉不到方向
  在网站上，没有左边，也没有右边，没有上边，也没有下边，我们可能会说往上(Up),往下( Down),但我们的意思是层次结构的上一级和下一级，即更一般或更具体的层次。
• 感觉不到位置
  在物理空间里,当我们四处走动时,不断积累着对周围情况的了解，我们会知道东西的位置在哪儿，然后抄近路到达那个地方。

这就是书签如此重要的原因。也是为什么后退按钮是浏览器上用的最多的按钮的原因。

导航跟两件事有关。从一个地方到另一个地方，还有你当前所存处的位置。

导航容易被忽视的用途。

1. 告诉我们这里有些什么。
2. 告诉我们如何使用网站。
3. 给了我们对网站建造者的信心。

持久性导航

1. 站点名称
   一种独特的字体，一种可以识别的图形

2. 栏目
   栏目就是一级导航，通常鼠标放上去会出现一级导航下的二级导航

3. 实用工具
   帮助我们使用站点，通常包括注册，登录，帮助，站点地图，购物车等等

4. 主页
   持久导航最重要的袁元素之一就是主页的按钮和链接。

5. 搜索
   避免：

   • 花哨的用词
   • 指示说明
   • 选项

页面名称

名称引人注目，和点击的的链接一致

image.png

所处位置

image.png

面包屑

下面是面包屑设计中的几项最佳实践:
把它们放在最顶层。面包屑在它们出现在页面顶端, 高于所有内容时最有效，

• 使用“>”对层级进行间隔。各种尝试似乎已经确认，最好的分隔符就是大于号(>),可能是因为“>”在视觉上就暗示了沿着层级向前移动的动作。
• 加粗最后一个元素，层级清单中的最后一个元素应该是当前页面的名称，让它变粗正好得到了应有的突出。而且因为这就是你所在的页面，因此不用添加链接。