杂粮和面包屑
杂粮是我自己定义的:用来指代自己做的笔记。
杂粮
给button添加svg:http://www.fengyan.cc/1376.html
href中的两斜杠是代表什么意思,<link href="//static.hdslb.com/mobile/css/normalize.css" rel="stylesheet">
斜杠“/”是URL地址中用到的分隔符;对应地,双斜杠用在网络域名访问中,是协议和主机名或IP地址之间的分隔符,以双斜杠//开头的URL是依赖协议的URL表示形式,URL格式:协议://域名或ip/请求文件路径/文件名。
面包屑
面包屑导航(BreadcrumbNavigation)这个概念来自童话故事"汉赛尔和格莱特",当汉赛尔和格莱特穿过森林时,不小心迷路了,但是他们发现在沿途走过的地方都撒下了面包屑,让这些面包屑来帮助他们找到回家的路。所以,面包屑导航的作用是告诉访问者他们目前在网站中的位置以及如何返回。
原理
适用条件
虽然眼下很多网站都流行使用面包屑导航,但是并不是所有的网站都适用。符合下面两个条件的网站才适合使用面包屑导航。1、层级较深的网站,面包屑导航适合层级较深的网站,如果只有一级分类的话,通过主导航就可以起到快速定位的作用。比如“豆瓣网”类型扁平构架的网站就没有使用面包屑导航。2、独立不交叉的网站结构,由于面包屑网站导航路径是线性结构的,因此网站内容必须划分的非常清晰,且不存在交叉;否则,面包屑导航的路径就不是唯一的,同一分类可能出现在不同的路径中,让用户感到困惑。
面包屑只是一个辅助导航系统,它无法替代主要的导航系统。请记住,它是仅仅是为了用户方便的次要选项,用来抵达其他层级的快速定位链接系统。它的功能并不复杂,增加易用性是它的主要作用,所以千万不要将面包屑复杂化。
面包屑本身是一个辅助导航,如果使用过于花哨的字体和醒目的色彩,会使得它显得喧宾夺主,过于抓人眼球。它不应该是浏览过程中用户的视觉焦点。下面的面包屑设计并不差,但是它太过于醒目,甚至比顶部导航还能引起用户注意力。
例子
参考资料:http://www.uisdc.com/breadcrumbs-for-websites-design
http://baike.baidu.com/item/%E9%9D%A2%E5%8C%85%E5%B1%91%E5%AF%BC%E8%88%AA?fr=aladdin