本书以Web前端设计的流程为主线,以前端设计的方法和原则为基础,围绕原型设计、模型设计、可用性设计、一致性设计和以用户为中心的设计等关键技术探讨了前端设计的规范、技巧与最佳实践。同时对Web前端设计领域的经典设计思维进行了剖析,为读者提供了极具指导价值的思想和极具操作性的实践方法。此外,本书还讲解了前端性能的测试和度量方法,总结了大量前端性能优化技巧。
本书适合于经验还不够丰富的前端工作者(前端设计师、前端开发工程师、前端架构师和用户体验设计师),希望它能帮助大家从复杂、繁琐、无序的前端设计、开发和维护工作中解放出来,以良好的设计思维与架构方法为前端开发和设计保驾护航。
封面图
目录
- 赞誉
- 前言
- 致谢
- 第1章Web前端开发ABC/1
- 1.1Web大局观/2
- 1.1.1混沌初开—Web的诞生/2
- 1.1.2网络技术的领导者—W3C/4
- 1.1.3不断优化的客户端技术/7
- 1.1.4服务端技术的成熟/8
- 1.2地位、曲线和使命/11
- 1.2.1前端开发路漫漫/11
- 1.2.2千军易得,一将难求/12
- 1.2.3令人望而却步的学习曲线/14
- 1.2.4前端开发人员如何自身定位/16
- 1.3前端开发所需掌握的技术/17
- 1.4前端开发常用的工具/25
- 1.4.1设计类工具/25
- 1.4.2原型类工具/26
- 1.4.3调试类工具/27
- 1.4.4辅助类工具/32
- 1.5小结/33
- 第2章打造前端设计的基石—交出你的原型稿/34
- 2.1UCD—以用户为中心的设计原则/35
- 2.1.1关注用户/36
- 2.1.2用户调研/39
- 2.1.3更含蓄的方式/42
- 2.2交出第一份设计稿/46
- 2.2.1为什么原型设计很重要/47
- 2.2.2原型如何表现/48
- 2.2.3做好原型产品的注意事项/56
- 2.3让工具帮助你/57
- 2.3.1创建用户模型/58
- 2.3.2Balsamiq Mockups设计概念图/59
- 2.3.3Axure RP设计交互原型/60
- 2.3.4更真实的表现/66
- 2.4小结/71
- 第3章从过去到未来—前端设计演变之路/72
- 3.1最熟悉的陌生人/73
- 3.1.1浏览器之争/73
- 3.1.2性能对比/74
- 3.1.3IE PK Web 标准/77
- 3.2结构的变迁/83
- 3.2.1表格噩梦/83
- 3.2.2基于DIV和CSS的布局结构/86
- 3.3不单纯是脚本/90
- 3.3.1JavaScript的原貌/90
- 3.3.2华丽的进化/92
- 3.3.3Ajax不得不提/95
- 3.3.4脚本框架的出现/96
- 3.4接触未来(一)—初探HTML 5/101
- 3.4.1摘要/101
- 3.4.2结构/102
- 3.4.3Flash杀手Canvas?/105
- 3.4.4设计一个布局结构文档/107
- 3.4.5对表单的支持/109
- 3.5接触未来(二)—CSS 3的世界很精彩/110
- 3.5.1选择器的变化/113
- 3.5.2布局的变化/116
- 3.5.3样式的变化/119
- 3.5.4动画/120
- 3.6小结/121
- 第4章让你的设计深入人心—可用性设计/122
- 4.1可用性原则/123
- 4.1.1别让我思考/124
- 4.1.2停止你的假设/129
- 4.1.3针对扫描而设计/132
- 4.2高可用性页面/136
- 4.2.1导航之道/137
- 4.2.2当链接变成云/145
- 4.2.3设计可用的表单/147
- 4.2.4拒绝写作艺术/153
- 4.3可用性测试/156
- 4.3.1如何测试/157
- 4.3.2现象与本质/158
- 4.4巧妙地应对错误/159
- 4.4.1提前预防/162
- 4.4.2设计有用的信息/165
- 4.4.3人性化操作/169
- 4.5系统一致性设计/170
- 4.5.1规范设计/172
- 4.5.2有始有终/172
- 4.6小结/173
- 第5章原型模型化/174
- 5.1布局之道/175
- 5.1.1基本布局样式属性/176
- 5.1.2基于网格系统的CSS框架布局/179
- 5.1.3流体布局/183
- 5.2样式就是设计/185
- 5.2.1必须了解的样式技术/185
- 5.2.2使用样式完成所有事情/191
- 5.3动态交互之美/207
- 5.3.1JavaScript设计新思维/207
- 5.3.2jQuery是最佳实践/214
- 5.3.3一个关于Tab导航的交互例子/223
- 5.4设计理念的碰撞与融合/226
- 5.4.1PNG透明色应用/226
- 5.4.2大菜单/228
- 5.4.3Tab选项卡/230
- 5.4.4模态窗口/232
- 5.4.5unobtrusive的Web开发/234
- 5.5小结/237
- 第6章探索、品味、总结—经典设计思维/239
- 6.1平衡网站的色彩/240
- 6.1.1色彩的联想/240
- 6.1.2色彩三要素/247
- 6.1.3流行配色/249
- 6.2简洁的思想斗争/254
- 6.2.1有效利用空白/255
- 6.2.2是时候“减肥”了/256
- 6.2.3简洁的背后/260
- 6.3排版艺术/262
- 6.3.1充分了解你要使用的字体/263
- 6.3.2其他重要排版要素/267
- 6.480%的情况下我们可以这样做/270
- 6.4.1轻松导航/270
- 6.4.2便捷检索/273
- 6.4.3快速选择/278
- 6.4.4有效帮助/280
- 6.5小结/282
- 第7章让你的设计更加完美—优化技巧和最佳实践/283
- 7.1性能在前端的重要性/284
- 7.2前端性能优化的基本原则/286
- 7.2.1页面内容的优化/286
- 7.2.2服务器的优化/299
- 7.3让自己更容易被发现/304
- 7.3.1SEO策略/304
- 7.3.2前端搜索引擎友好/310
- 7.3.3其他/311
- 7.3.4维护SEO效果/312
- 7.4小结/314
- 第8章思考与展望—浅谈Web发展的未来/315
- 8.1不可思议的Web 2.0/316
- 8.1.1Web 2.0是一场必然的革命/316
- 8.1.2Web 2.0的新生活/317
- 8.1.3云时代的脚步/322
- 8.2REST/323
- 8.2.1什么是REST/323
- 8.2.2REST初探/325
- 8.2.3Ajax和REST组合/330
- 8.3Mashup与Widget/333
- 8.3.1什么是Mashup/333
- 8.3.2Mashup实践/336
- 8.3.31+1>2/342
- 8.3.4Widget/343
- 8.4拥抱未来,拥抱Web 3.0/346
- 8.4.1Web3.0到底什么样/348
- 8.4.2语义网/350
- 8.4.3Web3.0先行者/353
- 8.5小结/362