html标签语义化

1.为什么要有语义化标签?

以前的html基本上就是div+css,然而div没有任何意义,全靠css显示页面的样式,因而近几年开发者提出了html结构的语义化,所以w3c就制订了语义化标签。

2.什么是语义化?

语义化就是构成html结构的标签要有意义,比如<header>表示头部,<main>表示页面主体,<footer>表示页面底部,那么这些标签构成的html结构就是有意义的,有语义化的,如果页面的头部,内容,底部用div表示,那么它就不是一个语义化的html结构。

3.怎么知道自己的页面结构是否语义化?

只要去掉css,看html代码的结构是否清晰,再看页面内容是否正常显示。

4.语义化的优点?

  1. 有语义化的标签的html结构更加清晰,方便编写代码;
  2. 对于团队来说,方便团队的开发与维护;
  3. 对于爬虫有利于seo,对于浏览器更加方便解析,
  4. 最重要的是对于用户
    • 因为网速的原因导致没有加载css,页面也能呈现出良好的页面结构;
    • 某些标签属性alt,title能带来良好的用户体验,还有就是用好label标签更利于用户交互,
    • 在特殊终端,如视障阅读器中语义化html可以呈现良好的结构)

5.怎么做才能写出语义化的html?

1.少使用或不使用<div><span>标签,用<p>标签代替<div>标签;
2.不使用样式标签如:<b><foot>标签;不使用<b><i>
3.强调文本放在<strong>或者<em>标签中;
4.使用表格table时,标题用<caption>,表头要用<thead>,主体部分用<tbody>包围,尾部用<tfoot>包围,表头用<th>标签,单元格用<td>
5.表单域用<filedset>,用<lengend>标签说明表单的用途;
6.<input>通过id或者for属性与<label>标签关联

6.html5新语义元素

html标签语义化

html标签语义化

上一篇:kubernetes入门


下一篇:微信小程序使用content-type等于x-www-form-urlencoded方式使用request请求数据