初学者需要掌握的 15 个 HTML5 最佳实践。

无论您是超文本标记语言 (HTML) 的初学者还是专家，遵循一些最佳实践以保持 HTML 文档的一致性和条理性都非常重要。

HTML5 已经问世多年，自 2014 年以来一直保持稳定，并至少部分支持大多数主流浏览器。这里我列出了一些关于 HTML5 标记的最佳编码实践。让我们开始吧：

文件结构

从第一天起就要关注项目文件结构。这对于中大型电池维护应用来说至关重要。
声明正确的文档类型

如果没有声明正确的 Doctype，浏览器将不会解释新的 HTML5 特定标签。
编写 w3c 有效标记

使用像 W3C 验证器这样的验证器来检查你的标记，并编写无错误、更结构化的代码。验证器会为你提供一些 HTML5 编码标准的最佳实践。我强烈建议你使用 W3C 验证器来验证你的代码。
HTML5语义元素

确保正确使用 HTML5 语义元素，例如：、、、。这将帮助您编写更结构化的代码。
有意义的 img alt 属性

请务必在 img 标签中使用包含有意义文本的“alt”属性。这也是 SEO 的最佳做法。
烤串式类命名

类命名时使用“短横线命名”。如果您不使用任何结构化命名约定，例如 BEM 约定。
相关选择器命名

尝试使用与代码块相关的有意义的类命名。
技巧：尝试使用“.noun-adjective”格式。
带有链接和脚本的类型属性

HTML5 结构中不需要使用“type”属性进行外部样式表和脚本链接。
原子类

需要时使用特定类或原子类，尽量使用简短有意义的类名。
父元素中的变体类

如果需要为同一个块赋予另一种样式或需要同一个块具有不同的样式，则尝试在父元素中添加类。
复杂包装

为了获得更好的性能，请尽量避免不必要的换行。换行会在 HTML 树中创建不必要的节点，也会降低性能。
坏习惯好习惯
结束标签

最佳做法是始终关注关闭起始标签，即使它是自关闭标签。
注入外部样式表

外部样式表总是在标签中注入。因为 HTML5 规范规定元素必须具有“rel”属性，如果使用了“rel”属性，则该元素将被限制在 head 元素中。
注入外部脚本

外部脚本总是在 body 标签的末尾插入。
众所周知，HTML 是逐行加载和执行的。因此，当浏览器遇到 script 标签时，它会立即加载并执行 JavaScript 代码。这可能会降低页面渲染速度，而且 JavaScript 通常用于操作 DOM 并向网页添加新功能。如果 script 标签未添加到 body 标签的末尾，DOM 可能尚未准备好，从而导致未知行为。
代码注释

编写易于理解的代码是最佳实践。尝试注释你的代码块。这将帮助你或任何其他开发人员重构这段代码块。