1、有意义的html
优点：与表现性的页面相比，有意义的页面更容易后期的处理与维护。
便于浏览器与屏幕阅读器识别。
更加便于调试样式，适合的标签去做适合的事情。
2、一些有意义的html标签：
3、id 和 class
ID
①id 用于标示页面上的特定元素（比如站点导航），并且是唯一的。
②用来标识持久的结构性元素，例如主导航或内容区域。
③用来标识一次性元素。
CLASS
①同一个类名可以应用于页面上任意多个元素。
②他适合标识内容的类型或其他相似的条目。
合理的使用 id 和 class
class 用于概念上相似的元素，他们可以在页面上出现多次。同时在使用 class 时，要避免”多类症“，使用样式表的层叠，使其更具意义，更加有利于”组件化“。
id 一般用于只出现一次的元素上。
4、为元素命名
为元素命名时，应该根据“他们是什么”来为元素命名，我不应该根据“他们的外观如何”来命名。这样会使代码更有意义，并且避免代码与设计的不同步。例如：bootstrap中 .warning 、.success 等，这样将更加便于重用和理解。
5、div 和 span
div 有助于在文档中添加结构，并且他也是有意义的。他代表部分（division），可以将文档分割为几个有意义的区域。所以，通常将主要内容区域包围在div中并为其分配适当的类，就可以在文档中添加结构和意义。
为了将不必要的标记减到最少，应该只在没有现有元素能够实现区域分割的情况下使用div元素。例如：
<div class="nav">
<ul>
<li></li>
<li></li>
</ul>
</div>
改为：
<ul class= "nav">
<li></li>
<li></li>
</ul>
6、DTD（文档类型定义）是一组机器可读的规则，他们定义XML或者HTML的特定版本中允许有什么，不允许有什么。在解析网页时，浏览器将使用这些规则检查页面的有效性并且采取相应的措施，即通过分析页面的DOCTYPE声明来了解要使用哪个DTD。
7、DOCTYPE 声明除了进行对文档代码的验证之外，还用于确定浏览器的渲染模式。
标准模式（Standards Mode）：浏览器根据规范呈现页面。
混杂模式（quirks mode）：页面以一种比较宽松的向后兼容的方式显示。它用来模仿老式浏览器（IE6之前和Netscape Navigator 4）的行为，以防老式站点无法工作。
几乎标准的模式（Almost Standards Mode）：IE8、Opera（7.5) 和其他浏览器，除了IE11 的第三种模式。除了在处理表格的方式上有一些细微的差异外，这种模式与标准模式相同。
8、DOCTYPE 切换 https://hsivonen.fi/doctype/
