写给大家看的Web设计书

　　《写给大家看的Web设计书(第3版)》的内容组织遵循一个主流网站设计项目的基本流程。第一部分首先介绍涉及的团队角色，以及你将会用到的开发流程。第二部分介绍了网页设计的第一步，了解你的用户并制作站点的结构图。在第三部分，你可以学到一些视觉设计的策略，以及如何为网站准备可用的图像。第四部分涵盖了完成开发流程所需要掌握的核心技术。最后，第五部分将所有内容概括成了简单的参考指南。
　　《写给大家看的Web设计书(第3版)》适合IT及互联网领域的项目经理、产品经理及设计师阅读，也可为有志于进入该领域的人员提供参考。

丽莎.洛普克（Lisa Lopuck）是一位有着超过20年行业经验的数字创意执行代表，毕业于加州大学洛杉矶分校。曾担任Monster Energy公司副总裁。在她的领导下，Monster公司的Facebook品牌主页仅花了一年半的时间，就使粉丝数从50万增长到1200万。她还为迪士尼设计了一些电商网站，包括DisneyShopping.com、HongKongDisneyland.com等。

目　录

第一部分　初识网站设计　1

第1章　当你开始设计一个网站　3
涉及的角色　3
商务人员和客户　4
产品经理和项目经理　4
信息架构师　5
视觉设计师　7
内容编辑　9
媒体专家　9
前端开发人员　10
程序员　10
准备开始　11
积累经验　11

第2章　从概念到执行　13
第1阶段：定义　13
理解网站目标　14
收集业务需求　15
制作一份RFP　15
构建项目计划　16
第2阶段：设计　16
创建站点地图　17
制作线框图　18
用户测试　19
整合内容计划　19
构建“风格”　19
从焦点人群中获取建议　20
第3阶段：开发　21
开发模型　21
内容开发　21
媒体开发　22
使用HTML和CSS构建表现层　23
后端(Backend)开发　24
第4阶段：部署　26
质量保证　26
发布日　28
第5阶段：维护　28

第二部分　用户友好的设计　31

第3章　针对正确的人群设计正确的网站　33
用户是谁　34
给客户的问题清单　34
角色视角　35
用户场景　36
为你的网站构造框架　36
平衡业务需求和用户需求　36
分类和优化信息　36
在优先级的基础上建立导航集　38
创建站点地图　40
连线的艺术　42
创建你自己的符号集　44
齐心协力　46
正式页面索引　46
为重新设计的网站构建站点地图　47
解构一个网站　47
完成站点地图　48
制作市场推广计划　49
线下推广　49
线上推广　49

第4章　组织及导航页面内容　55
页面层规划　56
规划内容板块　56
线框图　57
在页面中展示内容　59
在线框图中标注文字　59
使用内容管理系统　60
最大限度地利用空间　60
为线框图编写注释　63
了解样式　65
全局导航　65
板块导航　65
留下一串面包屑　68
结合导航技术　69
使用图形主题而不是借喻　70

第5章　网站用户界面设计　73
交互设计　73
创建用户流程图　74
顺其自然　75
视觉设计对可用性的影响　77
提供悬停反馈　79
设计外观可交互的按钮　79
从日常生活中获取线索　80
元素的聚合与嵌套　81
提供“你在这里”的反馈　82
被高估的颜色编码　82
可点击与不可点击的差异　85
一致性就是一切　85
空间最大化　87

第6章　用户测试：不需要穿白大褂　91
构建可供测试的原型　92
创建可点击的线框图　92
测试视觉设计　93
为可用性测试创建可跳转的HTML流程　95
为用户测试做准备　98
为用户准备任务清单　98
设计一套测试方法　101
展开用户测试　102
寻找小白鼠　102
引导测试过程　104
“休斯顿，我们遇到一个问题……”：评估结果　105

第三部分　设计网站图形　109

第7章　网页图形设计　111
制作可视化界面　111
开发页面模板　112
创建页面模型　114
配色、类型和图像　115
使用网格系统　119
设定视觉优先级　121
实施“大、中、小”策略　122
将页面分为可管理的区域　123
围绕折线做设计　124
添加留白　125
建立一份设计样式规范　127
图形样式规范　127
按钮样式　127
字体样式　128

第8章　字体完美型设计　131
易于阅读的文字　132
选择适合场景的字体　134
不要过大或过小　139
控制文本显示　140
图片文本与HTML文本　140
本地化语言　140
字体规范　140
字体后备方案　141
使用CSS　143
外部样式表　143
内部样式表　146

第9章　理解网页颜色、分辨率和文件格式　149
RGB世界的秘密　150
颜色削减和颜色叠加　150
大量的颜色　150
颜色位深　152
受限的调色板　152
24比特色深图像　154
显示屏色深　154
十六进制颜色码　156
图像和显示屏分辨率　157
显示屏分辨率　158
图像分辨率　158
位图图像和矢量图像　159
位图图像：组织像素　159
矢量图像：擅长数学　160
矢量图像和位图图像大比拼　161
图像压缩和文件格式　163
GIF格式　163
JPEG格式　167
PNG格式　167
SVG格式　169
SWF格式　169

第10章　搭建网站模型　171
常用软件　172
Photoshop　172
Fireworks　172
Illustrator　174
Flash　174
Dreamweaver　175
情绪板：确定风格　176
设计资源　177
照片和插画库　177
数码摄影照片和扫描图像　178
版式设计　178
Photoshop笔刷　179
控件　180
Web设计模板　180
从头开始构建网页模板　180
网页背景图　183

第11章　启发灵感：网站设计理念　187
制定设计方向　187
从线框图开始　188
让多名设计师共同参与　188
收集设计意见　189
获取视觉和交互设计的灵感　191
电影式网站　191
创新交互设计　194
借鉴品牌体验　197
为你的网站设计移动版本　200
看待像素的新角度　200
简化导航　201
压缩文件大小　202
横向和纵向　203
使用单列布局　203

第12章　展示你的设计杰作　205
实现在线演示　206
在线演示设计方案　206
构建有功能和功能的原型　208
创建打印演示稿　208
高质量彩色打印　209
黏在展板上　210
进行展示　211
客户不是伯乐　212
继续战斗：第二轮　213

第四部分　开发完整的网站　215

第13章　构建表现层　217
HTML：将页面黏在一起的胶水　218
偷偷看一眼源代码　220
学习(借鉴)其他人　222
借助强有力的工具编辑HTML　222
HTML 5　224
移动设备友好的解决方案　224
动画的可选方案　225
触屏支持　225
地理位置　226
强大的内容处理　226
DHTML、JavaScript、jQuery和Ajax　227
CSS　228
CSS如何工作　228
颜色渐变、透明和反射　231
阴影效果　232
圆角效果　233
动画效果　234

第14章　平台选择、内容管理、数据分析和SEO　237
开发平台　238
内容管理　239
用户生成VS固定管理　241
连接网站和CMS　242
Web数据分析　242
Google Analytics　243
你可以从数据中获得
什么？　243
实时监控　246
用户都点击了哪里　246
付费服务　247
搜索引擎优化　247
页内和页外搜索　247
URL结构和文件名　251
去掉指向相同页面的
重复URL　251
准备供搜索的站点地图　252
更多的SEO策略　253
自然搜索和付费搜索　254
入站和出站链接　257

第15章　高级网站　259
扩展网站功能　260
连接Facebook　260
Twitter　263
Disqus　263
Google Maps　264
可供选择的海量API　265
电子商务网站　266
安全套接字层　267
支付入口　267
几点有关购物车的建议　268
使用Cookie实现个性化网页　271
浏览器和定位　272
IP和GPS定位　272
响应式设计　274
全球网站响应性能　276

第五部分　10项注意　279

第16章　管理网站设计项目的10个技巧　281
展示你的工作　282
整理一份作品集　282
展示你的工作成果　284
制作一份方案　285
赢得竞标　287
了解作为独立顾问如何收费　288
公司如何收费　289
掌控客户预期　290
指定客户在项目中的责任　290
在关键里程碑时获得客户签字　291
管理网站项目的工作流　291
雇用及管理分包商　292

第17章　信息和交互设计的10个技巧　295
仅使用5～7个主菜单　296
为每一个独特的页面布局绘制
线框图　297
标记出按钮和图标　297
注意下载时间　298
向用户提供“你在这里”的
反馈　298
回到首页很容易　299
从视觉上区分可点击与不可
点击的对象　300
其中有一个按钮不一样　301
谨慎对待真实世界的借喻　301
颜色分类省着用　302

第18章　容易出问题的10件事　305
“我们能再加一样东西吗？”　305
“没时间画站点地图了。”　307
“客户想要‘那种’设计？”　307
“都有我了，还要什么可用性测试？”　308
“我肯定会让这项技术正常工作的。”　308
“我们还有国际访客？”　309
“网站需要运行在移动平台上？”　311
“你是说现在我们需要维护这个网站了？”　312
“糟糕，我们忘了加数据分析。”　312
“只要我们做了，他们就会来的。”　313