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

相关文章
|
5月前
|
存储 自然语言处理 前端开发
抖音快手小红书虚拟评论截图生成器,模拟对话制作工具,html+js+css
这是一款纯前端实现的多平台虚拟评论生成器,支持抖音、快手、小红书风格,适用于产品演示与UI设计。采用Vanilla JS与Flexbox布局,利用IndexedDB存储数据,CSS Variables切换主题。
|
5月前
|
存储 前端开发 安全
病历单生成器在线制作,病历单生成器app,HTML+CSS+JS恶搞工具
本项目为医疗病历模拟生成器,旨在为医学教学和软件开发测试提供数据支持,严格遵守《医疗机构病历管理规定》。
|
5月前
|
存储 前端开发 JavaScript
仿真银行app下载安装, 银行卡虚拟余额制作app,用html+css+js实现逼真娱乐工具
这是一个简单的银行账户模拟器项目,用于学习前端开发基础。用户可进行存款、取款操作,所有数据存储于浏览器内存中
|
5月前
|
前端开发 容器
处方单图片生成器, 处方单在线制作免费,js+css+html恶搞神器
这是一个电子处方模拟生成系统,使用html2canvas库实现图片导出功能。系统生成的处方单包含多重防伪标识,并明确标注为模拟数据,仅供学习
|
5月前
|
前端开发 JavaScript 容器
制作b超单生成器, 假怀孕b超单图片制作, p图医院证明【css+html+js装逼恶搞神器】
本资源提供一个适合用于熟人之间恶搞的工具,效果逼真,仅供学习参考与娱乐。包含前端技术学习要点:语义化布局、响应式设计、Flexbox、图片自适应
|
5月前
|
前端开发
医院检查单子p图软件,在线制作仿真病历,js+css+html装逼神器
本示例展示如何用HTML/CSS创建医疗信息页面,内容仅供学习参考。页面模拟“阳光医院体检中心”场景,提供预约功能验证(如姓名、手机号、日期)。所有数据仅用于演示
|
10月前
|
人工智能 程序员 UED
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
481 21
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
9月前
|
前端开发
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
274 1
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
|
10月前
|
前端开发 JavaScript
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
292 14
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
10月前
css3 svg制作404页面动画效果HTML源码
css3 svg制作404页面动画效果HTML源码
206 34