(1)输入<nav>。
(2)输入一组链接并将其标记为ul(无序列表)结构,除非链接的顺序比较重要(例如面包屑导航)。如果链接顺序重要,就将其标记为ol(有序列表)结构。
(3) 输入</nav>。
nav能帮助屏幕阅读器识别页面的主导航,并允许用户通过键盘直接跳至这些链接。这可以提高页面的可访问性,提升访问者的体验。
HTML5规范不推荐对辅助性的页脚链接(如“使用条款”、“隐私政策”等)使用nav,这不难理解。不过,有时页脚会再次显示顶级全局导航,或者包含“商店位置”、“招聘信息”等重要链接。在大多数情况下,我们推荐将页脚中的此类链接放入nav中。
HTML5不允许将nav嵌套在address元素中。
role属性并不是必需的,不过它可以提高可访问性。
在这个页面中,只有两组链接放在nav里,另外两组则由于不是主要的导航而没有放在nav里。
具体来说,nav元素可以用于以下场合
1、传统导航条:现在主流网站上都有不同层级导航条,作用是将当前画面跳转到其他主页上。
2、侧边栏导航:现在主流博客网站及商品网站都有侧边栏导航,其作用是将页面从当前文章跳转 到其他文章
3、 页面导航:页内导航的作用是在本页的组成部分之间进行跳转。
4、 翻页操作:翻页操作是指在网站的多个页面的前后页面或博客网站的前后文章之间滚动。
提示:如果文档中有“前后”按钮,则应该把它放到 <nav> 元素中。Nav可以使用到的地方,譬如:侧边栏上目录,面包屑导航,搜索样式,或者下一篇上一篇文章。
搜索样式的例子:
如果是单独的搜索栏, 可以加nav,最好不加;如果不是单独的搜索栏,与主要导航一起使用的时候,最好加nav。