由于移动设备的大量使用，各种萤幕尺寸、各种作业系统、各种访问设备及各种需求均对用户体验提出了新的挑战。为了让我们的网站在各个终端上的用户体验都儘可能接近完美，我们需要採用回响式移动设计。《回响式设计、改造与最佳化》重点介绍了Phil Dutson的开发经验，主要是关于移动设备及其设计，甚至一点点代码就可以帮助你以最好的方式为数百万手机用户提供内容；同时，顺便简单地介绍了一些主题，以解决常见的回响式移动设计中可能会遇到的问题。

由于移动设备的大量使用，各种萤幕尺寸、各种作业系统、各种访问设备及各种需求均对用户体验提出了新的挑战。为了让我们的网站在各个终端上的用户体验都儘可能接近完美，我们需要採用回响式移动设计。《回响式设计、改造与最佳化》重点介绍了Phil Dutson的开发经验，主要是关于移动设备及其设计，甚至一点点代码就可以帮助你以最好的方式为数百万手机用户提供内容；同时，顺便简单地介绍了一些主题，以解决常见的回响式移动设计中可能会遇到的问题。

Phil Dutson 是ICON Health & Fitness 客户端和移动执行解决方案的架构师。他是Sams Teach Yourself jQuery Mobile in 24 Hours、jQuery, jQuery UI, and jQueryMobile Recipes and Examples、The Android Developer’s Cookbook，2nd Edition 的作者。他热爱技术的学习和写作，每次他与儿子玩Ingress 时都向世界传播启蒙讯息。

第 1部分　创建回响式部局

第 1章　内容事项. .................................. 2

构成内容的要素. ......................................3

信息採集.........................................3

信息确认.........................................5

选择合适的内容. ......................................7

内容性能.........................................7

搜寻引擎最佳化考量..........................10

用户期望.......................................11

讨论内容滑块. .......................................12

小结. .......14

第 2章　为什幺移动优先....................... 15

浏览 Web. ............................................16

从小尺寸开始时的注意事项. ....................19

网站主题.......................................20

网站导航.......................................22

行销图像.......................................24

网站搜寻.......................................25

小结. .......27

第 3章　使用栅格................................ 28

选择栅格. ..................29

Pure.Grids...................................30

Bootstrap.....................................30

Foundation..................................31

Gridpak........................................31

Golden.Grid.System.....................32

Skeleton......................................32

使用回响式栅格. ....................................32

使用自适应栅格. ....................................36

两全其美...................38

小结. .......38

第 4章　显示表格数据.......................... 40

定义表格数据. .......................................41

联繫地址列表. ................................41

发票和收据....................................41

表单..................41

配方和卡片....................................42

电子邮件站点和套用.......................42

使用表格数据. .......................................42

显示錶单.......................................43

使用表格.......................................47

使用 CSS改变外观. .......................47

创建多个表格. ................................50

使用下载连结. ................................53

小结. .......56

第 5章　使用测量单位.......................... 57

使用像素. ..................58

使用百分比...........................................60

使用 em和 rem单位.............................63

viewport测量. ......................................65

小结. .......69

第 6章　使用媒体查询.......................... 70

viewport.meta标籤..............................71

实现突变点...........................................73

使用媒体查询. ................................74

IE6-8浏览器支持. .........................80

设备专属的媒体查询..............................80

iPad..................80

iPhone.4S以下. ............................81

iPhone.5和 5S.............................82

Nexus.7（第二代）.......................82

Galaxy.S4....................................83

小结. .......83

第 7章　排版设计................................ 84

Web字型. ............................................85

字型格式.......................................85

浏览器和设备支持.................................87

设备差异.......................................87

浏览器行为....................................89

提供 Web字型..............................91

使用字型服务. .......................................93

Google字型.................................93

Adobe.Typekit..............................94

Fonts.com...................................94

Font.Squirrel................................95

icon字型.............95

小结. .......96

第 8章　改造现有网站.......................... 97

选择一个合适的移动布局. .......................98

块级布局.......................................98

回响式布局..................................100

自适应布局..................................102

利用组件开展工作...............................103

导航...........................................103

搜寻...........................................105

内容区域.....................................105

滑块...........................................106

连结...........................................107

移动化的注意事项...............................108

不要滥用悬停. ..............................108

点击呼叫.....................................109

模态视窗.....................................109

输入框........................................111

小结. .....112

第 2部分　使用回响式媒体

第 9章　回响式图片............................114

图片应该是回响式的............................115

图片分发.....................................115

使用 JavaScript的解决方案. ................125

Picturefill组件.. ...........................126

Pixity组件..................................127

小结. .....129

第 10章　回响式视频. ......................... 130

使用视频............................................131

分发系统............................................131

Limelight.网路.............................132

Akamai......................................133

Brightcove.................................133

Vimeo........................................134

YouTube....................................135

製作适配移动设备的视频. .....................136

使用固定比例. ..............................137

使用本地播放器...........................140

使用外挂程式.....................................141

小结. .....142

第 11章　图像压缩............................. 143

图片类型............................................144

JPEG/JPG.................................144

GIF............................................146

PNG..........................................147

WebP........................................148

缩工具............................................150

JPEGmini...................................150

PNGGauntlet.............................151

图像最佳化工具 Radical..................151

ImageAlpha...............................151

ImageOptim...............................153

TinyPNG....................................153

压缩结果............................................154

小结. .....155

第 3部分　性能最佳化

第 12章　条件.JavaScript. ................ 158

为什幺使用条件 JavaScript. .................159

滑块...........................................160

图片库........................................160

使用条件 JavaScript...........................162

JavaScript媒体查询....................163

使用 JavaScript外挂程式..........................168

jRespond...................................168

mediaCheck...............................169

ConditionerJS............................169

小结. .....170

第 13章　Web组件............................ 171

使用 Web组件...................................172

Web组件示例....................................172

音频元素.....................................172

视频元素.....................................174

日期输入.....................................175

使用 DOM处理.. .................................176

Shadow.DOM............................177

使用模板.....................................178

编辑内容.....................................179

Web组件 Polyfill................................180

Polymer.....................................181

Polymer元素..............................181

X-Tag.......................................182

使用 Brick...................................183

小结. .....183

第 14章　设备检测与伺服器请求. .......... 185

设备检测............................................186

使用脚本检测. ..............................186

读取 user-agent字元串. ..............188

实现设备资料库...........................190

HTTP头部. ........................................191

使用客户端提示. ..................................194

小结. .....196

第 15章　伺服器最佳化. ..........................197

伺服器配置.........................................198

Web.伺服器.......................................198

Apache......................................198

Nginx.........................................199

IIS.199

Tomcat......................................200

NodeJS.....................................200

伺服器外挂程式.........................................201

SPDY........................................201

Cache........................................205

PageSpeed................................207

小结. .....210

第 16章　高性能与开发工具. ................. 211

开发工具............................................212

浏览器开发者工具...............................212

Chrome.开发者工具.. ...................212

Firefox.......................................218

Internet.Explorer........................223

构建工具............................................226

Grunt.........................................226

Gulp...........................................228

小结. .....229