首 页  –  网络编程    数据库    网页设计工具   网页脚本语言    美术设计理论    服务器技术
· 网店模板
· 设为首页
· 收藏本网
当前位置: 首页> 美术设计理论> 网页设计技巧教程> 移动网站导航栏设计示例


移动网站导航栏设计示例

    在研究导航之前,我们不妨从导航的使用目的谈起。如果把网站比成一座大厦,那导航可认作是大厦内的指引系统。导航的使用目的归纳起来主要有以下几个方面:

1. 引导用户在网站页面间移动和浏览,提供获取信息的路径。全局导航、局部导航等都是为了用户浏览相关的页面提供引导,方便用户找到所求。

2. 理清网站各部分内容之间的关系,使用户了解网站全景。最常见于全局导航和站点信息导航,它们展现了整个网站的目录信息,用户可快速理解网站结构,对网站有整体的把握。

3. 定位用户在网站中所处的位置。这个功能常见于面包屑和相关导航中,它帮助用户识别当前浏览的页面与网站整体内容间关系,使用户了解当前页面和网站其它内容的联系和区别。

导航变化的原因

从PC端到移动端导航变化的原因归根结底是由物(设备的软、硬件差异)、景(使用情景和操作方式)、事(用户需求和使用目的)差异。这些因素相互交织,对移动终端的导航设计有显著的影响。

本文尝试从类型、内容、样式等方面结合实例来说明PC端到移动端网站导航设计变化示例:

一、常用导航类型变化

网页导航的划分有不同的维度。网页导航按照作用范围的不同可以分为三大类:结构性导航、关联性导航和公用程序导航。三者的关系可描述如下:

移动网站导航栏设计示例

根据外在形式的不同,网页导航通常又可以分为顶部横向导航、侧边栏导航、Tab标签导航、面包屑导航、页内锚点导航等多种形式。

由于移动终端特性,移动网站可以采用的导航种类较PC端要少很多,主要有纵向导航、分类链接导航、Tab标签导航、相关导航等。

移动网站导航栏设计示例

本文分页: 1 2 3 4

Tags:移动网站导航栏设计示例
上一篇文章:浅谈电子商务网站文字设计基准特点
下一篇文章:良好的网页登录框设计方法略谈
阅读热门榜
最新更新
网页设计大本营 版权所有
武动乾坤 斗破苍穹2 傲视遮天 link 美团贵阳团购网
Copyright ®2008 Www.Code-123.Com All Rights Reserved