本书先简要介绍了如何用HTML5 和CSS3 制作网站,然后全面介绍了API 和Canvas 2D,接着介绍了如何在手机浏览器上开发HTML5 相关的应用、WebSocket API 相关的三个案例和时下较为流行的Node.js环境,*后介绍了瘦服务器战略和云的概念。
本书主要供业内的前端开发人员使用,也可供大专院校相关师生、行业技能培训学校作为相关教材和参考书。

序
30年前,一位伟大的物理学家发明了HTML和WWW浏览器,新时代的黎明就此点亮——我们站在博纳斯?李的肩上。
60年前,一位杰出的数学家用自己的大脑模仿电路,运行国际象棋程序与同事对弈——我们仍然与艾伦?图灵同行。
70年前,一所精英的大学接受了军方的机密订单,然而当这个世界首台电子计算机完工时,战争已经结束——我们手中的设备都是埃尼阿克的后代。
仅仅100年内,人类见证了多少次的飞跃,自己也说不清楚。然而,今天的我们,必须面对不愿看到的现实。本来期望“解放人脑”的机器,成为超时劳动的操作台;本来期望“沟通从心开始”的手机,因为“苹果-品牌-山寨”将人分成三六九等。
回到草根的车库,回到校园的机房,回到一群不修边幅的极客中去!我们不会停步,我们正在前行,我相信,各种不平等就在这里改变,我们的辛苦终将培育一树果实,人人可以品尝。
今天我要告诉你,我的朋友们,我有一个梦。
我有一个梦,那就是无论收入、学历、年龄、地区,每个人都能用*舒服的方式获得信息,人人平等不是空话。
我有一个梦,那就是作者用任意设备都可以写出网页,无论是电脑、电视、手机还是平板,到处可以运行,显示同样漂亮。
我有一个梦,有朝一日就连*旧的电脑、*便宜的手机,也能将*新的网站完整呈现,人们不会将这些用户与机器一并拒之门外。
我有一个梦,在标准化成为趋势的今天,每个人的才能得以发挥,网站不再千篇一律,让上网成为真正充满新奇的旅程。
我有一个梦,在通信费用日益下降的同时,互联网给各行各业带来更多的价值。
我有一个梦,就让HTML5成为梦想实现的平台,我期待看到你的出现。
我有一个梦,就在今天。
本书得以出版,要感谢三位**作者(也是名副其实的极客)——秀野堂主、蒋宇捷和罗睿的心血付出,感谢图灵教育各位编辑老师的斧正点拨,感谢HTML研究小组大陆和台北10地负责人、小组**成员、各地分享嘉宾、《微周刊》编辑组,以及来自众多企业、个人无私的支持……如果一一细数,感谢的篇幅就太长了,我特别请求编辑老师允许,在这里列出每一个人的名字,我们的小小梦想,有你才能实现——李开复、黄何、赵霏、白洁、Sherry、肇辉、蔡学镛、汪华、张亮、陈琦、Mike Smith、李安琪、殷**、苏丹、赵锦江、黄蔚瀚、温久和、邱志钢、大城小胖、施煊、大胖、于涛、林挺、周智超、谢莉莎、王楚、李智、尼西瑞、任伟、苏震巍、赵隽、吴庆、李万鹏、余浩、龙辉、胡坤、钟卫、黄继佳、亓光宇、阮曙东、杨永智、刘铁峰、严重捷、汪强兵、方勋、范伟、徐以雷、陈柏宇、周裕波、苏菂、霍泰稳、蒋涛、刘江、王煜全、谢工、武卫东、杨海玲、王军花、杨东杰、炳叔、徐城、郜枫、李正林、汪乐、张萌、孙广宇、苏昌茂、王海宁、柴春燕、杜亚波、许怡然、钟秀、商荣晶、辛领、刘嘉琪、孟少婷、董龙飞、马鉴、潘榆文、唐俊开、李秉骏、吴放、徐昊、朱彤、王潇、刘勇、余波、黄冠、郝克明、老赵、许雄杰、古建国、曾少宁、戴周颖、费俊、倪海宇、吕欣、朱兆龙、鄢学鹍、马珂……
我更要感谢你,亲爱的读者,感谢你加入这次旅行,一路有你,我心歌唱。 ——田爱娜,创新工场磊友团队商务VP,中国HTML5研究小组发起人

第1章 利用HTML5制作网站 1
1.1 大多数人不了解HTML5时代的网页设计 1
1.2 HTML5带来的网页结构、设计风格及理念的变化 3
1.2.1 HTML 4时代的几个特征 4
1.2.2 一个典型的HTML5页面 4
1.2.3 小结 6
1.3 HTML5带来的标签变化 6
1.3.1 什么是标签 6
1.3.2 标签的分类 7
1.3.3 近十几年来的HTML 9
1.3.4 Web的变化趋势 9
1.4 HTML5带来的表单数据内容进化 9
1.4.1 数据提交格式的变化 10
1.4.2 数据提交范围的变化 11
1.4.3 表单数据类型的增加 12
1.4.4 表单属性和验证方式的进化 13
1.4.5 文件上传控件和重复模型的应用 14
1.4.6 小结 14
1.5 HTML5与SEO 15
1.5.1 技术趋势 15
1.5.2 搜索引擎服务商面临的问题 16
1.5.3 SEO从业人员面临的问题 17
1.5.4 SEO面临的几个社会问题 18
1.6 HTML5的开发环境与调试环境 18
1.6.1 HTML5编写工具 18
1.6.2 JavaScript开发 19
1.6.3 HTTP监控 19
1.6.4 调试环境 20
1.7 案例:HTML5网站建设 22
1.7.1 需求的提出 22
1.7.2 需求分析 22
1.7.3 系统分析 22
1.7.4 工程实现 23
1.7.5 小结 27
第2章 用CSS3完善网站 28
2.1 文字模块 29
2.1.1 文字阴影:text-shadow 29
2.1.2 文字溢出:text-overflow 30
2.1.3 文字换行:word-wrap 30
2.2 颜色模块 31
2.2.1 透明度:opacity 31
2.2.2 HSL 33
2.2.3 HSLA和RGBA 33
2.3 边框模块 34
2.3.1 边框圆角:border-radius 34
2.3.2 边框颜色:border-color 36
2.3.3 边框图像:border-image 37
2.3.4 盒阴影:box-shadow 40
2.4 用户界面模块 41
2.4.1 盒倒影:box-reflect 41
2.4.2 盒大小:box-sizing 41
2.5 背景模块 42
2.5.1 背景渐变 42
2.5.2 background-origin 45
2.5.3 background-clip 46
2.5.4 background-size 47
2.5.5 多背景 48
2.5.6 遮罩 49
2.6 动画模块 51
2.6.1 transform 51
2.6.2 transition 53
2.6.3 animation 55
2.7 区域模块 57
2.7.1 故事线 58
2.7.2 区域样式 60
2.7.3 内容形状和环绕 60
2.7.4 小结 62
2.8 选择器 62
2.8.1 结构伪类 63
2.8.2 否定伪类 65
2.8.3 状态伪类 65
2.8.4 目标伪类 66
2.8.5 其他选择器 66
2.9 其他模块 68
2.9.1 多栏布局 68
2.9.2 弹性盒子布局 68
2.9.3 网络字体 69
2.9.4 媒介查询 70
2.9.5 滤镜效果 70
2.9.6 着色器 70
2.10 使用CSS3美化网站 72
2.10.1 右上角文字 73
2.10.2 下载盒子 74
2.10.3 图片格子 74
2.10.4 中间盒子 74
2.10.5 左右盒子 75
2.10.6 居中背景 76
2.10.7 载入效果 76
2.10.8 页脚 77
2.11 小结 77
第3章 划时代的Web API 79
3.1 传统Web模型与Web OS架构模型 79
3.2 Web API的概要介绍 81
3.3 Drag & Drop API 82
3.3.1 以前的解决方案 82
3.3.2 Drag & Drop API的优点 83
3.3.3 如何检测浏览器是否支持
Drag & Drop API 83
3.3.4 Drag & Drop API的主要操作 84
3.3.5 文件拖放上传实例 86
3.4 History API 87
3.4.1 以前的解决方案 87
3.4.2 现在的History API 87
3.5 Communication API 89
3.5.1 以前解决跨源通信的方案 89
3.5.2 XMLHttpRequest Level 2 90
3.5.3 iframe和sandbox 91
3.5.4 跨文档消息通信 92
3.6 Notification API 97
3.6.1 如何检测浏览器是否支持Notification API 97
3.6.2 Web的Notification的状态 97
3.6.3 让你的Web App带着Notification跑 97
3.7 audio标签和video标签 99
3.7.1 audio标签 100
3.7.2 video标签 102
3.8 Canvas API 108
3.8.1 以前的同类解决方案 109
3.8.2 Canvas的优点 109
3.8.3 检测浏览器是否支持Canvas 109
3.8.4 Canvas主要操作 109
3.9 WebSocket API 110
3.10 Web Worker API 111
3.11 Web Storage API 111
3.12 MicroData和语义网络 111
3.12.1 MicroData的常见属性 112
3.12.2 MicroData的例子 112
3.12.3 MicroData与SEO——人类需要有序的信息 113
3.12.4 语义网络的基本概念 113
3.12.5 语义测试工具 114
3.13 通用Base64方法 114
3.13.1 编码 114
3.13.2 解码 115
3.13.3 应用 115
3.14 Web Database API 117
3.14.1 Web SQL API 117
3.14.2 Indexed DB API 121
3.15 WebGL 124
3.16 Device API 系列 125
3.16.1 Geolocation API 125
3.16.2 File API 128
3.16.3 FileWriter API 132
3.16.4 Media Capture API 132
3.16.5 Contact API 133
3.16.6 System Information API 134
3.16.7 Calendar API 137
3.16.8 Messaging API 137
3.17 小结 138
第4章 Canvas 2D 139
4.1 什么是Canvas 139
4.2 Canvas 2D原理 140
4.2.1 坐标系统说明 141
4.2.2 属性说明 142
4.3 绘制 143
4.3.1 各类线条 143
4.3.2 矩形 151
4.3.3 三角形 152
4.3.4 圆与扇形 153
4.3.5 图片 155
4.3.6 文字 158
4.4 ** 160
4.4.1 渐变 160
4.4.2 阴影与透明 162
4.5 基础操作中比较复杂的部分 162
4.5.1 保存和恢复 163
4.5.2 坐标转换 163
4.5.3 旋转 164
4.5.4 缩放 164
4.5.5 变形 164
4.5.6 组合 166
4.5.7 裁剪 167
4.5.8 像素操作 170
4.6 动画 172
4.6.1 左右运动 172
4.6.2 上下运动 173
4.6.3 圆心旋转运动 174
4.6.4 抛物线运动 175
4.6.5 渐变运动 175
4.7 事件感应 176
4.8 关于Canvas的一些经验 177
4.8.1 回答两个问题 177
4.8.2 避开浮点运算 178
4.8.3 资源载入与双缓冲问题 178
4.8.4 图片抗锯齿的原理及办法 179
4.8.5 粒子系统的使用 181
4.9 Web开发复古流 181
4.10 小结 182
第5章 HTML5和移动互联网开发 183
5.1 移动互联网的现状与需求 183
5.1.1 市场容量 184
5.1.2 移动设备的特点 184
5.1.3 移动设备的现状 185
5.1.4 ***生态圈 185
5.1.5 可供选择的移动互联网开发平台 185
5.2 HTML5在移动互联网上的开发示例 187
5.2.1 一个HTML5***的基本配置 187
5.2.2 欧朋浏览器H5版介绍 188
5.2.3 重力传感设备 191
5.2.4 电子罗盘开发 199
5.2.5 Geolocation与LBS应用开发 203
5.2.6 网页摄像与网络相册 207
5.2.7 移动设备中的离线存储 214
5.3 小结 215
第6章 WebSocket开发应用 216
6.1 WebSocket的那些事儿 216
6.1.1 WebSocket的技术背景 217
6.1.2 WebSocket的定义 218
6.1.3 WebSocket通信模式解析 219
6.1.4 WebSocket检测浏览器支持代码 220
6.2 WebSocket API的内容 220
6.2.1 属性 220
6.2.2 URL 221
6.2.3 事件 221
6.3 客户端样例程序 222
6.4 服务器端样例程序 222
6.5 Ajax、长轮询、Comet之间的那些事儿 223
6.5.1 Ajax 223
6.5.2 长轮询 225
6.5.3 Comet 226
6.5.4 Ajax与WebSocket的多角度对比 227
6.6 与WebSocket相关的几个概念 227
6.6.1 SSJS 228
6.6.2 Node.js 228
6.7 开发基于WebSocket的通信示例 235
6.7.1 聊天室 235
6.7.2 服务器监控 239
6.7.3 联机作图 243
6.8 免费的WebSocket资源 247
6.9 小结 248
第7章 瘦服务器战略与云 249
7.1 战略观察与未来10年的思考 249
7.1.1 Web瘦服务器战略 249
7.1.2 云 253
7.1.3 计算能的思考 254
7.2 Web Storage 255
7.2.1 Web Storage的概念 255
7.2.2 localStorage介绍与示例 255
7.2.3 sessionStorage的介绍与示例 258
7.2.4 浏览器端存储的方案和局限性 260
7.3 离线应用 265
7.3.1 判断浏览器是否在线 266
7.3.2 离线应用的属性与方法 266
7.3.3 manifest文件 267
7.4 Web Worker 269
7.4.1 Worker 270
7.4.2 Shared Worker 273
7.4.3 Web Worker小结 275
7.5 一个云记事本的案例 276
7.5.1 客户端逻辑分析 276
7.5.2 客户端的实现 277
7.5.3 工程实现的联想 279
7.6 小结 279
附录A HTML5标签、事件属性及其
相关网站 281
附录B 审慎对待各种框架 287
附录C 统一开发常用交流术语 289
附录D WebGL 294
附录E CSS3模块列表 299