HTML5资料整理 [From luics]

来自http://www.cnblogs.com/luics/,新浪微博@徐凯-鬼道

HTML5资料整理

项目组要做html5这块,花了一周左右时间收集的,快有一年时间了,部分内容需要更新,仅供参考。如需更新请回复

几点说明:

  1. 本次收集的信息以HTML5为主,这里的HTML5 ~= HTML5 +
    Javascript + CSS3

  2. 以下资料的协议相关部分主要来自W3C、WHATWG;demo库和开发工具等主要来自IT企业、技术组织的官网或其信息站点

  3. W3C正式发布的协议称为Recommendation(推荐),下文中“协议”、“推荐”、“REC”是同义词;“协议”未通过之前以“草案”的形式存在

[基本信息]

2个组织

  • W3C,万维网联盟,Web标准制定者

  • WHATWG,由浏览器厂商的员工发起的非正式组织,致力于改进HTML,其成员来自Mozilla、Opera、Apple、Google

HTML5发展

  • HTML 4.01于1999年发布,2000年W3C发布了XHTML 1.0

  • 第一份正式草案公布于2008.1.22,最新草案发布于2011.9.6

  • HTML5草案的前身为Web Applications 1.0,2004年由WHATWG提出,2007年被W3C接纳,并成立了新的HTML工作组(合并XHTML团队)




“WHATWG致力于web表单和应用程序,而W3C专注于XHTML
2.0。在2006年,双方决定进行合作,来创建一个新版本的HTML” —— 摘自W3school

  • WHATWG目前仍然是HTML5的主力,HTML5的最新进展会发布在这两个组织的官网,以下默认使用W3C公布的信息

HTML5的新特性体现在下图显示的8个部分,HTML5希望创建一个有本地存储、富客户界面、高效网络IO的Web App。HTML5 Presentation是以下文字和图表更加直观的版本:

  • 语义(Semantic),新增header、footer、nav、fig等含有语义的标签,以及一系列含有语义的标签属性

  • 离线&存储(Offline&Storage),主要包括Local Storage、Indexed DB、File
    API

  • 设备访问(Device
    Access),定位信息已经广泛应用,其他还有视频、音频流(如语音输入 ),移动设备的传感器(如方向传感器)

  • 网络连接(Connectivity),增加Web Socket、服务器数据推送

  • 多媒体(Multimedia),增加video、audio标签,提供原生的视频、音频访问

  • 图形接口(GDI),增加canvas标签,提供2D,3D
    GDI,现已有第3方的WebGL可以提供3D加速渲染

  • 性能&整合(Performance
    & Integration),Web Workers实现脚本后台运行,并提供前后台交互接口,XMLHttpRequest
    2提供更好的网络IO

  • CSS3,目前仍在开发之中,主流浏览器已经支持其中部分特性Dashboard是更完整的CSS3
    demo




最新进展参见WHATWG NewsW3C HTML首页




[Demo库]

这里将所有demo库粗略分为应用和游戏,涵盖了组织、企业、个人开发或收集的demo

[应用demo库]

Edge的Samples,Adobe Edge制作的html5动画

Html5Rocks, Google demo库

  • HTML5
    Presentation
     ,h5版ppt,详细介绍了h5的新特性,里面的demo可直接玩

  • WebGL
    Globe
    ,使用WebGL
    3D加速,展示canvas
    3D特性

  • Ascii
    Art
    ,使用WebSocket同步服务器数据(字符视频)

  • Notification Time,Notification API,提供页面范围以外的消息提示,目前主流浏览器中只有chrome实现

  • Drag n
    Drop Photos
    , 拖拽文件到浏览器,使用DnD,File API

  • Page
    Flip
    ,书本翻页,基于CSS3 2D
    transform和animation

html5demos ,人气很高的第三方demo库,提供按特性过滤查看demo

Web O‘
Wonder
,奇幻网络,Mozilla提供的demo库

  • Dashboard,展示HTML5、CSS3、SVG、JS等技术的新特性,CSS3的demo很丰富

Safari Technology Demos,Apple提供的demo库

  • Photo
    Transitions
    ,图片切换的动画效果

  • Gallery,幻灯片,多种展现模式:水平、垂直、3D滚动..

  • 虚拟现实(VR),基于css3 transforms

  • 360°,360°旋转,本以为是3D效果,竟然用了72张图片

IE Test
Drive
,Microsoft为IE开的demo库站点,大量html5的demo

10K
Apart
,HTML5竞赛作品,基本要求是打包后10KB以内

canvasdemos,专注于canvas的demo库

HTML5研究小组收集的demo库,“HTML5研究小组”是中国首个HTML5推广和交流的开放组织

一些零散的demo:

[游戏demo库]

Mozilla
Labs Gaming
,Mozilla官方的html5游戏demo库,下面是库中获奖作品

  • Marble Run,冠军游戏(best
    web-iness),画面精细,chrome13下运行较流畅(汗)

  • Robots are people
    too
    ,获得“最有趣奖”(most
    fun)

html5games,第三方游戏demo库

HTML5研究小组收集的游戏demo库

游戏引擎:ImpactRocketGameClosureYoYo

一些零散的demo:

  • CubeSpace,搭积木,强大的回放功能

[兼容性]

Html5 test,提供html5新特性的检测

html5兼容性手册

  • Where can I
    use..
    ,提供详尽的兼容性信息,提供按特性查找

  • HTML5
    readiness
    ,数据来源于前者,提供按时间查询HTML5兼容性,有趣的展现形式

Compatibility Master Table,quirksmode提供的兼容性数据库,涵盖了DOM、CSS、JS等

HTML5 in Firefox,Mozilla 提供的Firefox html5兼容性列表

HTML5
in Chrome
,Chromium提供的开发进度信息

HTML5 in IE:官方版本非官方版本

Mobile
HTML5
,Mobile
Browser对HTML5的支持

兼容性工具

[开发]

开发手册&文档

Edge,Adobe开发的html5动画制作工具,生成的动画依赖的库较多,直接用于mobile设备文件过大

Swiffy,flash转html5工具

Modernizr,javascript库,对html5、css3 做退化处理

CSS3-HTML5之家,国内的一个站点

HTML5研究小组

Scirra,HTML5 游戏开发平台(付费)

时间: 2024-08-25 23:25:01

HTML5资料整理 [From luics]的相关文章

不错的Nodejs或者JS资料整理

资料整理 Node.js官网 - 可以下载到Node.js以及查看官方文档 Node.js教程 - 菜鸟教程网 Javascript模块化编程(一):模块的写法 - 阮一峰老师的日志,很值得看 CommonJS官网 requireJS官网 - AMD规范在其中 seaJS官网 - CMD规范在其中 request模块 cheerio模块

iOS开发资料整理

Please help me contribute to this list, for non-experience iOS developers or someone who need a come-in-handy library list to refer or to use in their projects. Fork, edit and send a PR are all things you can do! Table of Contents UI Component// UI组件

iOS 开发学习资料整理(持续更新)

"如果说我看得比别人远些,那是因为我站在巨人们的肩膀上." ---牛顿 iOS及Mac开源项目和学习资料[超级全面] http://www.kancloud.cn/digest/ios-mac-study/84557 iOS 学习资料整理 https://segmentfault.com/a/1190000002473595#articleHeader16 iOS.mac开源项目及库 https://github.com/Tim9Liu9/TimLiu-iOS Swift语言 http

mql4资料整理

mql4资料整理 开发工具和SDK相关 http://codebase.mql4.com/cn/在该页面的左边有MeteTrader 5 和 页面 MT4的开发工具下载 开发资料1. 参考文档http://docs.mql4.com/cn/ 2.其它相关bloghttp://www.cnblogs.com/niniwzw/category/212678.htmlhttp://www.cnblogs.com/niniwzw/tag/MQL4/3.其它相关资源学习列表http://search.do

Doxygen资料整理

@author          作者@brief             摘要@version         版本号@date             日期@file                文件名,可以默认为空,DoxyGen会自己加@class             类名@param           函数参数@return           函数返回值描述@exception      函数抛异常描述@warning         函数使用中需要注意的地方@remarks

zz 圣诞丨太阁所有的免费算法视频资料整理

首发于 太阁实验室 关注专栏 写文章 圣诞丨太阁所有的免费算法视频资料整理 Ray Cao· 12 小时前 感谢大家一年以来对太阁实验室的支持,我们特地整理了在过去一年中我们所有的原创算法类视频,均为免费观看,方便大家学习. 先放一个ACM大神讲解的算法题视频(国外传优酷真的是太不容易了……). ACM大神精讲北美最新面试题—在线播放—优酷网,视频高清在线观看http://v.youku.com/v_show/id_XMTg2ODk0MzIwMA==.html 其余视频: [公开课]ACM大神精

JS搞基指南----延迟对象入门提高资料整理

原文:JS搞基指南----延迟对象入门提高资料整理 JavaScript的Deferred是比较高大上的东西,  主要的应用还是主ajax的应用,  因为JS和nodeJS这几年的普及,  前端的代码越来越多,  各种回调套回调再套回调实在太让人崩溃, 所以就从后端拖了一个延迟对象这货, 用来解决回调地狱这个问题 .  我们使用ajax的时候多数都是为ajax添加回调 ,然后异步向服务器发送请求, 比如如下原生的XHR代码: <!DOCTYPE html PUBLIC "-//W3C//D

archlinux相关资料整理

Arch linux Arch Linux Wiki Arch linux Wiki Markdown Arch Wiki python continuing ... archlinux相关资料整理,布布扣,bubuko.com

3分钟带你了解PowerShell发展历程——PowerShell各版本资料整理

本文带你了解PowerShell发展历程,顺便整理了一点资料,方便大家查询. Windows PowerShell? 是基于任务的命令行管理程序和脚本语言,专为进行系统管理而设计. 在 .NET Framework 的基础上构建的 Windows PowerShell 可帮助 IT 专业人士和高级用户控制和自动执行 Windows 操作系统以及在 Windows 上运行的应用程序的管理. UNIX 系统一直有着功能强大的脚本(shell),Windows PowerShell 的诞生就是要提供功