HTML和HTML5之间的区别
2020.04.09 -
HTML是最常用的标记语言。一种设计用于通过在样式文件中嵌入标签和文本注释来处理，定义和显示文本的系统，以使计算机易于进行文本操作。2014年，发布了针对该语言的名为HTML5的更新。但是什么是HTML5？HTML与HTML5有什么区别？在本文中，将回答该问题。
什么是HTML？
超文本标记语言（HTML）是万维网的主要语言。它允许开发人员设计如何在浏览器上显示网页元素，例如文本，超链接和多媒体文件。
该语言是静态工作的，这意味着您无法使用HTML创建动态或交互式网页功能。它仅修改网页的静态元素，例如内容页眉，页脚，图像位置等。
要构建一个漂亮的交互式网站，您需要将HTML与至少两种前端语言结合起来：
层叠样式表 （CSS）和JavaScript。
HTML使用各种标签（包括标题，表格和段落）来定义页面的文本结构。每个标签都是使用<A>和</A>公式定义的。通常通常分别称为“打开”和“关闭”标签。
例如，如果您希望将特定的文本样式更改为斜体，则可以使用<i>在此处键入文本</ i>。您的浏览器将通过这些标签呈现内容，然后在屏幕上显示。
最早的HTML是1991年由Tim Berners-Lee发布的。此后，他的创作经历了许多更新，包括1995年的HTML 2.0、1997年的HTML 3.2、1999年的HTML 4.01和2000年的XHTML。当前，最新的HTML版本是2014年发布的HTML5。
HTML5为其先前版本提供了许多新功能，例如离线媒体存储支持，更具体的内容元素（如页脚，页眉，导航等），更简单的内联doctype，音频和视频嵌入支持。
HTML和HTML5 的主要区别
TML5的发布主要目的是为开发人员和最终用户改善万维网体验。在这篇HTML vs HTML5文章中，我们将简要列出主要区别：
- HTML5支持SVG（可缩放矢量图形），画布和其他虚拟矢量图形，而在HTML中，只有将其与Flash，VML（矢量标记语言）或Silverlight等不同技术结合使用，才能使用矢量图形。
- HTML 5中使用Web SQL数据库临时存储数据。同时，在以前的HTML版本中，仅浏览器缓存可用于此目的。
- 使用HTML5，JavaScript可以在Web浏览器中运行，而较早的HTML仅允许JavaScript在浏览器界面线程中运行。
- HTML5不是基于SGML的。这意味着该语言已改进了解析规则，从而增强了兼容性。
- 您可以在带有HTML5的文本中使用内联MathML和SVG，而HTML对此进行了限制。
- HTML5中删除了一些元素，例如isindex，noframes，首字母缩写词，applet，basefont，dir，font，frame，frameset，big，center，strike和tt。
- HTML5支持新型的表单控件，包括日期和时间，电子邮件，数字，范围，tel，url，搜索等。
- HTML5中有多个新功能和新元素。一些最重要的参数是summary，time，aside，audio，command，data，datalist等等。
HTML5对开发人员的好处
HTML5希望开发人员在设计网站时具有更大的灵活性。体现在以下方面：
持久错误处理
大多数浏览器都支持解析结构上/语法上不正确的HTML代码。但是，直到几年前，还没有标准化的流程来处理此问题。
这意味着浏览器开发人员必须在不同的浏览器中执行格式错误的HTML文档测试，才能通过反向工程创建改进的错误处理流程。
HTML5中一致的错误处理在这方面产生了巨大的变化。HTML5中使用的改进的解析算法在节省大量金钱和大量时间方面具有不可量化的优势。
元素语义的改进
对HTML中各种现有元素的语义角色进行了改进，以增强代码的说明性。
section，article，nav和header是新元素，已替换了大多数现在已过时的div元素。由于元素更简单，因此使错误扫描的整个过程变得不那么复杂。
对Web应用程序功能的增强支持
HTML5的主要目标之一是允许Web浏览器充当应用程序平台。因此，它为开发人员提供了对其网站性能的增强控制。
过去，开发人员不得不使用变通方法，因为不存在许多服务器端技术和浏览器扩展。
当前，无需使用任何基于JavaScript或Flash的解决方法（就像以前在HTML4中所做的那样），因为HTML5中有提供所有功能的元素。
移动网络变得更加容易
在过去的十年中，拥有智能手机的人口一直在不断增长，这产生了对改进的HTML标准的需求。
最终用户希望能够随时通过任何移动设备访问Web资源。换句话说，拥有一个网站是必要条件。幸运的是，HTML5能够满足平板电脑和智能手机等低功耗电子移动设备的需求，从而使移动支持更加简单。
画布元素
HTML5最令人兴奋的功能之一是<canvas>元素，它使您能够绘制各种图形组件，例如框，圆，文本和图像。
考虑到使用HTML5通过脚本（例如JavaScript）使用不同颜色和形状绘制图形的方便性，可以认为该语言将使Flash完全过时。
但是，值得一提的是<canvas>元素仅仅是一个图形容器。因此，要定义图形，必须执行脚本。这是一个将JavaScript与元素结合使用的示例：
<canvas id=”TestCanvas” width=”200″ height=”100″></canvas>
var c = document.getElementById(“TestCanvas”);
var context = c.getContext(“2d”);
context.fillStyle = “#FF0000”;
context.fillRect(0,0,140,75);菜单元素
新添加的<menu>和<menuitem>元素是交互式元素规范和Web开发示例的组成部分。
这两项可以用来确保增强的Web交互性。为了简化起见，<menu>标记用于表示移动和桌面应用程序中的菜单命令。菜单标签的一种可能用法是：
<body contextmenu=”new-menu”>
<menu id=” new-menu” type=”context”>
<menuitem>Hello!</menuitem>
</menu>
</body>可自定义的数据属性
可以将自定义属性添加到旧版本的HTML，但这是冒险的事情。例如，自定义属性有时会阻止页面完全用HTML4呈现，并导致文档不正确/无效。
幸运的是，HTML5中的data- *属性已经结束了这个经常发生的问题。尽管此属性有多种用途，例如样式化CSS元素或通过jQuery访问元素的data属性。仍然，其主要目的是存储有关不同元素的额外信息。
现在，可以包括自定义数据，使开发人员有机会制作引人入胜且高效的网页，而不必引入复杂的服务器端查找或Ajax调用。
网络存储替换Cookies
HTML5使用网络存储或本地存储来替换cookie。在较旧的HTML版本中，如果开发人员想要存储任何内容，则他们必须使用保存少量数据（大约4 kb）的cookie。
但是，Cookie有几个缺点-它可以过期，限制使用复杂数据（仅允许使用string）以及通过将其他脚本承载到服务器来减慢Web服务器的速度。
另一方面，Web存储允许将数据永久存储在客户端计算机上（除非用户将其擦除），它还具有较大的数据存储（5 MB），并且不会因请求服务器而增加负担。
HTML5对用户的好处
HTML5为开发人员和用户都带来了革命。它为最终用户提供的一些好处是：
- 减少移动浏览器崩溃。
- 它提供了对移动网站的更好依赖。当访问者想要使用特定公司的服务而又不想下载其应用程序时，他们只需登录到该公司的响应式网站即可。
- 通过使用JavaScript和MPEG4为开发人员提供美观的图形丰富用户体验，从而消除了使用Adobe Flash的需要。
- 支持本机音频和视频元素，而无需任何其他插件。
结论
HTML5相对HTML来说，很多方面都得到了提高。不管是对开发者还是最终用户都有明显的好处。正因为如此HTML才能得到迅速发展，特别是国内，对于H5页面的应用为微信营销带来的颠覆式的营销。
相关阅读：微信H5活动成功案列分析
HTML是最常用的标记语言。一种设计用于通过在样式文件中嵌入标签和文本注释来处理，定义和显示文本的系统，以使计 […]
