当前位置: 首页 > 图文教程 > 网页制作 > 心得技巧 > 总结网站导航怎么设计才好呢?

心得技巧
网页设计心得:网页设计中的包容原则
网页设计理论:站在用户立场思考问题
设计参考:B2C网站添加到购物车按钮设计欣赏
收集国外优秀的杂志风格网站设计实例
用户体验参考:网页产品原型设计到网站界面
电子商务网站常见模式案例:分页设计
WEBJX收集55个新鲜的企业网站设计案例
70个漂亮的带有灵感的单页面网站设计实例
提高视觉冲击纹理质感风格Web设计实例参考
设计灵感:启发灵感的网页设计实例
Webjx收集50个新鲜的时尚和精致的组合设计网站
45个阅读更多和继续阅读链接设计实例
50个漂亮的有强烈设计感的博客网站实例
35个漂亮的国外摄影类网站(WEBJX收集)
54个出色的“网站建设中”网页设计实例
设计参考:10个使用涂鸦风格的网店设计
设计参考:12个设计精彩的国外游戏网站设计
用户体验:准确的发现问题和优雅的解决问题
淘宝网允许非注册用户购买的设计流程
网页设计理论:网站首页如何增加互动

心得技巧 中的 总结网站导航怎么设计才好呢?


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-01   浏览: 25 ::
收藏到网摘: n/a

导航,路标和找路

     了解导航在互联网上很多分析的例子,但是讨论的焦点的目的都是一个——“不要迷路”。
从导航说起,一般都会联想到路标,因为用户要找路,就想到了标识!

网页常规的标识包含:
    页面和窗口标题
    网页标识(logo)
    其他有标记的设备
    Tab
    选择指示器

标识使用到的模式:
    全局导航
    颜色编码的栏目
    序列地图
    面包屑层级结构
    注释滚动条

如何找路呢?
    运用良好的标记
    环境线索
    地图

    Jenifer提到有清晰的入口点模式结合良好的标记及环境线索的例子——链接必须在页面上突出显示。一个有序的地图,使用总览加细节,形成一个空间显示地图。

    总结导航如何好呢——让距离保持简短,避免太多的跳转!

清晰的入口点

what:只在界面上显示几个入口;让它们面向任务,并具有自描述性。
Where:当你正在设计一个面向任务的应用,或者其他任何主要供新用户或不常访问的用户使用的应用时,可应用此模式。
Why:网站要清晰的展现给用户信息和结构,大量平铺的面板,毫不相关的信息(广告等)都不能使用工具条。提供清晰的目的去口。
How:运用大门的概念,入口处很清晰的几点重要的导航。标准例子就是google,首页上集中处理好一件事。用户很明确ta能做什么。

图例:http://home.ingdirect.com/

序列地图What:在一系列页面上的每一页上,显示一幅地图,把所有的页面按顺序排序在改地图,包括“你在这里”的位置指示器。
Where:用户访问的路径是线性的。按照顺序一页一页访问的。但是太多的层次就不能使用了,要使用面包屑了。(具体几个层次jenifer没有提到,个人觉得超过5-6步就要改了把!)
Why:用户在按步骤走的时候迷路的可能很小,最担心的反而是还要走多久才到头。接下来我还要做什么。
How:那就采用步骤地图方式设计,用颜色深浅标识当前所在,用箭头等标识标记下游的方向。例如很多注册流程是这样的。

图例: