第3章 网站导航设计.ppt

在网站中，导航就是在每个网页间自由地来去，即引导用户在网站中到达他所想到达的位置，这就是每个网站中都包含很多导航要素的目的。在这些要素中有菜单按钮、移动图像和链接等各种各样的对象，网站的页数越多，包含的内容和信息越复杂多样，那么它的导航要素的构成和形态是否成体系、位置是否合适将是决定该网站能否成功的重要因素。一般来说，在网页的上端或左侧设置主导航要素的情况是比较普遍的方式。 　 网站导航是网站视觉设计中重要的视觉元素。它的主要功能是更好地帮助用户访问网站内容，一个优秀的网站导航，应该立足于用户的角度去进行设计，导航设计的合理与否将直接影响到用户使用时的舒适与否，在不同的网站中使用不同的导航形式，既要注重突出表现导航，又要注重整个页面的协调性。 3.2.1　标签式导航 由于网页的空间是有限的，为了能够节省页面的空间，而又不影响网站导航更好地发挥其作用。因而，在很多网站中出现了弹出菜单形式的导航，当鼠标放在文字或图片上时，菜单随即就会弹出。不仅增添了网站的交互效果、节省了页面空间，而且使整个网站更具活力感。 在一些图片比例较大，文字信息提供量少、网页视觉风格比较简单的网页中，标签形式的导航比较常用。 3.2.2　按钮形式导航 按钮形式的导航是最传统也是最容易让浏览者理解为点击含义的导航形式。按钮可以制作成为规则或不规则的精致美观的外形，以引导用户更好地使用。 3.2.3　弹出菜单式导航 3.2.4　无框图形形式导航 无框图标形式的导航是指将图标去掉边框，使用多种不规则的图案或线条。在网站视觉设计中使用这种形式的导航不仅可以给浏览者以轻松自由感，而且能够增强网页的趣味性，丰富了网站的页面效。 3.2.5　Flash动画形式导航 随着网络技术的不断发展和人们对时尚潮流的不断追求，各种各样的网站导航形式不断丰富起来，目前很多网站上使用了Flash动画形式的导航，通常情况下，这种导航形式适用于动感时尚的网站页面。 多导航系统多用于内容较多的网站中，导航内部可以采用多种形式进行表现，以丰富网页效果，每个导航的作用都是不同的，不存在任何的从属关系。 3.2.6　多导航系统 自测1——设计游戏网站导航 自测1：设计游戏网站导航 源文件：光盘\源文件\第3章\游戏网站导航.psd 视 频：光盘\视频\第3章\游戏网站导航.swf 自测2——设计质感企业网站导航 自测2：设计质感企业网站导航 源文件：光盘\源文件\第3章\质感企业网站导航.psd 视 频：光盘\视频\第3章\质感企业网站导航.swf 导航元素的位置不仅会影响到网站的整体视觉风格，而且关系到一个网站的品味及用户访问网页的便利性。设计者应该根据网页的整体版式合理安排导航元素的放置。 3.3.1　布局在网页顶部 目前，虽然下载速度已经不再是一个决定导航位置的重要因素，但是很多网站依然在使用顶部导航结构。这是由于顶部导航不仅可以节省网站页面的空间，而且符合人们长期以来的视觉习惯，以方便浏览者快速捕捉网页信息，引导用户对网站的使用，可见这是设计的立足点与吸引用户最好的表现。 3.3.2　布局在网页底部 由于个人喜好的问题，有些人并不喜欢使用框架结构对网页导航进行布局。然而，即便使用了框架结构仍然会有许多问题需要解决，例如，打开网页的速度、更新时无法记忆当前网页信息仍需返回上层目录、用户在浏览页面时会有视觉上的不适，增加了浏览页面的难度等，因此使用底部导航是比较麻烦的布局结构，通常情况下，在网页中较少使用底部导航。 3.3.3　布局在网页左侧 导航是网站与用户沟通的最直接的、最快速的工具，它具有较强的引导作用，可以有效避免因用户无方向性地浏览网页，所带来的诸多不便。因此，在网站页面中，在不影响整体布局的同时，就需要注重表现导航的突出性，即使网页左侧导航所采用的色彩及形态会影响表现右侧的内容也是没有关系的。因而，在网页设计中采用这种左侧导航的布局结构，可以不用考虑怎样更好地修饰网页内容区域或者构思新颖、独具创意方面的问题。 3.3.4　布局在网页右侧 随着网站制作技术的不断发展，导航的放置方式越来越多样化。将导航元素放置于页面的右侧也开始流行起来，由于人们的视觉习惯都是从左至右、从上至下，因而，这种方式会对用户快速进入浏览状态有不利的影响，在网站界面设计中，右侧导航使用的频率较低。 3.3.5　布局在网页中心 将导航布局在网站界面的中心位置，其主要目的是为了强调，而并非是节省页面空间。将导航置于用户注意力的集中区，有利于帮助用户更方便的浏览网页内容，而且可以增加页