关于 HTML5 的七个传说小结


Posted in HTML / CSS onApril 12, 2012

我们所看到的很 多很酷的 HTML5 网站实际上跟 HTML5 无关,而是由 CSS3 和 jQuery 生成的。CSS3 和 jQuery 是和 HTML5 一样的新技术,它们和 HTML5 是平行的概念。

这篇文章讲了关于 HTML5 的7个传说,也就是误解 :)

传说 #1:因为苹果不支持 Flash,所以人们发明了 HTML5

树大招风,苹果似乎经常受到各种指责。虽然 HTML5 可以为移动设备提供一些非常有用的功能,但是它不是为了这个需求而被创造的。事实上,早在2004年,Opera 和 Mozilla 为了解决乱糟糟的网页标准定义了一些好的设计的标准。他们的目的很简单,就是向 W3C 提交这些标准,从而创建一个更好用,更快速的 HTML 标准。这个标准直到2006年才被接受。而在短短的三年内,人们又起草了一个新的标准,审议通过并开始使用。

传说 #2:HTML5 要到2022年才会成熟

我不知道这句话是谁传出来的。我们知道 HTML5 的起草文件已经在2009年审议通过,也就是没有新的内容可以被添加,也不会有显著的改动。你现在就可以使用 HTML5 了,并且不用担心向下兼容问题。你可以通过一些轻量级的 JavaScript 来让老版本的浏览器支持复杂的 Canvas 。所有新版本的浏览器支持 HTML5。你需要担心的不是 HTML 标签,而是 CSS。很多老版本的浏览器对 CSS3 的支持很差。

传说 #3: HTML5 需要 CSS3 支持

虽然 CSS3 能为 HTML5 增色不少,例如语义 class 名字,但这决不是必须的。HTML5 只是标记语言,你当然可以使用 HTML5 + CSS2,只不过没有那么优雅。由于 HTML5 移除了属性和标签,所以你需要为每一个元素指定全部的样式。例如,在 HTML5 中,为了让浏览器正确的渲染页面,你需要为每一个页面元素设置“display:block”声明。简而言之,HTML5 需要样式来让也页面更好看,但不必须是 CSS3。

传说 #4:HTML5 破坏了可访问性(Accessibility)

相反,HTML5 从设计之初就考虑到了可访问性。每一个元素都支持 WIA ARIA 标志角色。这些角色可以让屏幕阅读器这类设备更好的理解页面的内容。

传说 #5:HTML5 是 Flash 杀手

Flash 依然被无数的网站和开发者使用。关于 Flash 和 HTML5 之间的误解来源于 Adobe 和 Apple 之间的争执以及 HTML5 音频和视频应用的迅速普及。虽然 HTML5 可以很好的支持少量的视频播放,但是 HTML5 比 Flash 需要更多的编码资源,而且缺少那些浏览器插件提供的技术。目前类似 Vimeo 和 YouTube 大量的使用 HTML5 技术是为了推广这项技术,他们短期内不会彻底放弃 Flash。开发者 Viki Hoo 关于 Flash 仍然会广泛的被使用有一些令人信服的观点 。

但是从页面设计的角度来看,我们希望尽快的从 FLash 中解脱出来。 HTML5 学起来用起来都更容易。它不需要插件,装载快速,并且对移动设备很友好。所以不是 HTML5 干掉了 Flash,准确的说是 HTML5 将统治移动设计和开发市场。

传说 #6:只要在我的网站上添加了 HTML5 doctype,它就是 HTML5 网站了

从浏览器的角度来说,是的,添加了 HTML5 doctype 的网站都会被认为是 HTML5 网站。但是 HTML5 不仅仅是一个 doctype。它是一套完整的最佳实践、语义标签、排版元素例如 <header>,<nav>,<section>,<article>等等。这些元素能让你的网站利用浏览器的新功能,才能称得上是 HTML5。同时你也要注意那些在 HTML5 中被弃用的元素和属性,以保证兼容性。

传说 #7:使用 HTML5 会让我获得更多的工作/金钱/尊重……

熟练的掌握 HTML5 并不会让你看起来更性感,除非你是 Bruce Lawson。它也不会让你找到梦想的工作。你的实力还是需要通过设计能力,编码能力来体现。当然,学习新技术的热情和毅力是值得欣赏的。你有可能获得同事的尊重,如果你用你的所学帮助他们的话。

HTML / CSS 相关文章推荐
CSS3教程(8):CSS3透明度指南
Apr 02 HTML / CSS
css3圆角样式分享自定义按钮样式
Dec 27 HTML / CSS
CSS Grid布局教程之浏览器开启CSS Grid Layout汇总
Dec 30 HTML / CSS
一款基于css3和jquery实现的动画显示弹出层按钮教程
Jan 04 HTML / CSS
用CSS3实现无限循环的无缝滚动的实例代码
Jul 04 HTML / CSS
css3学习系列之移动属性详解
Jul 04 HTML / CSS
用CSS3和table标签实现一个圆形轨迹的动画的示例代码
Jan 17 HTML / CSS
移动端解决悬浮层(悬浮header、footer)会遮挡住内容的3种方法
Mar 27 HTML / CSS
推荐10个HTML5响应式框架
Feb 25 HTML / CSS
浅谈h5自定义audio(问题及解决)
Aug 19 HTML / CSS
HTML5+CSS3:3D展示商品信息示例
Jan 03 HTML / CSS
video下autoplay属性无效的解决方法(添加muted属性)
May 19 HTML / CSS
Html5新标签解释及用法
Feb 17 #HTML / CSS
html5 canvas 简单画板实现代码
Jan 05 #HTML / CSS
整理的15个非常有用的 HTML5 开发教程和速查手册
Oct 18 #HTML / CSS
HTML5 实战PHP之Web页面表单设计
Oct 09 #HTML / CSS
HTML5标签小集
Aug 02 #HTML / CSS
HTML5的革新 结构之美
Jun 20 #HTML / CSS
HTML5 声明兼容IE的写法
May 16 #HTML / CSS
You might like
PHP 采集程序 常用函数
2008/12/18 PHP
php入门学习知识点八 PHP中for循环基本应用之九九乘法口绝表
2011/07/14 PHP
ThinkPHP独立分组使用的注意事项
2014/11/25 PHP
php实现的mongodb操作类
2015/05/28 PHP
PHP常用设计模式之委托设计模式
2016/02/13 PHP
Thinkphp3.2实用篇之计算型验证码示例
2017/02/09 PHP
PHP中file_put_contents追加和换行的实现方法
2017/04/01 PHP
PHP 实现从数据库导出到.csv文件方法
2017/07/06 PHP
PHP操作Redis常用命令的实例详解
2020/12/23 PHP
jquery中dom操作和事件的实例学习 下拉框应用
2011/12/01 Javascript
jQuery Ajax请求状态管理器打包
2012/05/03 Javascript
基于jquery的has()方法以及与find()方法以及filter()方法的区别详解
2013/04/26 Javascript
Jquery实现顶部弹出框特效
2015/08/08 Javascript
实例解析jQuery插件EasyUI最常用的表单验证规则
2015/11/29 Javascript
深入解析JavaScript中函数的Currying柯里化
2016/03/19 Javascript
jQuery 3.0中存在问题及解决办法
2016/07/15 Javascript
学习Angular中作用域需要注意的坑
2016/08/17 Javascript
Bootstrap实现的标签页内容切换显示效果示例
2017/05/25 Javascript
React组件之间的通信的实例代码
2017/06/27 Javascript
react-native组件中NavigatorIOS和ListView结合使用的方法
2017/09/30 Javascript
Vue.js 实现数据展示全部和收起功能
2018/09/05 Javascript
JS中验证整数和小数的正则表达式
2018/10/08 Javascript
如何通过vscode运行调试javascript代码
2020/07/24 Javascript
Vuejs通过拖动改变元素宽度实现自适应
2020/09/02 Javascript
ES6中的类(Class)示例详解
2020/12/09 Javascript
uniapp开发小程序实现滑动页面控制元素的显示和隐藏效果
2020/12/10 Javascript
[02:08]DOTA2英雄基础教程 马格纳斯
2014/01/17 DOTA
使用python检测主机存活端口及检查存活主机
2015/10/12 Python
解决Linux系统中python matplotlib画图的中文显示问题
2017/06/15 Python
使用Python写一个贪吃蛇游戏实例代码
2017/08/21 Python
Python实现桶排序与快速排序算法结合应用示例
2017/11/22 Python
python中break、continue 、exit() 、pass终止循环的区别详解
2019/07/08 Python
Python rabbitMQ如何实现生产消费者模式
2020/08/24 Python
YesBabyOnline美国:全球性的在线婚纱礼服工厂
2018/05/05 全球购物
台湾母婴用品限时团购:妈咪爱
2018/08/03 全球购物
详解Node.js如何处理ES6模块
2021/05/15 Javascript