网站顶部导航条必须要提供的内容和功能

2016-02-20 00:28 10 1 收藏

get新技能是需要付出行动的,即使看得再多也还是要动手试一试。今天图老师小编跟大家分享的是网站顶部导航条必须要提供的内容和功能,一起来学习了解下吧!

【 tulaoshi.com - Web开发 】

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)顶部导航条提供给用户一种很方便,简洁分类展示方式,让用户访问品类繁多的有组织的内容,用户为了完成任务需要找到必要的内容和功能.

这个可能是最简单也最常用的组件了,所以内容也不多.

原文地址: http://developer.yahoo.com/ypatterns/navigation/bar/topnav.html

水平导航条

解决什么问题?

用户为了完成任务需要找到必要的内容和功能.

什么时候用?2-12个分类的时候 分类的标题相对较短并且可预测的时候 分类数量基本不会变的时候 为一个web产品展示顶级导航时 配合标签来展示二级导航 如果页面宽度很重要,用它来替代左侧导航条 通过控制导航条的状态来跟踪和展示用户当前位置很困难,成本很大时,用它来替代标签. 分类都属于一个产品时 具体解决办法是什么?在一个水平的横条上显示一系列单行的链接,如果有网站头部,则放到头部之下. 可以通过与标签一起使用,在导航条中同时显示一级和二级导航 如果只使用顶部导航条,最好第一个链接是首页(Home).应该指向网站的首页但是如果顶部导航条是用在一组标签下,那么标签的第一个应该是首页并且具有同样的功能 在导航条中用留白和管道符 |(或者是垂直居中的点,或者是简单的视觉元素)来分隔每一个分类 顶部导航条中链接的所有页面本身也一定要显示在顶部导航条 当顶部导航条数量过多时,建议使用更多..的链接,或者考虑使用左侧导航条 与标签一起使用来显示高级别的内容 跟左侧导航条一起使用来显示二级或三级内容

关注内容的划分范围(符合用户的心智模型)比关注页面的展示更重要.因为最常见的错误是将一系列没意义的内容归在一类.

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)尽可能降低分类之间的交集 让分类之间的界限尽可能的清晰(例如,很容易猜到想要的东西是否在一个分类中) 避免过于宽泛或者过于特殊的分类名字. 为什么使用这个组件?

顶部导航条提供给用户一种很方便,简洁分类展示方式,让用户访问品类繁多的有组织的内容

来源:https://www.tulaoshi.com/n/20160220/1631891.html

延伸阅读
标签: flash教程
  效果如下: 准备工作: 1.新建一个名为item_BG的影片剪辑~ 在item_BG中添加一个矩形块,大小大概就和按钮的大小差不多,具体自己调~ 然后将item_BG该影片剪辑的链接名称命名为'mblock' 2.新建一个名为item_EN的影片剪辑~() 在item_EN中添加一个动态文本框,将实例名称命名为'itext...
标签: Web开发
    创建导航条     如果不使用框架,可以在每个页面设置导航条,导航条设一组链接按钮,供浏览者选择使用。按钮有多种形式,下边介绍由鼠标经过图像变换按钮的组成的导航条制作:(导航条在页面顶部)     “鼠标经过图像”是当访问者用鼠标指针指向该图像时,该图像发生变化。   ...
让用户更容易地找到需要的信息,可以对网站的信息架构和站内搜索进行分析和优化,而另一个能对用户起到很好引导作用的就是网站的导航功能,所以这篇文章主要分析用户对网站导航功能的使用情况,并在此基础上合理地优化网站的导航设计。 之前已经介绍过为了让用户更容易地找到需要的信息,可以对网站的信息架构和站内搜索进行分析和优化,而另...
标签: PS PS基础
最终效果 步骤 步骤2,创建导航背景,下面忘记写了,颜色是#5a5a5a 设置灰色块的图层样式,内阴影+渐变 设置完渐变的时候效果出来啦 好,复制背景,行距是3px 为导航条写上标题 下面设置圆圈的样式 图层样式设置完毕把图层不透明°设置为70% 加上箭头得到效果 最终效果

经验教程

781

收藏

98
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部