关于网站导航设计的探讨
作者：evanchen 来源：薯片会 发布时间：2008-02-28 13:20:00
许多网站缺乏针对性和友好的导航设计，难以找到连接到相关网页的路径，也没有提供有助于让访客/用户找到所需信息的帮助，用户体验非常糟糕。本期薯片会我们尝试就网站导航交互做一些探讨。
首先对于WEB交互设计师来说，解决上面遇到的问题，使之简单的方法是设计一套完善的网页导航系统。
优化网站导航设计的目的
一个网站导航设计对提供丰富友好的用户体验有至关重要的地位，简单直观的导航不仅能提高网站易用性，而且在方便用户找到所要的信息后，可有助提高用户转化率。
如果把主页比作网站门面，那么导航就是通道，这些通道走向网站的每个角落，导航的设计是否合理对于一个网站是具有非常大意义的。
决定用户在网站中穿梭浏览的体验，这一点是最基本的。
网站导航设计合理，可以将网站的内容和服务最大面积的展现在用户面前。
合理的导航设计可以增加用户黏性，提高网站的浏览深度，从而提高网站PV值。
促进用户消费，提高网站盈利。引导用户消费，将用户真正需要的产品和服务展示在他面前，甚至用户想不到的服务你也呈现。
提高网站广告价值，增加网站广告收益。
•••••••
网站导航的常见结构
雅虎的网页设计一直是国内众门户模仿的对象，我们首先来看看Yahoo网站现有的几种导航样式：
1）Yahoo首页 （最常用的栏目导航）
Yahoo首页左侧的导航列出了网站最常用（或访问最频繁，或网站运营最想让用户知道）的几个栏目。这种导航（也包括网页顶部横向结构）是目前互联网中使用最广泛的导航方式。
2）More Yahoo！Services （更多的导航信息的展现）
Yahoo作为一个全球大型综合门户网站，所提供的服务肯定不止首页左侧导航显示的那几个，那么更多的服务如何导航？同时又如何展现给用户呢？于是Yahoo的设计师们给我我们一种解决方案，如上图，点击
从网页左侧展开一浮出层样式的服务导航页面。可以发现，这种导航也是多维度的（下面我们会专门探讨）
3）Tab 式位置导航变体
我们还可以在Yahoo！TV 等栏目上发现这样有趣的导航结构，我们暂且认为他是Tab 式结构加上一个下拉菜单的一种导航组合。
TV Home – Shows – American Idol – Overview 组成了一个单维度的导航
TV Home同时提供了下拉菜单方便用户快速的转到其二级栏目下。（这里我遇到一个困惑，在这里我不知道怎么TV Home上一级的目录是什么，也不知道如何返回。）
0
投稿猜你喜欢
jQuery之所以如此流行并被从大公司到个人博客的几乎每个人都广泛使用，是因为它上手和使用相当简单，而且为我们提供了一些人都不知道的相当棒的- 网上有不少生成缩略图的ASP组件。若你的虚拟空间不支持注册新组件，可能会感觉自己的网站失色不少。心晴不才，结合网上资源写了个无组件生成缩略图
- 过程名：ManualPagination作 用：采用手动分页方式显示文章具体的内容参 数：ArticleID,strContentSub&n
- 几个常用的js小函数，在表单验证时也许您用得到：一检查是否是email地址，二检查是否为数字，三检查是否为电话号码，四检查num是否是负数或
- 一般的防止被框架方式或者被框架后自动转向,方法如下: if (top.location != self.loc
- 问题：我想上传文件时后改名，下载时又将名改回来。 如：我上传一张“我的照片.jpg”上传后改为系统数名“20040302001.jpg”下载
- 网页兼容测试，除了做不同浏览器的兼容测试，还要观察网页在不同分辨率下的表现情况。在页面中使用了CSS绝对定位，发现在宽屏下错位。随后测试非1
- photoshop快捷键大全: 工具箱(多种工具共用一个快捷键的可同时按【Shift】加此快捷键选取)相关文章：网页设计软件FrontPag
- 在使用AJAX开发网站时，经常有朋友遇到乱码的问题，而且一下子难以找到解决方法。其实解决AJAX中文乱码问题很简单。1、服务端程序：<
- 我们经常见到很多网站留言系统的显示访客的IP地址都是隐藏了一部分，以达到隐蔽访客真实地理位置的功能。如：111.222.333.*，当然在系
- 写入：1:把gif图像文件读入内存（一个变量strTemp）。2:写入数据库。Dim binTmp() As ByteDim conn As
- 通常，当一个页面有太多信息要显示，而一页塞又不下所有信。为了请求速度、美观以及其他的各种理由，分页就会被我们请过来。让我们的用户可以选择是否
- 如何选择速度最快的站点？ <html><head><meta http-equiv=&qu
- Google Chrome，又喜欢逛豆瓣，Google Chrome支持User Scripts了，但是我写的那几个插件在Chrome下又跑
- 最近在研究雨哲软件采集程序的时候，需要获取真实软件地址时遇到了需要读取跳转页面跳转后的真实地址的问题。在网上找了很多方法，使用WinHttp
- 1 丰富的二维动画/图形和视音频表现 Rich 2D animation/graphics with audio and video这点毋庸
- <script language="javascript">function chang
- 总经一下前段时间用于的jQuery方法：find及children。需要的朋友可以参考下。首先看看英文解释吧： children方法：fin
- 计算机键盘每天用得太多了，以致于我们无视它的存在（盲打），当然也很少有人去问这样一个问题——为什么键盘字母的排列方式是QWERTY而不是AB
- 鼠标经过超链时的提示图层源码运行代码框<script>var oPopup = window.createPopup();fun
