129-html-1-HTML语义化

129-html-1-HTML语义化

如何理解HTML语义化?

HTML语义化是指从代码上来展示页面的结构,而不是从最终视觉上来展示结构。

优点

1、方便爬虫抓取信息,有利于SEO

2、提升代码可读性,方便团队开发维护

3、CSS文件还未加载时(没有CSS),页面仍然清晰、可读、好看。

4、提升用户体验,例如title、alt可用于解释名词或解释图片信息。

做法:

  • <h1>~<h6> ,作为标题使用,并且依据重要性递减,<h1> 是最高的等级。
  • 少用div和span,使用p做为段落标记
  • 导航条使用ul、li
  • 需要强调的文本,可以包含在strong或者em标签
  • header(头部)main(主体内容)nav(导航)section(某一块内容)footer(底部)aside(侧边)