`
t225com
  • 浏览: 661797 次
文章分类
社区版块
存档分类
最新评论

关于HTML5你不得不知道的五件事情

 
阅读更多

1. HTML5并非是一整块


你也许会问:“如果老的浏览器不支持HTML5我该如何开始呢?”这个问题本身就是具有误导性的。HTML5并不是一大块整体,而是一系列单独特性的集合。所以你是不可能去检测“HTML5支持性”的,因为根本就没有这种东西存在。但是你可以测试对某些特性的支持,比如画布功能、视频功能、地理定位功能。

你可能认为HTML5是一系列标签和尖括号。这的确是HTML5中很重要的部分,但并非全部。HTML5的定义还定义了如何让这些尖括号通过文件对象模型(Document Object Model ,DOM)和Javascript交互。HTML5并不会只是定义一个<video>标记,同时还会有相应的针对相应视频对象的DOM API。你可以使用这个API来检测对不同视频格式的支持,播放视频、暂停、静音、记录下载进度,以及其他你需要围绕着这个<video>标记用来构建丰富用户体验的功能。

Chapter 2以及Appendix A会将会你如何检测对HTML5的各种新功能的支持性。

2. 你不需要丢弃现有的任何东西

不管是喜欢还是不喜欢,你都不可否认HTML4是有史以来最成功的标记格式。HTML5就是建立于它的成功之上。你不需要丢掉现有的标记。你不需要重新学习你已经知道的东西。如果你的Web应用以前是用HTML4运行的,那么它现在在HTML5的标准之下仍然可以运行。

现在,如果你想要提升你的Web应用,你就找对了地方。这里有一个具体的例子:HTNL5支持所有来自于HTML4中对表单的控制,但它同时还包括了一些新的输入控制。其中包括一些期待已久的功能,如滑块和日期选择器,另外还有些更微妙的。例如:邮件输入类型看起来就像一个文本框,但是移动浏览器会定制它们屏幕上的界面以便让输入邮件地址更为容易。老的不支持邮件输入类型的浏览器会将它仍然看做一个常规的文本域,表单在不对代码做修改的情况下是可以正常进行的。这意味着你可以现在就提升你的Web表单,即使你的一些访客还在使用IE 6.

你可以在Chapter 9中读到关于HTML5表单的所有精彩细节。

3. 非常容易开始

“升级到”HTML5和改变你的doctype一样简单。Doctype应该已经是每一个HTML页面的第一行了,之前的HTML版本定义了很多doctypes,选择正确的doctype是件很困难的事情。但是在HTML5中,只有一种doctype:

<!DOCTYPE html>

升级到HTML5的doctype不需要你改变现有的标记,因为所有在HTML4中定义的标签在HTML5中仍然可以使用。但是现在,你可以使用新的语义元素,比如<article>, <section>,<header>和 <footer>。你可以在Chapter 3中看到所有关于这些新元素的内容。

4.HTML5已经在工作了

不管你自己是否想要利用HTML5在画布上绘图、播放视频、设计更好的表单,或是构建能离线工作的Web应用,你会发现HTML5已经得到良好的支持了。Firefox, Safari, Chrome, Opera以及移动浏览器都支持画布(Chapter 4)、视频(Chapter 5)、地理定位(Chapter 6)、本地存储(Chapter 7),以及其他更多特性。Google已经支持微观数据的注解(microdata annotations ,Chapter 10)。甚至是Microsoft——很少会支持开放标准的公司——也将在即将上市的IE9中支持HTML5的大多数特性。

这本书的每一章都包括大家已经非常熟悉的现有浏览器兼容性的内容。但是更为重要的是,每一章都告诉你如果你需要支持老的浏览器,你该如何去做。HTML5的一些特性,比如地理定位(Chapter 6)和视频(Chapter 5),最开始是由Gears 或是Flash等浏览器插件提供的。其他的一些特性,如画布(Chapter 4),则完全可以由Javascript仿真实现。这本书会将会你如何能定位到最时新的浏览器的特性上,又不会置老的浏览器于不顾。

5. HTML5就是未来

Tim Berners-Lee在1990s年代早期发明了world wide web。他接下来创立了W3C作为Web标准的管家,这个组织扮演这个角色已超过15年了。下面是W3C在2009年对Web标准的预言:

今天,董事宣布,截至2009年底,当XHTML2工作组章程(XHTML 2 Working Group charter)届满时,章程将不再更新。通过这样做,以及在HTML工作组(HTML Working Group)增加资源,W3C希望能加快HTML5的进展,并表明W3C对HTML的未来问题上的立场。

所以,HTML5就是未来。让我们一起上来深入了解吧

原文链接:Five Things You Should Know About HTML5


译文来源:http://www.webapptrend.com/
WebAppTrend是一个独立的技术博客,关注WebApp前瞻和实践,以及智能浏览器发展

请大家在关注CSDN的同时,关注我们的新浪微博 @WebAppTrend,关注我们的腾讯微博@WebAppTrend,欢迎加入我们的:193775364

分享到:
评论

相关推荐

    软件工程师-HTML5可以做的五件事情以及设计案例.docx

    软件工程师-HTML5可以做的五件事情以及设计案例.docx

    2021-2022年收藏的精品资料软件工程师HTML5可以做的五件事情以及设计案例.docx

    精品教育教学资料

    html5介绍.ppt

    ppt格式的html5 介绍,非常形象、生动的资料

    HTML5高级程序设计

    HTML5高级程序设计.pdf HTML5 基础学习文档

    HTML5设计原理

    我可以站在这儿只讲HTML5,但我并不打算这样做,因为如果你想了解HTML5的话,你可以Google,可以看书,甚至可以看规范。 实际上,确实有人会谈到规范的内容。史蒂夫•福克纳(Steve Faulkner)会讲HTML5与可访问性。...

    html5shiv.js

    htnl5shiv主要解决HTML5提出的新的元素不被IE6-8识别,这些新元素不能作为父节点包裹子元素,并且不能应用CSS样式。让CSS 样式应用在未知元素上只需执行 document.createElement(elementName) 即可实现。html5shiv...

    html5揭秘中文版

    html5揭秘中文版

    html5教程和手册

    1.0 html5 简介 2.0 html5 视频 3.0 html5 音频 4.0 html5 Canvas 5.0 html5 web存储 6.0 html5 Input类型 7.0 html5 表单元素 8.0 html5 表单属性 9.0 html5 参考手册 10.0 html5 标准属性 11.0 html5 事件属性

    程序员爱情表白专用html5动画网页的代码

    程序猿表白专用的html5动画特效网页,真的挺羡慕创作者的水平,有这水平可以把爱表白给想表白的人,不要以为那些鲜花是用的图片,你会发现在资源文件中没有一个图片资源,但HTML5强大的功能不能不让你惊叹,左侧的...

    完整版《HTML5高级程序设计》2

     本书由旧金山HTML5用户组创建人联合另两位资深Web开发专家共同打造,为读者清晰解读了HTML5规范的缘由、发展和现状,全面展示了如何使用 WebSocket、Geolocation、Web Storage、Canvas及音频视频等前所未有的新...

    HTML5 in Action

    HTML5 in Action provides a complete introduction to web development using HTML5. You’ll explore every aspect of the HTML5 specification through real-world examples and code samples. It’s much more ...

    IE6/7/8支持Html5

    IE7、7、8想必大家都知道了,对Html5支持是有很大的问题的,现提供html5shiv.js来解决此问题。用法如下所示: &lt;!--让IE(IE6/7/8)支持Html5标签--&gt; &lt;!–[if lt IE9]&gt; &lt;script src="Content/Js/...

    《HTML5开发精要与实例详解》配套源码

    此为《HTML5开发精要与实例详解》的全部配套源码 本书由资深Web开发专家亲自执笔,内容的权威性上应该是毋庸置疑的。 本书在内容结构上将继承《HTML 5与CSS 3权威指南》一书的优点,几乎每个知识点都将配一个精心...

    高性能HTML5

    《高性能html5》为读者讲解了如何用html5 从一开始就设计一个高性能的网站,以及如何对已有网站进行改良,使得它们具备优越的性能。《高性能html5》中总结了许多实践经验、关键技巧,并提供了丰富的示例,作者有意...

    html5 简单实例源代码

    html5 简单实例源代码

    html5 滑动页面切换tab

    html5 滑动页面切换tab,点击tab也可以切换,非常实用。

    HTML5 chm 手册

    HTML5 chm 手册HTML5 chm 手册HTML5 chm 手册HTML5 chm 手册HTML5 chm 手册HTML5 chm 手册HTML5 chm 手册

    html5饼图、柱状图、折线图,Html5+JS开发

    一款来自日本的饼图、柱状图、折线图,很漂亮的哦,喜欢就带它走吧\(^o^)/。 使用Html5+JS开发,兼容ie/Chrome/火狐,其他浏览器未测

Global site tag (gtag.js) - Google Analytics