《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元素。
对本地离线存储的更好支持。
新元素和表单控件。
而这些新特性在如今的浏览器最新版本中得到越来越普遍的实现,越来越多的开发者开始学习和使用这些新特性。

相关文章
|
4天前
|
人工智能 程序员 UED
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
2天前
|
前端开发 JavaScript
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
1天前
css3 svg制作404页面动画效果HTML源码
css3 svg制作404页面动画效果HTML源码
45 34
|
5天前
html+js+css实现的建筑方块立体数字时钟源码
html+js+css实现的建筑方块立体数字时钟源码
57 33
|
26天前
一个好看的小时钟html+js+css源码
一个好看的小时钟html+js+css源码
103 24
|
2月前
|
前端开发 测试技术 定位技术
如何利用HTML和CSS构建企业级网站的全过程。从项目概述到页面结构设计,再到HTML结构搭建与CSS样式设计,最后实现具体页面并进行优化提升,全面覆盖了网站开发的关键步骤
本文深入介绍了如何利用HTML和CSS构建企业级网站的全过程。从项目概述到页面结构设计,再到HTML结构搭建与CSS样式设计,最后实现具体页面并进行优化提升,全面覆盖了网站开发的关键步骤。通过实例展示了主页、关于我们、产品展示、新闻动态及联系我们等页面的设计与实现,强调了合理布局、美观设计及用户体验的重要性。旨在为企业打造一个既专业又具吸引力的线上平台。
96 7
|
2月前
|
前端开发 JavaScript 搜索推荐
HTML与CSS在Web组件化中的核心作用及前端技术趋势
本文探讨了HTML与CSS在Web组件化中的核心作用及前端技术趋势。从结构定义、语义化到样式封装与布局控制,两者不仅提升了代码复用率和可维护性,还通过响应式设计、动态样式等技术增强了用户体验。面对兼容性、代码复杂度等挑战,文章提出了相应的解决策略,强调了持续创新的重要性,旨在构建高效、灵活的Web应用。
56 6
|
2月前
|
存储 移动开发 前端开发
高效的 HTML 与 CSS 编写技巧,涵盖语义化标签、文档结构优化、CSS 预处理、模块化设计、选择器优化、CSS 变量、媒体查询等内容
本文深入探讨了高效的 HTML 与 CSS 编写技巧,涵盖语义化标签、文档结构优化、CSS 预处理、模块化设计、选择器优化、CSS 变量、媒体查询等内容,旨在提升开发效率、网站性能和用户体验。
66 5
|
2月前
|
前端开发 JavaScript UED
在数字化时代,Web 应用性能优化尤为重要。本文探讨了CSS与HTML在提升Web性能中的关键作用及未来趋势
在数字化时代,Web 应用性能优化尤为重要。本文探讨了CSS与HTML在提升Web性能中的关键作用及未来趋势,包括样式表优化、DOM操作减少、图像优化等技术,并分析了电商网站的具体案例,强调了技术演进对Web性能的深远影响。
51 5

热门文章

最新文章