移动Web实现指南 面向移动设备的网站优化、开发和设计PDF电子书下载

第1章 移动化用户体验设计 2

1.1 设备并没有移动，移动的是人 2

1.2 移动＝正在做 2

1.3 移动＝繁忙 3

1.4 移动＝分心 5

1.5 移动＝轻松 7

1.6 移动＝任务 10

1.7 与你的客户聊聊 11

1.8 撰写用户故事 12

1.9 将用户故事分解成设计需求 14

1.10 创建带有优先级的用户任务分解表 14

1.11 小结 19

第2章 移动化页面布局 22

2.1 标准化的页面布局已符合响应式了 24

2.2 是什么固定了宽度 25

2.3 使宽度不固定 26

2.4 拖曳方块 27

2.5 我们的网站 30

2.6 小结 42

项目访谈1 亚利桑那州立大学和MTV O Music Awards 44

第3章 移动化导航 56

3.1 表 58

3.1.1 尺寸 58

3.1.2 比例 59

3.1.3 设计 59

3.2 汽车界面 59

3.2.1 尺寸 60

3.2.2 位置 61

3.2.3 数量和复杂性 61

3.3 iOS应用程序界面 62

3.3.1 计算器 62

3.3.2 电话界面 63

3.3.3 iPod 64

3.4 那么现在……移动化导航设计 66

3.4.1 HTML 67

3.4.2 CSS 67

3.4.3 移动网页CSS 69

3.5 小结 72

第4章 移动化图片 74

4.1 图片移动化的整体分析 76

4.2 内联图片 76

4.2.1 有时候，移动化就意味着要变小 76

4.2.2 而有的时候，移动化却意味着变大 79

4.3 响应式图片栅格 83

4.4 小结 88

第5章 移动化文字 90

5.1 使用以用户为中心的方法来移动化文字 92

5.2 使用哪种单位：Point还是em 92

5.2.1 标题部分 93

5.2.2 正文：段落 95

5.2.3 正文：副标题 97

5.3 使用展示和隐藏 100

5.3.1 HTML 106

5.3.2 CSS 107

5.3.3 JavaScript 108

5.4 小结 111

项目访谈2 波士顿环球报 112

第6章 移动化表单 124

6.1 移动化可以提升网页表单的用户体验 126

6.2 Input类型 127

6.2.1 input type＝“text” 128

6.2.2 input type＝“email” 130

6.2.3 input type＝“url” 132

6.2.4 input type＝“tel” 133

6.2.5 Select 134

6.3 小结 138

第7章 移动化社交媒体 140

7.1 大部分社会化媒体可以提供“免费”的移动改造 142

7.2 Twitter 143

7.3 Facebook 145

7.4 Google＋ 147

7.5 Quora 149

7.6 LinkedIn＋ 151

7.7 YouTube 154

7.8 与社交化网站连接 156

7.9 小结 160

第8章 移动化内容策略 162

8.1 事先对移动环境的理解，会带来更好的内容策略 164

8.2 移动化设计为你做好可用性评估的准备 165

8.3 可用性评估是优秀内容策略的第一步 166

8.3.1 网站说了什么 167

8.3.2 网站是如何组织的 168

8.4 内容策略的制定为你的第一个移动化设计做好准备 168

8.4.1 从移动滞后转变为移动先行 169

8.4.2 任务清单和策略化的内容也要前置 169

8.5 小结 170

项目访谈3 洲际酒店集团网站 172

第9章 更多移动化改造的方法：JQuery Mobile 182

9.1 jQuery Mobile网页框架 184

9.2 jQuery Mobile的优点和不足 185

9.3 网页头部 186

9.4 主体区域和顶栏 187

9.5 导航 189

9.6 工具栏和按钮 192

9.7 模态对话框菜单 194

9.8 表单 197

9.9 横屏模式 198

9.10 小结 199

第10章 更多移动化方法：设备检测和PHP引用 202

10.1 什么是PHP 204

10.2 使用PHP 206

10.2.1 修改你的HTML文件 206

10.2.2 设置移动屏幕和完整屏幕按钮的CSS样式 210

10.2.3 添加PHP引用 213

10.2.4 设备探测 215

10.2.5 完整网站和移动版的PHP引用 217

10.2.6 一些特殊的CSS 219

10.3 小结 221

10.4 总结 221