和 Java、CSS 相比，HTML 经过三十多年的发展，似乎逐渐走进无人问津的角落，如何才能让 HTML 再次回到人们视野的中心。
作者 | Yaser Adel Mehraban
译者 | 谭开朗，责编 | 屠敏
以下为译文：
有多少次，身为开发者的你编写了一个HTML块而没有意识到可能编码得并不理想?
为什么
HTML一直处于无人问津的角落，因为Java和CSS总是吸引人们的注意力。
请在脑海里先保留这种印象，因为我要用一些简单的技巧来发挥作用，让HTML再次回到人们视野的中心。
以下是创建一目了然、可维护和可扩展的代码的一些方法，其很好的应用了HTML5的语义标记元素，并将在支持的浏览器中正确呈现。
其缘由就不赘述了，让我们来看看具体是什么吧。
文档类型
在index.html的顶部位置，请确保声明了DOCTYPE。这将在所有浏览器中激活标准模式，并告知浏览器该如何编译文档。请记住DOCTYPE不是HTML元素。
HTML5是这样的：
<!DOCTYPE html>
注意:如果应用了框架，这已预先写好。如果没有，我强烈建议使用像Emmet这样的代码片段，它在VS代码中可用。
想了解更多关于其他文档类型的信息吗?点击这里查看参考文件：https://html.com/tags/doctype/。
可选标签
有些标签在HTML5中是可选的，主要是因为元素是隐式呈现的。信不信由你，你可以省略<html>标签，而页面呈现得也很好。
<!DOCTYPE HTML>
<head>
<title>Hello </title>
</head>
<body>
<p>Welcome to this example. </p>
</body>
</html>
上面是一个有效的HTML，但在某些情况下就不能这样做了。例如标签后面跟着注释：
<!DOCTYPE HTML>
<!-- where is this comment in the DOM? -->
<head>
<title>Hello </title>
</head>
<body>
<p>Welcome to this example. </p>
</body>
</html>
上面是无效的，因为注释位于<thml>标签之外，解析树发生了更改。
结束标签
应始终记得结束标签，否则某些浏览器在呈现页面时会出现问题。出于可读性和其他原因，建议保留这些内容，稍后我会详细介绍。
<divid="example">
<imgsrc="example.jpg"alt="example"/>
<ahref="#"title="test">example </a>
<p>example </p>
</div>
以上都是有效的标签，但也有一些特例，如下。
自闭合标签是有效的，但不是必需的。这些元素包括:
<br>, <hr>, <img>, <input>, <link>, <meta>,
<area>, <base>, <col>, <command>, <embed>, <keygen>, <param>, <source>, <track>, <wbr>
注意:普通元素永远不能有自闭合标签。
<title />
上面显然是无效的。
字符集
预先定义字符集。最好是将它放在顶部元素中。
<head>
<title>This is a super duper cool title, right