《HTML 5+CSS 3入门经典》——1.2 HTML 5 的优势

简介: 本节书摘来自华章计算机《HTML 5+CSS 3入门经典》一书中的第1章,第1.2节,作者:管媛辉 潘凯华著, 更多章节内容可以访问云栖社区“华章计算机”公众号查看。

1.2 HTML 5 的优势

任何新鲜事物的出现,都会带给人们惊喜,同时也会存在很多争议。虽然Web 开发者普遍认为HTML 5 好,但是还是会很担心,例如,新的HTML 5 在老版本的浏览器上能否正常运行,会不会产生错误等各种问题。HTML 5 是基于各种各样的理念进行设计的,这些设计理念体现了对可能性和可行性的新认识。

1.2.1 使用HTML 5 的理由
以下三个理由证明我们可以放心使用HTML 5 。兼容性:HTML 5 在老版本的浏览器上也可以正常运行。实用性:HTML 5 内部并没有封装什么很复杂的、不切实际的功能,而只是封装了简单实用的功能。用户优先性:HTML 5 规范是基于用户优先准则编写的。下面针对这些原则进行介绍。

首先是兼容性问题。虽然到了HTML 5 时代,但并不代表现在用HTML 4 创建出来的网站必须全部重建。HTML 5 并不是颠覆性的革新。相反,HTML 5 的核心理念实际上是保持一切新特性平滑过渡。尽管HTML 5 标准的一些特性非常具有革命性,但是HTML 5 旨在进化而非革命。这一点正是通过兼容性体现出来的。正是因为保障了兼容性,才能让人们毫不犹豫地选择HTML 5 开发网站。
然后是实用性。所谓的实用性,就是要求能够解决实际问题。HTML 5 内只封装了切实有用的功能,不封装复杂而没有实际意义的功能。
最后是用户优先性。HTML 5 规范是基于用户优先准则编写的,其主要宗旨是“用户即上帝”。这意味着在遇到无法解决的冲突时,规范会把用户放到第一位,其次是页面的作者,再次是实现者(或浏览器),然后是规范制定者,最后才考虑理论的纯粹实现。
1.2.2 HTML 5 的化繁为简
HTML 5 的口号是“简单至上,尽可能简化”。因此,HTML 5 做了以下改进。以浏览器原生能力替代复杂的JavaScript代码。新的简化的DOCTYPE。
新的简化的字符集声明。

简单而强大的HTML 5 API 。我们会在以后的章节中详细讲解这些改进。
1.2.3 HTML 5 的无插件范式
过去,很多功能只能通过插件或者复杂的hack(本地绘图API、本地socket 等)来实现。不过,通过插件的方式实现,通常存在以下几个问题。

插件安装可能失败。
插件可能被禁用或者屏蔽。

插件自身会成为被攻击的对象。
插件不容易与HTML文档的其他部分集成(因为插件边界、剪裁和透明度问题)。

虽然一些插件的安装率很高,但在控制严格的公司内部网络环境中经常会被封锁。此外,由于插件还会经常给用户带来烦人的广告,一些用户也会选择屏蔽此类插件。如果这样做,一旦用户禁用了插件,就意味着依赖该插件显示的内容也无法表现出来了。

在我们已经设计好的页面中,要想把插件显示的内容与页面上其他元素集成也比较困难,因为会引起剪裁和透明度等问题。插件使用的是自带的模式,与普通Web 页面所使用的不一样,所以当弹出菜单或者其他可视化元素与插件重叠时,会特别麻烦。这时,就需要HTML 5 应用原生功能来解决,它可以直接用CSS和JavaScript的方式控制页面布局。实际上,这也是HTML 5 的最大亮点,显示了先前任何HTML版本都不具备的强大能力。HTML 5 不仅仅提供了新元素支持新功能,更重要的是添加了对脚本和布局之间的原生交互能力,鉴于此,我们可以实现以前不能实现的效果。
以HTML 5 中的canvas 元素为例,有很多底层的事情以前是没办法做到的(比如,在HTML 4 的页面中就难画出对角线),而有了canvas,就可以很容易地实现了。更为重要的是,新API释放出来的潜能,以及仅需寥寥几行CSS代码就能完成布局的能力。基于HTML 5 的各类API的优秀设计,我们可以轻松对它们进行组合应用。HTML 5 的不同功能组合应用为Web 开发注入了一股强大的新生力量。
1.2.4 HTML 5 的新特性
HTML 5 给人们带来了众多惊喜,例如下面这些优点和新的特性。基于HTML、CSS、DOM和JavaScript。减少了对外部插件的需求(比如Flash)。更优秀的错误处理。

更多取代脚本的标记。
独立于设备。
用于绘画的canvas元素。
用于媒介回放的video和audio元素。
对本地离线存储的更好支持。
新元素和表单控件。
而这些新特性在如今的浏览器最新版本中得到越来越普遍的实现,越来越多的开发者开始学习和使用这些新特性。

相关文章
|
13天前
|
前端开发 JavaScript 开发工具
【HTML/CSS】入门导学篇
【HTML/CSS】入门导学篇
22 0
|
4天前
|
数据采集 前端开发 网络协议
如何使用代理IP通过HTML和CSS采集数据
如何使用代理IP通过HTML和CSS采集数据
|
8天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
18 1
|
8天前
|
PHP
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
|
15天前
|
JSON JavaScript 前端开发
js是什么、html、css
js是什么、html、css
|
16天前
|
XML 前端开发 JavaScript
css和html
【4月更文挑战第7天】css和html
12 0
|
21天前
|
人工智能 前端开发 JavaScript
【前端设计】HTML+CSS+JavaScript基本特性
【前端设计】HTML+CSS+JavaScript基本特性
|
1月前
|
前端开发 容器 内存技术
使用CSS3画出一个叮当猫HTML源码
本文教程介绍了如何使用CSS3绘制叮当猫,通过HTML结构和CSS样式逐步构建叮当猫的各个部位,如头部、脸部、脖子、身体、手脚等。代码示例展示了如何利用渐变、边框、阴影和定位技巧实现三维效果和细节特征。此外,还添加了眼珠的动画效果,让叮当猫的眼睛能够转动。整个过程适合对CSS3感兴趣的读者参考学习,以提升动态图形创作技能。
16 0
使用CSS3画出一个叮当猫HTML源码
|
1月前
|
XML 编解码 前端开发
编程笔记 html5&css&js 033 HTML SVG
编程笔记 html5&css&js 033 HTML SVG