x

添加收藏：我读过这本书

想读在读读过

标签(确定标签后请按回车):

当前位置： 查字典图书网> 交互设计> 写给程序员的Web设计书

写给程序员的Web设计书

写给程序员的Web设计书

作者： [美] 霍根
出版社：人民邮电出版社
原作名： Web Design for Developers: A Programmer's Guide to Design Tools and Techniques
译者：吴珂
出版年： 2011-8
页数： 248
定价： 59.00元
装帧：平装
ISBN： 9787115259110

评分

6.8

75人已评价

5星

12%
4星

36%
3星

41.3%
2星

9.3%
1星

1.3%

内容简介

《写给程序员的Web设计书》系统而深入地阐释了网站的设计与实现，帮助读者从开发人员的角度理解什么是设计。通读《写给程序员的Web设计书》之后，读者可以跨越纯视觉思考者和纯线性思考者之间的交流鸿沟。《写给程序员的Web设计书》的主要内容有：如何挑选配色，如何选择字体，如何用Photoshop实现基本设计，如何创作Banner等页面元素，如何制作HTML和CSS模板以及如何测试设计的兼容性和可访...

作者简介

Brian P. Hogan 是一名自由职业者和开发顾问。他从1995年就开始从事专业网站开发，使用ASP、PHP和Ruby开发过各种类型的网站和Web应用程序。他喜欢传授技术知识，撰写技术文章，尤其擅长网页设计和开发方面的技术

目录

第1 章引言1

1.1 说在前面的话1

1.2 网页设计实战2

1.2.1 明确要求2

1.2.2 Photoshop 时间 ...

更多>>

第1 章引言1

1.1 说在前面的话1

1.2 网页设计实战2

1.2.1 明确要求2

1.2.2 Photoshop 时间 3

1.2.3 代码时间 3

1.2.4 一切就绪3

1.2.5 现实不一定总是如此美好 4

1.3 YourFoodbox.com 4

1.4 准备好了吗　4

1.5 致谢 4

第一部分设计基础

第2 章网页（再）设计的基础——重新设计Foodbox 8

2.1 目前的网站 8

2.2 收集需求 11

2.3 明确目的 12

2.4 从哪里入手13

2.5 画出你的想法13

2.5.1 一些约定俗成的布局风格 15

2.5.2 三张草图15

2.6 挑选草图17

2.7 小结17

第3 章配色18

3.1 色彩基础18

3.1.1 色调、饱和度和亮度 18

3.1.2 加法混色和减法混色 19

3.2 色彩环境感知20

3.3 用颜色唤起情感 22

3.3.1 暖色 22

3.3.2 冷色22

3.3.3 中性色23

3.3.4 颜色和用户 24

3.4 配色方案 24

3.4.1 单色方案 25

3.4.2 相似色方案 26

3.4.3 互补色方案 27

3.4.4 分离互补色方案 28

3.5 网络安全色 29

3.6 创建配色方案30

3.6.1 用技术法选择颜色30

3.6.2 用自然选择法选择配色35

3.7 选择一个方案39

3.7.1 前景色和背景色 40

3.7.2 链接 40

3.8 小结 41

第4 章字体和排版42

4.1 深入字体42

4.2 字体类别 43

4.2.1 衬线字体43

4.2.2 无衬线字体 44

4.2.3 等宽字体44

4.3 字体限制及应对方法 45

4.3.1 网页安全字体45

4.3.2 图片替换 46

4.3.3 用字体栈来定义备用字体 46

4.3.4 选择备用字体 47

4.4 挑选字体 47

4.4.1 页面内容字体 48

4.4.2 标题字体 48

4.5 使用基线网格49

4.5.1 行距 50

4.5.2 计量单位 50

4.5.3 为Foodbox 选择字体 52

4.6 小结 53

第二部分图像设计

第5 章为Foodbox 设计Logo 56

5.1 建立工作目录 56

5.2 Foodbox 的Logo 57

5.3 当我们需要自己设计Logo 的时候怎么办60

5.4 小结 61

第6 章设计样式页：页面结构 62

6.1 关于图层 62

6.2 基本结构 63

6.2.1 屏幕大小64

6.2.2 定宽布局65

6.2.3 设置网格 65

6.2.4 用辅助线划定区域66

6.2.5 画出不同区域67

6.3 放置Logo67

6.4 用图层组组织图像 68

6.5 给Logo 加上倒影 68

6.6 页脚69

6.7 小结70

第7 章设计样式页：内容相关71

7.1 制作搜索框 71

7.2 餐谱导航标签云72

7.3 范围潜变 73

7.4 做一个美味的摘要 74

7.5 主要内容 76

7.6 浏览器模仿77

7.7 小结78

第8 章样式页上的按钮 79

8.1 制作搜索图标79

8.1.1 创建图标背景79

8.1.2 绘制放大镜 81

8.1.3 放置搜索图标82

8.2 创建注册和登录按钮 82

8.2.1 添加文字85

8.2.2 添加注册按钮85

8.3 文字内容来了 86

8.3.1 替换掉原来的乱码86

8.3.2 添加“最新菜谱”区86

8.4 小结87

第三部分建设网站

第9 章用HTML 做出主页 90

9.1 网页标准化91

9.2 首页的结构91

9.3 语义化的标签93

9.4 主页的框架 94

9.4.1 doctype94

9.4.2 html 标签97

9.4.3 属性 97

9.4.4 head 和body 标签 98

9.4.5 没有闭合标签的标签 98

9.4.6 页面标题 99

9.4.7 body 标签：重头戏100

9.5 页头102

9.6 侧边栏102

9.6.1 搜索表单103

9.6.2 菜谱标签云 104

9.6.3 食材标签云 106

9.7 主要内容108

9.7.1 意大利面图片 108

9.7.2 注册和登录按钮 109

9.7.3 最新菜谱区 110

9.8 页脚110

9.9 验证标签114

9.9.1 为网页开发设置Firefox 浏览器114

9.9.2 Web Developer 工具栏115

9.9.3 验证文档116

9.10 HTML 5116

9.11 小结　119

第10 章为样式页面添砖加瓦120

10.1 图像优化120

10.2 处理不同格式的图像121

10.2.1 GIF 121

10.2.2 PNG　122

10.2.3 JPEG　123

10.3 文档切片　124

10.4 创建切片　125

10.5 将Banner 导出成PNG 文件127

10.5.1 隐藏图层 127

10.5.2 保存切片 127

10.6 导出其他图片128

10.7 小结129

第11 章使用CSS 布局 130

11.1 浏览器招人厌130

11.2 CSS 基础131

11.2.1 选择符131

11.2.2 声明：属性和值 132

11.2.3 关于“层叠” 133

11.3 浏览器如何解析CSS 136

11.3.1 嵌入式　136

11.3.2 style 标签 137

11.3.3 外部CSS 文件 138

11.4 创建并链接新的CSS 样式表 138

11.5 定义基本结构、页头和页脚139

11.5.1 浏览器默认 139

11.5.2 盒模型141

11.5.3 将内容居中 141

11.5.4 定义页头和页脚 142

11.6 将页面的单栏变成双栏142

11.6.1 文档流143

11.6.2 浮动143

11.6.3 背景颜色和浮动 146

11.7 为内容加上外边距 148

11.8 主区域148

11.8.1 主区域文字 148

11.8.2 注册按钮区域 149

11.8.3 最新菜谱 150

11.9 回到页脚150

11.10 小结151

第12 章利用覆盖法替换各区域中的标题 152

12.1 什么是覆盖法152

12.2 为覆盖做准备，调整HTML 　152

12.3 覆盖文字 152

12.4 替换所有其他标题 153

12.5 替换链接154

12.6 这种方法的缺陷156

12.7 小结156

第13 章添加样式157

13.1 设置字体和颜色 157

13.1.1 风格手册的重要性 158

13.1.2 伪类 159

13.2 标签云160

13.3 搜索表单 160

13.4 页脚161

13.5 清理零散的角落161

13.5.1 去掉图片的边框 161

13.5.2 拉伸Banner 里的颜色162

13.6 小结 163

第14 章制作打印机友好的页面 164

14.1 准备工作164

14.2 链接打印用样式表 164

14.3 去掉不需要的元素 165

14.4 设置外边距、宽度和字体 165

14.4.1 页面外边距 166

14.4.2 选择一个字体 166

14.4.3 加上一个分隔符 167

14.5 搞定链接167

14.6 还要应付不习惯专有打印样式的用户168

14.7 小结 169

第四部分准备上线

第15 章让网页适应IE 和其他浏览器 172

15.1 确定要支持哪些浏览器 172

15.1.1 支持浏览器 172

15.1.2 只支持某些特性 173

15.2 关于浏览器的一些数据 173

15.3 Internet Explore：你无法逃避的恶魔174

15.4 IE7 175

15.4.1 IE 的诡异模式 176

15.4.2 XML 序言 176

15.4.3 在doctype 上方的注释 176

15.5 IE6 　176

15.5.1 修复不正常的地方 177

15.5.2 解决分栏的问题 178

15.5.3 修正透明问题 178

15.5.4 修复页头图片下面的空白 179

15.6 IE8 180

15.7 其他浏览器181

15.8 小结 183

第16 章可访问性和可用性 184

16.1 可访问性对你来说意味着什么 184

16.2 关于可访问性的基础问题 185

16.2.1 盲人 185

16.2.2 色盲用户 189

16.2.3 有视觉缺陷的人 191

16.2.4 有听力缺陷的用户 191

16.2.5 行动障碍和没有鼠标的用户 192

16.3 包容一切 192

16.3.1 导航193

16.3.2 处理出错信息 194

16.3.3 跨浏览器测试 194

16.4 重要的商业问题194

16.5 改进Foodbox 网站的可访问性 195

16.5.1 添加跳转链接 195

16.5.2 屏幕阅读器和display:none 196

16.5.3 用“负位置”隐藏跳转链接197

16.5.4 表单的标签 197

16.6 使用制表键198

16.7 可访问性清单200

16.8 小结 201

第17 章制作收藏夹图标 202

17.1 创建简单的图标 202

17.2 创建收藏夹图标 202

17.3 小结 203

第18 章搜索引擎优化204

18.1 内容为王 204

18.1.1 “欺骗”搜索引擎204

18.1.2 到底什么是内容 205

18.2 选择关键字 206

18.2.1 猜想他们是如何找到你的 206

18.2.2 决定你想如何被发现 206

18.2.3 看看竞争对手 206

18.2.4 添加关键字 207

18.3 完善页面内容 207

18.4 不要因为优化而忽略了用户208

18.5 你和链接208

18.6 到最后其实都是常识 208

18.7 小结 209

第19 章针对移动设备的设计210

19.1 移动用户 210

19.2 关于（很）小屏幕 211

19.3 JavaScript 212

19.4 提供移动版212

19.4.1 移动版样式表 212

19.4.2 用户代理探测 212

19.4.3 使用子域名 213

19.5 做决定──到底要支持什么平台213

19.5.1 在不产生重复内容的情况下制作一个镜像 214

19.5.2 调整内容 215

19.5.3 处理程序 216

19.5.4 进一步改进 218

19.6 为移动用户做重构 218

19.7 小结 219

第20 章测试与性能优化 220

20.1 优化性能的策略220

20.2 确定影响性能的因素 221

20.2.1 速度测试 221

20.2.2 YSlow 222

20.3 解决性能问题222

20.3.1 设置超时报头 222

20.3.2 用ETag 改进缓存 223

20.3.3 用资源服务器分发请求225

20.3.4 文件压缩 226

20.3.5 压缩脚本文件 226

20.4 图片优化 229

20.5 小结 230

第21 章后续工作231

21.1 其他页面和模板 231

21.2 高级模板 234

21.3 网格系统和CSS 框架 235

21.3.1 YUI 网格 235

21.3.2 960 网格系统236

21.3.3 框架不是万能的 238

21.4 替换CSS　 239

21.5 不要忘记为有版权的照片付钱 240

21.6 视觉效果 241

21.6.1 缩放图片 241

21.6.2 写代码241

21.6.3 把动画放到主页上 243

21.7 多试多做245

第22 章推荐阅读246

22.1 色彩资源 246

22.2 关于字体和排版的书246

22.3 技术书籍246

22.4 网站资源 247

参考书目249

<<收起

该书热门标签

设计 web开发互联网 WEB 计算机编程软件开发 Programming

评价“写给程序员的Web设计书”

想读在读读过

我想说两句

短评 (查看全部短评)

最新
热门

0 早樹 2013-02-04

很有细节，起码看了之后能试着做网页了
0 Fivemoons 2016-05-04

适合没有设计基础的人员
0 热气腾腾 2016-08-05

码农可以看看，虽然比上面那边写给大家看的设计书差点，但也还行
0 scarletsky 2013-03-16

有前端基础的基本不用看了...
0 Fain 2012-06-14

通过案例说明web设计开发的流程，通俗易懂
1 PinkMon 2014-09-28

最重要的一点是书里提到了web设计时应该考虑到不同人群的需要。蓝天白云之下人人生而平等～反正被感动了。
0 零距离 2013-02-28

写的非常好，强烈推荐！
0 Carrie0593 2014-11-15

讲得太浅，不过里面推荐的几个网站还挺有意思
0 6carol6 2012-08-16

知道了很多以前不知道的神奇的细节方面的东西吧~
0 thegofind 2012-06-02

2小时就看完了

1 PinkMon 2014-09-28

最重要的一点是书里提到了web设计时应该考虑到不同人群的需要。蓝天白云之下人人生而平等～反正被感动了。
1 子龙 2013-11-20

只适合新手读。有关于Photoshop切图的一些知识。读书笔记见 http://zilong-thu.github.io/blog/2013/11/19/reading-notes-on-book-web-design-for-developers/
0 早樹 2013-02-04

很有细节，起码看了之后能试着做网页了
0 Fivemoons 2016-05-04

适合没有设计基础的人员
0 热气腾腾 2016-08-05

码农可以看看，虽然比上面那边写给大家看的设计书差点，但也还行
0 scarletsky 2013-03-16

有前端基础的基本不用看了...
0 Fain 2012-06-14

通过案例说明web设计开发的流程，通俗易懂
0 零距离 2013-02-28

写的非常好，强烈推荐！
0 Carrie0593 2014-11-15

讲得太浅，不过里面推荐的几个网站还挺有意思
0 6carol6 2012-08-16

知道了很多以前不知道的神奇的细节方面的东西吧~

查看全部短评>>

我要写长评

书评 (查看全部书评)

最新
热门

无耻的第一个评论一下
0有用气定神闲 2011-09-07

我看的是英文版，感觉这本书还是很容易懂的，不过，你不要想在其中得到很浓度很高的设计知识，这本是没有的，可以说看完了PS软件之类，也就理解了5%不到。总之，想了解一下还是可以的，30几元的书架也不贵。不... 查看全部>>
几天前我还只会用table来布局
1有用大魔头 2011-09-28

作为一个长期做后台的老程序员，对页面设计的印象还停留在用dreamweaver画表格布局的时候。这本书对经常做网站的前台开发来说可能很浅很入门，对我来说却是受益匪浅。http://www.kaopua... 查看全部>>
推荐一下，我手上有一本，二手转让。
0有用 web开发专家 2011-12-26

专门讲色彩，布局还有ps部分的东西讲的还不错，特别适合入门级选手，希望下次改版能再丰富充实一下相关设计部分的内容，删除非设计领域的东西。我手上有一本，看完了，需要的同学联系我：pengwawa@gma... 查看全部>>
对我来说很有帮助
1有用 Treri 2012-10-05

p20三色原则,首先是两种互相补充的颜色,然后再需要一种完全不相干的颜色===一直都是胡乱配的,没想到还有这样一种配法,虽然不一定合理,但是对我来说很有帮助p43字体类别衬线字体(serif)无衬线字... 查看全部>>

几天前我还只会用table来布局
1有用大魔头 2011-09-28

作为一个长期做后台的老程序员，对页面设计的印象还停留在用dreamweaver画表格布局的时候。这本书对经常做网站的前台开发来说可能很浅很入门，对我来说却是受益匪浅。http://www.kaopua... 查看全部>>
对我来说很有帮助
1有用 Treri 2012-10-05

p20三色原则,首先是两种互相补充的颜色,然后再需要一种完全不相干的颜色===一直都是胡乱配的,没想到还有这样一种配法,虽然不一定合理,但是对我来说很有帮助p43字体类别衬线字体(serif)无衬线字... 查看全部>>
无耻的第一个评论一下
0有用气定神闲 2011-09-07

我看的是英文版，感觉这本书还是很容易懂的，不过，你不要想在其中得到很浓度很高的设计知识，这本是没有的，可以说看完了PS软件之类，也就理解了5%不到。总之，想了解一下还是可以的，30几元的书架也不贵。不... 查看全部>>
推荐一下，我手上有一本，二手转让。
0有用 web开发专家 2011-12-26

专门讲色彩，布局还有ps部分的东西讲的还不错，特别适合入门级选手，希望下次改版能再丰富充实一下相关设计部分的内容，删除非设计领域的东西。我手上有一本，看完了，需要的同学联系我：pengwawa@gma... 查看全部>>

查看全部书评>>

猜您喜欢读

: 用户体验及其在通

: 用户体验与可用性

: Actionab

: 移动设备交互设计

: 交互设计

: Processi

: JavaScri

: GUI设计禁忌

: 就这么简单

: 人本界面

: 设计未来

: A Projec

网友关注

: Into the

: Boston

: The Feel

: Plastic

: Healthy

: Fall...F

: Cage of

: The Cour

: The Poet

: The Role

: Bullmina

: Mirror o

: Spiritua

: Safe Hav

: Angels o

: Across T

: Thorga

: Jump Int

网友关注

: Into the

: Boston

: The Feel

: Plastic

: Healthy

: Fall...F

: Cage of

: The Cour

: The Poet

: The Role

: Bullmina

: Mirror o

: Spiritua

: Safe Hav

: Angels o

: Across T

: Thorga

: Jump Int

精品推荐

分类导航

相关分类

热评书籍

: 番茄工作法图解

: 万万没想到

: 谁动了我的奶酪?

: 杜拉拉升職記

: 时间的形状

: Rework

: 正在爆发的互联网革命

: 基业长青

: 大便書

: 史蒂夫·乔布斯传（修订版）

: 你的灯亮着吗?

: 世界因你不同

: 别做正常的傻瓜

: 黄金时代

: Brave New World