网站导航设计模式指南

作者:rockux 来源:rockux 时间:2011-03-04 16:12:00 

在网页设计中有一些通用的交互设计模式。网站导航各种各样的通用和大家熟知的设计模式,可以用来作为为网站创建有效地信息架构的基础。这篇指南涵盖了流行的站点导航设计模式。对于每一种网站导航栏设计模式,我们将讨论它的一般特征,它的缺点,以及什么时候使用它最好。

顶部水平栏导航

顶部水平栏导航是当前两种最流行地网站导航菜单设计模式之一。它最常用于网站的主导航菜单,且最通常地放在网站所有页面的网站头的直接上方或直接下方。

顶部水平栏导航设计模式有时伴随着下拉菜单,当鼠标移到某个项上时弹出它下面的二级子导航项。

顶部水平栏导航一般特征

  • 导航项是文字链接,按钮形状,或者选项卡形状

  • 水平栏导航通常直接放在邻近网站logo的地方

  • 它通常位于折叠之上

顶部水平栏导航的缺点

顶部水平栏导航最大的缺点就是它限制了你在不采用子级导航的情况下可以包含的链接数。对于只有几个页面或类别的网站来说,这不是什么问题,但是对于有非常复杂的信息结构且有很多模块组成的网站来说,如果没有子导航的话,这并不是一个完美的主导航菜单选择。

何时使用顶部水平栏导航

顶部水平栏导航对于只需要在主要导航中显示5-12个导航项的网站来说是非常好的。这也是单列布局的网站的主导航的唯一选择(除了通常用于二级导航系统的底部导航)。当它与下拉子导航结合时,这种设计模式可以支持更多的链接。

竖直/侧边栏导航

侧边栏导航的导航项被排列在一个单列,一项在一项的上面。它经常在左上角的列上,在主内容区之前——根据一份针对从左到右习惯读者的导航模式的可用性研究,左边的竖直导航栏比右边的竖直导航表现要好。
侧边栏导航设计模式随处可见,几乎存在于各类网站上。这有可能是因为竖直导航是当前最通用的模式之一,可以适应数量很多的链接。

它可以与子导航菜单一起使用,也可以单独使用。它很容易用于包含很多链接的网站主导航。侧边栏导航可以集成在几乎任何种类的多列布局中。

标签:导航,设计,指南
0
投稿

猜你喜欢

  • ASP程序中使用断开的数据记录集的代码

    2012-12-04 20:20:28
  • 几个SQL SERVER应用问题解答

    2008-01-01 19:12:00
  • 用Dreamweaver MX巧妙格式化表格

    2008-03-18 16:39:00
  • asp中提取HTML中图片的SRC路径

    2008-10-24 08:42:00
  • jRaiser与jQuery的冲突问题

    2010-07-27 12:36:00
  • ASP程序与SQL存储过程结合使用详解

    2011-03-25 10:50:00
  • 立足于传统行业设计

    2008-07-26 12:36:00
  • ASP与数据库应用(给初学者)

    2009-03-09 18:32:00
  • 函数式JavaScript编程指南

    2007-12-08 20:39:00
  • MySQL手动安装方法与中文解决方案

    2011-04-25 18:21:00
  • 从外到内提高SQL Server数据库性能

    2009-01-22 14:12:00
  • 解析:Perl下应当如何连接Access数据库

    2008-11-28 16:40:00
  • 表单验证中时间起止判断的递归处理

    2009-12-16 19:27:00
  • 404错误伪静态类封装class RewriteBase

    2009-06-29 16:19:00
  • 《web信息架构》——分类方式

    2009-11-27 19:16:00
  • JS 显示当前日期+星期(静态)

    2007-09-11 13:29:00
  • 一些与网页密切相关的技术

    2010-09-05 21:16:00
  • 腾讯注册页面的 JS 解密

    2009-11-18 12:50:00
  • 随滚动条移动的DIV层js代码

    2007-10-10 12:51:00
  • SQL语句练习实例之七 剔除不需要的记录行

    2011-11-03 16:50:51
  • asp之家 网络编程 m.aspxhome.com