Html5不只是个传说

HTML5不只是个传说

钟志百度前端研发QQ:772637

新浪微博： http://t.sina.com.cn/zhongzhi邮箱： [email protected]

2022

HTML5 到 2022年才会成为推荐标准。

HTML5规范主编Ian Hickson

http://blogs.techrepublic.com.com/programming-and-development/?p=718



那时

哥早已不在江湖…

各浏览器厂商的态度

Apple likes HTML5

http://www.apple.com/html5/

Google likes HTML5

http://www.html5rocks.com/

Mozilla (Firefox) likes HTML5

https://developer.mozilla.org/en/HTML/HTML5

Opera likes HTML5

http://www.opera.com/docs/specs/presto25/html5/

Microsoft likes HTML5

http://ie.microsoft.com/testdrive/

我真的只做个旁观者？

反思：

CanvasCanvas

DEMO

学习 HTML5！

顿悟：

http://joshduck.com/periodic-table.html

http://joshduck.com/periodic-table.html

<!DOCTYPE html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"

xml:lang="en" lang="en">

<head>

<meta http-equiv="Content-Type"

content="text/html; charset=utf-8"/>

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset=utf-8"/>

<style>article, aside, dialog,figure, footer, header,hgroup, menu, nav,section { display: block;}</style>

标签升级标签升级

国内浏览器市场占有率

观看在线效果

最最大大障碍障碍

document.createElement

解决方案？解决方案？

document.createElement('article');document.createElement('nav');document.createElement('section');document.createElement('header');document.createElement('footer');...

<!DOCTYPE html><html><head><meta charset="utf-8" /><title>HTML 5 demo</title><style> article, aside, dialog, figure, footer, header, hgroup, menu, nav, section { display: block; }</style></head><body></body></html>

JavaScript APIs

• Canvas• Drag & Drop• History• Inline Editing• Messaging• Offline Apps• Video & Audio

• Geolocation• Local Storage• Selectors• Server Events• Web Sockets• Workers

在项目中使用 HTML5

实战：

canvas在新浪微博中的应用

IE浏览器使用 filter滤镜或者 excanvas

HTML5 在 WebIM中的应用

• localStorage• postMessage • window.navigator.onLine

• userData• window.opener

• js onError

IE的处理方式

Form2.0 在 Mobile开发中的应用

geolocation 在 Mobile开发中的应用

今天我们回顾了HTML5新增的语义化标签、简单介绍了

HTML5 APIs的一些应用以及在项目中对

HTML5的实践

总结

相关资源• http://html5doctor.com/

• http://html5demos.com/

• http://ie.microsoft.com/testdrive/

• http://diveintohtml5.org/

• http://dev.w3.org/html5/html-author/

• http://joshduck.com/periodic-table.html

谢谢大家QQ:772637新浪微博： http://t.sina.com.cn/zhongzhi邮箱： [email protected]

Documents

Html5不只是个传说