在学习HTML5并将新技能添加到工具箱时，您可能会想要构建自己的HTML样板，以开始所有往后的项目。我们鼓励这样做，本文可以帮助您构建自己的HTML模板。
在本文中，我们将研究如何入门。让我们从一个大略的HTML5页面开始：
<!doctype html><html lang="en"><head><meta charset="utf-8"><title>The HTML5 Herald</title><meta name="description" content="The HTML5 Herald"><meta name="author" content="LangZhiChao"><link rel="stylesheet" href="css/styles.css?v=1.0"></head><body><script src="js/scripts.js"> </script></body></html>
有了该基本模板之后，现在让我们检讨标记的一些主要部分，以及这些部分可能与HTML5之前的HTML编写办法有何不同。
首先，我们有Document Type Declaration或doctype。这只是见告浏览器（或任何其他解析器）正在查看的文档类型的一种办法。对付HTML文件，它表示HTML的特定版本和风格。doctype该当始终是任何HTML文件顶部的第一项。许多年前，doctype声明是一个丑陋且难以影象的混乱。对付XHTML 1.0 Strict：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
对付HTML4 Transitional：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://www.w3.org/TR/html4/loose.dtd">
只管文档顶部的一长串文本并没有真正侵害我们（除了迫使我们站点的查看器下载一些额外的字节），HTML5肃清了那种难以理解的眼神。现在您须要的是：
<!doctype html>
很大略，而且很主要。可以利用大写，小写或大小写稠浊的doctype。您会把稳到声明中明显短缺“ 5”。只管当前的Web标记迭代被称为“ HTML5”，但它实际上仅是先前HTML标准的演进-将来的规范将仅仅是我们本日拥有的标准的发展。
由于常日哀求浏览器支持Web上的所有现有内容，因此无需依赖doctype来见告他们在给定文档中应支持哪些功能。换句话说，仅doctype不会使您的页面兼容HTML5。这完备取决于浏览器。实际上，您可以在页面上利用具有新HTML5元素的这两种旧文档类型之一，并且该页面将呈现与利用新doctype时相同的外不雅观。
html元素任何HTML文档中的下一个html元素是HTML5，该元素都没有发生太大变革。在我们的示例中，我们包含lang列值为的属性，该属性en指定文档为英语。在基于XHTML的语法中，须要包含一个xmlns属性。在HTML5中，不再须要此lang属性，乃至该属性对付文档验证或正常运行也是不必要的。
因此，这是到目前为止的内容，包括结束</html>标记：
<!doctype html><html lang="en"></html>head元素
页面的下一部分是本<head>节。内的第一行head是定义文档字符编码的行。自XHTML和HTML4以来，这是另一个已简化的元素，是可选功能，但建议利用。过去，您可能是这样写的：
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
HTML5通过将字符编码<meta>标记减少到最低限度来对此进行改进：
<meta charset="utf-8">
在险些所有情形下，utf-8都是您将在文档中利用的值。字符编码的完全解释不在本文的谈论范围之内，您也可能不会那么感兴趣。只管如此，如果您想更深入地研究，可以阅读有关W3C或WHATWG的主题。
把稳：为确保所有浏览器精确读取字符编码，必须在文档的前512个字符中的某些位置包含全体字符编码声明。它也该当涌如今任何基于内容的元素之前（例如<title>在我们的示例站点中紧随其后的元素）。
关于这个主题，我们可以写很多东西，但是我们想让您保持复苏-因此，我们将为您省去那些细节！
现在，我们很乐意接管此简化的声明，然后连续进行文档的下一部分：
<title>The HTML5 Herald</title><meta name="description" content="The HTML5 Herald"><meta name="author" content="LangZhiChao"><link rel="stylesheet" href="css/styles.css?v=1.0">
在这些行中，HTML5与以前的语法险些没有什么不同。页面标题（内的唯一必需元素head）被声明为与以前相同，并且我们包含的meta标签只是可选示例，用于指示将其放置在何处；您可以根据须要meta在此处放置尽可能多的有效元素。
此标记块的关键部分是样式表，该样式表是利用常规link元素包含的。link除href和外，没有其他必填属性rel。该type属性（在旧版HTML中是常见的）不是必需的，也不须要指示该样式表的内容类型。
公正竞争引入HTML5时，它包含了许多新元素，例如article和section。您可能会认为这是较旧的浏览器对无法识别的元素的支持所面临的紧张问题，但是您会错了。这是由于大多数浏览器实际上并不关心您利用什么标签。如果您有一个带有recipe标签（或ziggy标签）的HTML文档，并且CSS在该元素上附加了一些样式，则险些每个浏览器都将像完备正常一样连续运行，而无需抱怨即可运用样式。
当然，这样的假设性文档将无法验证并且可能存在可访问性问题，但是它险些可以在所有浏览器中精确呈现-Internet Explorer（IE）的旧版本除外。在版本9之前，IE阻挡无法识别的元素吸收样式。这些神秘元素被渲染引擎视为“未知元素”，因此您无法变动它们的外不雅观或行为办法。这不仅包括我们想象的元素，还包括那些浏览器版本开拓时尚未定义的任何元素。这意味着（您猜对了）新的HTML5元素。
好是，最近几天，IE的利用率已经低落，IE11的环球利用率已低落到约2.7％（截至2018年），而实际上之前的版本已低落。
但是，如果您确实须要支持古老的浏览器，则仍旧可以利用可信赖的HTML5 Shiv，这是John Resig最初开拓的非常大略的JavaScript。受Sjoerd Visscher的想法启示，它使新的HTML5元素可在IE的旧版本中进行样式设置。不过，确实，现在不须要了。正如我可以利用所指出的那样，所有当代浏览器乃至最新的旧版本都支持HTML5元素。（单击“显示全部”选项以查看所有浏览器版本。）一个例外是某些浏览器无法识别较新的main元素。但是，对付这些浏览器，只要添加适当的样式（例如将其设置为block元素），您仍旧可以利用此元素。
剩下的便是历史查看开始模板的别的部分，我们具有常用body元素以及其结束标记和结束html标记。我们还在script元素内引用了JavaScript文件。
与link前面谈论的标签非常相似，该<script>标签不须要您声明type属性。如果您曾经编写过XHTML，则可能会记得script标签如下所示：
<script src="js/scripts.js" type="text/javascript"> </script>
由于从实际上所有角度来看，JavaScript是Web上唯一利用的真正脚本措辞，并且由于所有浏览器都假定您正在利用JavaScript，纵然您没有明确声明这一事实，因此type在HTML5文档中该属性也是不必要的：
<script src="js/scripts.js"> </script>
我们已将script元素放在页面底部，以符合嵌入JavaScript的最佳做法。这与页面加载速率有关。当浏览器碰着脚本时，它将在解析脚本时停息下载并呈现页面的别的部分。如果在页面顶部任何内容之前都包含大型脚本，这将导致页面加载速率大大降落。这便是为什么大多数脚本应放在页面的最底部，以便仅在页面别的部分加载后才进行解析的缘故原由。
但是，在某些情形下（例如，利用HTML5 shiv），脚本可能须要放置在文档的开头，由于您希望脚本在浏览器开始呈现页面之前生效。
下一步您还可以通过交互性和程序化反应式UI将网站或Web运用程序开拓提升到一个新的水平。例如，查看有关JavaScript和React的广泛资源。并利用最佳Web工具和库的指南，找出如何更快地启动新项目。其余，如果您想在不学习编码的情形下建立网站体验，请阅联系浪知潮。最新的无代码工具浪潮改变了局面，第一次它们的功能强大到足以在许多情形下替代编码。
