`
WebAppTrend
  • 浏览: 54869 次
社区版块
存档分类
最新评论

关于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是一个独立的技术博客,关注Web App前瞻和实践,以及智能浏览器发展 

请大家在关注ITeye的同时,关注我们的新浪微博 @WebAppTrend,关注我们的腾讯微博@WebAppTrend,欢迎加入我们的Q Q群:193775364
分享到:
评论

相关推荐

    30个html5手机网站源码

    在本篇文章中,我们将深入探讨HTML5在手机网站开发中的应用,以及通过分析30个不同的手机网站源码,你可以学到的关键知识点。 1. **响应式设计**:HTML5引入了媒体查询(Media Queries)和流式布局(Fluid Grids)...

    HTML5参考手册大全7本合集.chm

    这个“HTML5参考手册大全7本合集”包含了多个关于HTML5及其相关版本的手册,是学习和理解HTML5的重要资源。 1. **HTML5的新特性**:HTML5引入了许多新元素,如`&lt;header&gt;`、`&lt;footer&gt;`、`&lt;nav&gt;`、`&lt;article&gt;`等,...

    html5项目例子

    本项目例子集是为开发者提供关于HTML5实际应用的实践展示,通过这些示例,我们可以深入理解HTML5的特性和潜力。 首先,"Geoid Viewer.htm"可能是一个地球模型查看器,利用HTML5的地理定位API和Canvas元素来呈现地球...

    html5网站整站源码

    HTML5是下一代网页标准,它的出现极大地丰富了网页的表现力和功能,为开发者提供了更强大的工具和更多可能性。本资源包含一个"html5网站整站源码",这是一个基于HTML5技术构建的完整网站模板,适合用于学习和参考。...

    html5+css3+JS代码

    首先,HTML5(超文本标记语言第五版)是描述网页内容的标准语言。它引入了许多新特性,如语义化标签(如、、和),离线存储(通过Application Cache实现),以及多媒体支持(如和元素)。此外,HTML5还改进了表单...

    HTML5设计原理

    HTML5的设计不仅仅是关于语法和技术细节的选择,更是一种对未来网络发展趋势的预见和把握。通过对HTML5设计原理的深入了解,我们可以更好地理解为什么某些特性和API会被纳入HTML5规范之中,以及这些选择背后的逻辑和...

    60多套html5移动端模板

    在"60多套html5移动端模板"中,你将发现多种风格和功能各异的设计,可用于各种用途,如企业网站、电子商务平台、个人博客、产品展示等。 HTML5是超文本标记语言的最新版本,它引入了许多新特性,增强了网页的交互性...

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

    HTML5是一种先进的网页标准,它在图形和交互性方面提供了许多增强功能,使得开发者能够创建出更加生动和富有表现力的网页应用。本资源包含了一系列使用HTML5和JavaScript技术实现的图表,包括饼图、柱状图和折线图,...

    html5 滑动页面切换tab

    HTML5是超文本标记语言的第五个主要版本,引入了许多新的元素和API,旨在提高网页的互动性和可用性。对于滑动页面切换Tab的功能,HTML5的一些关键特性包括: 1. 新的结构元素:如`&lt;header&gt;`、`&lt;nav&gt;`、`&lt;section&gt;`...

    html5最终版规范pdf版

    4. **SVG矢量图**:HTML5支持 Scalable Vector Graphics (SVG),这是一种用于呈现矢量图像的XML格式,图像质量不受缩放影响,适合于图标和复杂图形。 5. **离线存储**:通过离线存储机制(Application Cache),...

    html5项目实战

    HTML5是下一代网页标准,它的出现极大地增强了网页的交互性和表现力。在“HTML5项目实战”中,我们将深入探讨...通过“HTML5项目实战”,你可以深入学习这些技术,并将其运用到实际项目中,成为熟练掌握HTML5的开发者。

    50余款手机页面模版源码html5

    50余款手机页面模版源码html5 1.1【32赞HTM5响应式系列之右侧多级滑动式】仿Slideby触屏版html5响应式手机wap网站模板 2【32赞HTML5响应式系列之订餐模板】微官网美食订餐html5触屏响应式手机wap网站订餐模板 5【32...

    HTML5后台控制抽奖程序 转盘+刮刮乐

    HTML5是超文本标记语言(HTML)的第五次重大修订,其主要改进包括更好的离线存储、媒体元素支持、语义化标签以及对图形和动画处理的增强。在这个抽奖程序中,HTML5的Canvas元素被用于绘制转盘和刮刮乐的视觉效果,...

    计算机毕业翻译文献(HTML5相关)

    描述:“毕业翻译文献资料HTML5相关,英文,题目为《The Future of Mobile E-health Application Development: Exploring HTML5 for Context-aware Diabetes Monitoring》” 知识点解析: 1. 移动E-health应用开发...

    uploadify H5版(uploadifive)基于html5的手机上传图片插件

    HTML5是超文本标记语言的第五代标准,它引入了多项新特性,如本地存储、离线应用、Canvas绘图、Web Workers和Web Socket等。其中,File API是HTML5的重要组成部分,它允许在浏览器中处理文件,包括读取、写入和上传...

    《HTML5高级编程》

    HTML5是超文本标记语言的第五个版本,它在2014年正式发布,带来了许多重要的新功能和改进,旨在提高网页的互动性、可访问性和性能。 首先,HTML5的语义化元素是其一大亮点。例如,`&lt;header&gt;`、`&lt;nav&gt;`、`&lt;section&gt;`...

    cocos2d-html5-v2.2.3.zip

    本文将深入探讨Cocos2d-html5,它是一个基于HTML5的版本,允许开发者使用JavaScript进行游戏开发,非常适合那些希望从其他领域转型到游戏开发,特别是对于有前端开发经验的人来说。 在Cocos2d-html5-v2.2.3这个版本...

    Html5示例源码

    这个"Html5示例源码"压缩包显然包含了与HTML5相关的各种示例代码,涵盖了HTML5的新特性,如canvas、video、CSS3以及JavaScript的应用。 首先,Canvas是HTML5的一个重要组成部分,它提供了一个二维的绘图环境,允许...

    html5揭秘中文版

    html5揭秘中文版

    HTML5 坦克大战

    5. 表单元素与交互设计:虽然坦克大战主要是通过Canvas进行图形渲染,但HTML5的表单元素和交互设计也是不可忽视的。比如,游戏的开始、暂停、重置等按钮,以及显示分数、生命值等信息的文本元素,都可能涉及到HTML5...

Global site tag (gtag.js) - Google Analytics