本书是关于Web样式设计的经典图书，涵盖大量实用的建议，旨在阐述如何制作好的设计和内容，提升网站的吸引力。本书第1章介绍网站设计的步骤；第2章介绍通用可靠性的概念、原则和流程；第3章介绍网站的信息架构；第4章讲述界面设计，以便实现更好的用户体验；第4章讨论网站的架构，用于优化网站的搜索引擎；第6章介绍页面结构；第7章讲解页面设计；第8章介绍版式设计；第9章描述编辑风格；第10章介绍表格及其应用；第11章讲述图形设计；第12章介绍实现多媒体的相关策略。
本书适合从事网站设计和开发的读者阅读。
本书由一个专门讨论网站设计的网站WebStyleGuide（http://webstyleguide.com）演变而来。经过十几年的发展，本书已经推出第3版，被誉为网站设计领域的典范，对互联网世界产生了深远的影响。
本书最初是专门为政府、企业（官方网站）、非营利组织以及学术机构的网站设计师们而写的，从信息架构学的角度总结了大量网站设计的方法和原理。经过3个版本的不断更新和完善，本书所涵盖的内容对几乎所有类型的网站的设计都具有普适性的指导意义，在Web设计领域广受推崇。
本书主要内容：
网站规划与设计的完整步骤，包括组建开发团队、初始规划、撰写文档、制定项目章程等内容，旨在让初学者对网站设计有一个宏观认识；
网站可用性设计的通用原则和方法；
从信息架构的角度来科学地规划网站的内容结构；
各种类型的网站的界面设计；
网站的页面结构规划和页面设计；
网站的版式设计，包括字体、易读性等方面的内容；
在网站设计中巧妙地使用表格、图形和多媒体元素；
……
这是你目前能找到的最简洁、最实用的网站设计指南。
—— Peteb Morville
信息架构协会联合创始人兼前总裁
网站设计师的必备手册。
—— J. D. Biersdorfer 《纽约时报》
这是一本以读者为中心的网站设计类图书，信息量大、精彩、生动。
—— Donald A. Norman 尼尔森诺曼集团
本书用平实的语言、易于理解的实例讲解了网站设计所需要掌握的知识，无论你是刚刚学习网站设计，还是打算构建公司内部的网站，抑或是重新改造某个已有的网站，本书都不失为一本绝佳的参考书。
—— Mary Creswell 知名演说家
作者简介
Patrick J. Lynch
资深网站设计专家，现担任耶鲁大学信息技术服务部的专业技术项目主管。他已在该校执教37年，由于在医学插图、出版发行及软件设计方面的卓越贡献，共获得了30余个国内外奖项。在2005年度“Pirelli国际奖”的评选中，曾获“最佳多媒体教学网站及最佳高等教育网站”奖。也曾在1992年获得“健康科学交流协会”所颁发的最佳展示奖，并在“国际INVISION多媒体奖”的评选中包揽了金牌、银牌及卓越表现奖。
Sarah Horton
资深网站设计专家和用户体验专家，专注于网站用户体验的研究，经验十分丰富。曾在达特茅斯学院担任“网络战略、设计与基础设施”部门主管，她对学院网站的建设给予了全方位的战略指导。她在网站设计领域获得了非常多的成就，撰写了多本专著，她所著的《Web Teaching Guide》获得了2000年度美国出版商协会所颁发的最佳计算机类图书奖，《Access by Design: A Guide to Universal Usability for Web Designers》也获得了读者的广泛认可。她还为包括《纽约时报》、《Boxes and Arrows》、《Digital Web Magazine》及《Web Design Reference Guide》在内的多家刊物撰写无障碍网络访问及网络易用性方面的文章。她经常在国际跨学科无障碍网络访问研讨会（W4A）、WebVision、World Usability Day（世界可用性日）、Academic Impressions以及人机交互实验室年会等各种学术及研讨会上发表有关网页通用性的演讲。
计算机\Web设计
本书由一个专门讨论网站设计的网站WebStyleGuide（http://webstyleguide.com）演变而来，经过十几年的发展，本书已经推出第三版，被誉为网站设计领域的典范，有着深远的影响。
本书最初是专门为政府、企业（官方网站）、非盈利组织以及学术机构的网站设计师们而写的，从信息架构学的角度总结了大量网站设计的方法和原理。经过3个版本的不断更新和完善，本书所涵盖的内容对几乎所有类型的网站的设计具有普适性的指导意义，在Web设计领域广受推崇。
本书主要内容：
网站规划与设计的完整步骤，包括组建开发团队、初始规划、撰写文档、制定项目章程等内容，旨在让初学者对网站设计有一个宏观认识；
网站可用性设计的通用原则和方法；
从信息架构的角度来科学地规划网站的内容结构；
各种类型的网站的界面设计；
网站的页面结构规划和页面设计；
网站的版式设计，包括字体、易读性等方面的内容；
在网站设计中巧妙地使用表格、图形和多媒体元素；
很久以前，有一头名叫威伯的猪。什么？你是希望看到有关设计的方法或者是网络方面的介绍，还是更喜欢通过比喻这样一种修辞，一种形象却真实的方式来指明与William Strunk和E. B. White所撰写的《The Elements of Style》之间的渊源呢？
真的，本书包含了样式。它涵盖了从CSS和排版到HTML以及散文结构在内的所有元素。但是，如果我们将视野过窄地锁定在连词和逗号上，我们或许会看不到构图本身。
所以还是让我们再回头来看看这个成为了“某头猪”的小矮个儿，这可都归因于《Charlotte抯 Web》（夏洛特的网）里面的描写。威伯和他的蜘蛛伙伴夏洛特，感动了所有的读者，无论老少年幼，让我们从中明白了忠诚和友谊。
本书以类似的方式，向看似不同的读者传递价值和意义，从那些可能会成为网站管理员的神童到头发斑白、经验丰富且一直在从事信息组织的信息架构师。
对初学者而言，本书用简洁易懂的语言讲述了界面设计、信息架构以及可用性方面的基础知识。你会发现它是一本最清晰、最实用的有关网站设计的指南。
专家们将对本书有不同的见解。在这样一个专业化的时代，我们往往会陷入千篇一律之中。本书再次邀请我们从全局出发，从相关学科和实践社区中学习最新的技巧。
但是，本书并非仅是一本手册。它不仅讲述了我们要做什么，而且说明了其中的原因。Patrick Lynch和Sarah Horton鼓励我们努力争取通用可用性。由于并非每个人都可以欣赏到漂亮的图像和印刷品的版式，因此两位作者将在线免费共享本书的英文版，他们真正地践行了这一承诺。
别忘了，去关注一下那些位于设计核心地带的人们。我们在帮助别人的同时也会提升自己。正如夏洛特在她的故事结尾向威伯解释的那样：“我是因为喜欢你才为你织网的。”这不也是我们所要说的吗？
—Peter Morville
信息架构协会（Information Architecture Institute）
联合创始人兼前总裁
第3版序言
我们取得了很大的进展—本书和万维网。本书的最初版本是一个在1993年发布的名为Yale c/aim Web Style Guide的网站。那时，除计算和学术界之外的世界也开始普遍意识到这一新的媒介和互联网。早期的网站严重缺乏美感，不过潜力巨大。本书以数十年积累的印刷、超媒体以及多媒体设计和著作方面的经验为基础，为人们提供了结构和设计方面急需的指导。
1997年，我们对本书进行了更新，以反映日渐成熟的设计趋势和Web技术的变化。小说在网页中开辟了新天地，这好比大海中升起的新大陆，等待着开发者和建设者的到来。来自艺术界、出版界以及计算学科的人们大量涌入，为Web增色不少，在他们引入数个世纪积累的媒体及设计文化财富的同时，各种可能存在的界限也浮出了水面。Web发生了改变以适应这些新的定居者，他们对Web环境能够实现的效果的期望往往超过了Web自身的能力。这个时期是视觉设计和界面精致方面取得巨大进展的一个时期，不过是以标准化和可访问性为代价的。
1999年，我们有了本书的第一个印刷版本。随着越来越多的组织开始选择网页作为他们的主要沟通方式，“Web Style Guide”网站赢得了众多的追随者。那些对设计知之甚少甚至一无所知的人们开始承担起了网站开发的义务，他们希望从本书中寻求平和、可靠和实用的指导。对很多人来说，言简意赅的本书非常受欢迎，它将人们从那些摆放在书店书架上那些难懂、亢奋、冗长的关于网页设计系列的书中解脱了出来。
自从1993年以一个网站发迹到它的第3版以来，本书提出了基于经典设计原则的可靠设计建议，在尽量避免让媒体酷炫的功能压倒“崇尚良好感觉、以信息为目标的”审美的同时，它也认可了当前Web技术的可能性和限制。由于HTML和CSS方面取得的大量进步，以及构建网站的“Web标准”哲学的出现，本书第3版并没有包含关于跨平台方面的内容以及关于制作残障人可访问网站的特殊技巧。基于现有的Web技术，我们最终得以集中精力于制作好的设计和内容，我们知道，我们手头有能够将Web制作为更友好、更高效以及更富有成效的阅读和工作场所的工具。
在本书第3版中，在万维网的第19个年头里，我们为我们所取得的进步以及我们在提升Web的可访问性以及适用性方面能够实现的程度感到欣喜。
除了所有那些为本书前两版做出过贡献的人以及我们在之前的序言中感谢的人，我们还要感谢Jean Thomson Black、Laura Jones Dooley、Matthew Laird、Christina Coffin、James Johnson以及耶鲁大学出版社的Aldo Cupo为本书付出的辛勤劳动。我们尤其感谢Peter Morville所写的序言。
我还要衷心感谢我的朋友们以及我在耶鲁大学的同事们在这些年间所给予我的支持—如果没有他们，我无法实现这一切：David Bolinsky、Roger Despres、Frank Gallo、Carmine Granucci、Sean Jackson、Carl Jaffe、Janet Jeddry、Chris Kielt、Jane Livingston、Philip Long、Andy Newman、Kimberly Pasko、John Paton、Noble Proctor、Stacy Ruwe、Phillip Simon、Virginia Simon以及Victor Velt。我要特别感谢Carl Jaffe二十多年间慷慨的友谊以及明智的忠告。Carl的很多智慧以及见地都在本书中有所体现。此外，我还要感谢本书的另一位作者Sarah Horton，同时也是我亲爱的朋友，感谢她为本书持久的付出，以及她在普及Web的适用方面所做的努力。
如果没有家人，所有这一切将毫无意义。我要感谢我所认识的最明智的女性Susan Grajek，感谢她坚贞不渝的爱、支持以及慷慨的鼓舞。因为有了他们的爱、支持以及大量的建议，这些人对网络所知道的东西远远要超过了我：Devorah Lynch、Alex Wack以及Tyler Wack。
—Patrick J.Lynch
首先也是最重要的，我要感谢我的合作作者，Patrick Lynch。我感激Pat在我整个职业生涯中所给予我无穷尽的支持以及对我的信任。他是一位让人吃惊的导师，一位鼓舞人心的艺术家，同时也是最好的朋友。如果Pat以及其他那些当时就职于耶鲁大学的先进教学媒体中心的伟大、才华横溢的人（尤其是Carl Jaffe和Phillip Simon）不接受我，我可能就走不到今天。
达特茅斯学院为我提供了环境以及鼓励，以实践以及改善本书中的方法和技巧。我非常感谢我的朋友、学院以及导师给予我的支持和启发：Rick Adams、Malcolm Brown、Dave Bucciero、Sheila Culbert、Joe Doucet、Alan German、Karen Gocsik、Martin Grant、Tim Hozier、Brian Hughes、Ellen Kanner、Barbara Knauff、Joe Mehling、Rita Murdoch、Mike Murray、Mark O’Neil、Marie Stebbins、Ellen Waite-Franzen以及Susan Warner。
最后，我要把我最真挚的感谢送给两个小伙子：Malcolm，感谢他一直以来让家中温情四溢；Nico，感谢他为温暖的亲情锦上添花。
—Sarah Horton
（美）Patrick J. Lynch Sarah Horton 著：暂无简介
李静 等译：暂无简介
在如今浩瀚的网络世界中，创建一个优秀的网站并非是一件简单的事，不但要“未雨绸缪”、“为善其事而先利其器”，还得要“兼顾各类访问者的需求”，优化搜索提升排名。所有的这一切千头万绪，如果不经过细心的规划，那么之后的每一次调整都有可能牵一发而动全身。因此，必须妥善地规划网站，投入想法、激情和创造力，慎重地收集网站发起人、设计人员、编辑人员以及程序人员的建议，征集网站用户的意见。
基于此，本书详细地列举了要在设计过程中注意的关键步骤以及需要规避的错误，在设计网站的过程中若能认真地考虑这些问题即可达到理想的设计成效。此外，要想让更多的人访问网站，还得要综合考虑图像和视频的搜索性、优化关键字搜索、借助各种推广方式来让更多的人了解网站的存在、根据网站的性质有组织地更新内容。
本书是一本关于网站设计的长销书和畅销书，为很多业内人士所认可，从事该书的翻译是一件荣幸的事。虽然该书的每个版本折射的均是当期的网页设计风格和趋势，但是它的平实、言简意赅以及对经典设计原则的认可始终没有改变过。在第3版中，全书依旧秉承了前两个版本的实用性原则，并在此基础上提出了基于经典设计原则的可靠技术建议，强调了网页的实用性、可访问性原则，所有的这一切都体现在本书的每一个章节中。
参与本书翻译的还有贺倩、李凌燕、任韦潼、梁晓琴、陈平锋、王晓燕、吴启文、马睿倩、罗棋文、幸慧、陈爱萍等，感谢他们。
李 静
译者序
序言
第3版序言
第1章 步骤 ·1
1.1 网站开发团队 1
1.2 初始规划 8
1.3 网站和文档的类型 11
1.3.1 静态与动态网页 11
1.3.2 Web内容管理 12
1.3.3 Web工具的演化 15
1.3.4 平衡基于Web的服务 17
1.4 网站开发过程 18
1.4.1 网站定义和规划 18
1.4.2 信息架构 22
1.4.3 网站设计 22
1.4.4 网站建设 24
1.4.5 网站营销 26
1.4.6 跟踪、评估和维护 27
1.5 制订项目章程 29
1.6 运行Web项目的常用设备 34
第2章 通用可用性 36
2.1 通用可用性的基础知识 36
2.1.1 可访问性 36
2.1.2 可用性及以用户为中心的设计 37
2.1.3 通用设计 37
2.2 通用可用性指南 37
2.2.1 超越“典型”用户 38
2.2.2 支持适应性 38
2.3 设计进程中的通用可用性 41
2.3.1 用户调研 44
2.3.2 设计和评估 46
第3章 信息架构 50
3.1 组织信息 50
3.1.1 内容目录 51
3.1.2 分块信息 54
3.2 网站结构 55
3.2.1 网站的浏览功能 55
3.2.2 使用网站搜索来导航 56
3.2.3 网站结构主题 57
3.3 展示信息架构 61
3.3.1 网站图表 61
3.3.2 线框图 63
第4章 界面设计 68
4.1 导航和路径搜索 68
4.1.1 路径：带路 70
4.1.2 区域与边界：矛盾的一致性 70
4.1.3 节点：本地咖啡馆还是泰晤士广场 70
4.1.4 地标：“你在这里” 71
4.1.5 小结：网站中的路径搜索原则 71
4.1.6 浏览与搜索 71
4.1.7 定位 72
4.1.8 支持Web搜索用户 72
4.2 界面设计 74
4.2.1 清晰的导航帮助 75
4.2.2 没有尽头的页面 75
4.2.3 直接访问 76
4.2.4 单一性及一致性 76
4.2.5 设计完整性和稳定性 78
4.2.6 反馈及对话 79
4.2.7 宽带与交互 79
4.2.8 界面设计惯例 80
4.3 信息设计 82
4.3.1 独立页面 83
4.3.2 总结：信息设计指南 84
4.4 企业界面 85
第5章 网站结构 87
5.1 语义内容标注 87
5.1.1 HTML文档结构 88
5.1.2 注意浏览器的不同 91
5.1.3 关于语义标注的小结 91
5.2 网站文件结构 91
5.2.1 隐蔽的网站语义 92
5.2.2 命名惯例 92
5.2.3 高效可维护的结构 94
5.2.4 HTML内容窗口的语义结构 97
5.3 搜索引擎优化 98
5.3.1 Web搜索的长尾 99
5.3.2 基本的搜索引擎原则 99
5.3.3 针对搜索优化页面 102
第6章 页面结构 108
6.1 结合环境进行网站设计 108
6.1.1 万维网 109
6.1.2 企业Web标识 109
6.2 页面结构和网站设计 109
6.2.1 页眉 109
6.2.2 浏览栏 112
6.2.3 内容区域 113
6.3 页面模板 115
6.3.1 内部页面模板 115
6.3.2 次页模板 116
6.3.3 主页 117
第7章 页面设计 124
7.1 文档设计 124
7.1.1 适应性设计 125
7.1.2 文档顺序 126
7.1.3 选择性显示 127
7.1.4 文本替代物 128
7.1.5 了解媒介 128
7.2 视觉设计 129
7.2.1 一致性 132
7.2.2 对比 132
7.2.3 空白区域 135
7.2.4 样式 136
7.2.5 简单 136
7.2.6 视觉设计的Gestalt原则 137
7.3 页面框架 137
7.3.1 固定页面宽度 138
7.3.2 灵活页面宽度 139
7.4 页面宽度和行长 140
7.4.1 页面长度 141
7.4.2 页眉和页脚 143
7.4.3 网页的垂直分层 144
7.5 网页的设计网格 146
第8章 版式 150
8.1 Web字体特色 150
8.1.1 动态构建 151
8.1.2 内容结构及视觉逻辑 151
8.1.3 层叠样式表 151
8.1.4 一致性 154
8.2 易读性 155
8.2.1 对齐与空白 155
8.2.2 对齐选项 156
8.2.3 行长 157
8.2.4 字体颜色 158
8.3 字体 159
8.3.1 选择字体 160
8.3.2 字号 162
8.4 强调 164
8.5 图文效果 167
第9章 编辑风格 169
9.1 构建散文 169
9.1.1 网站结构 170
9.1.2 页面结构 170
9.2 在线样式 173
9.2.1 对比和强调 173
9.2.2 散文风格 174
9.2.3 其他风格 174
9.2.4 关键字 175
9.2.5 标题和子标题 177
9.2.6 页面标题 177
9.3 Web文档的文本格式 178
9.4 链接 179
9.4.1 说明性链接 180
9.4.2 链接下划线 180
9.4.3 已访问和未访问的链接 180
第10章 表格及应用 182
10.1 交互支持技术 182
10.1.1 Ajax 184
10.1.2 可访问性 185
10.2 设计Web应用程序 185
10.2.1 约束与简明 185
10.2.2 设计模式 186
10.2.3 控件 186
10.2.4 交互引导 188
10.2.5 响应错误 191
10.3 设计进程 194
10.3.1 线框图 194
10.3.2 原型 194
第11章 图形 196
11.1 网络图形的角色 196
11.2 充当内容的图形 197
11.2.1 插画 198
11.2.2 解释概念以及清晰显示数据 198
11.2.3 综合的视觉展示 198
11.2.4 网络中的图形交流 200
11.3 Web图形的特点 200
11.3.1 彩色显示 200
11.3.2 屏幕分辨率 201
11.3.3 伽玛值 201
11.3.4 图形和带宽 202
11.4 图形文件格式 202
11.4.1 GIF图形 203
11.4.2 GIF文件压缩 203
11.4.3 抖动 203
11.4.4 改善GIF压缩 204
11.4.5 隔行显示的GIF 204
11.4.6 透明的GIF 205
11.4.7 JPEG图形 205
11.4.8 PNG图形 207
11.5 成像策略 207
11.5.1 界面元素 207
11.5.2 将照片另存为GIF格式 207
11.5.3 将照片另存为JPEG格式 208
11.5.4 将示意图和插画另存为矢量图形 208
11.5.5 对Web网站的图形归档 209
11.5.6 总结：文件格式 209
11.6 屏幕上的图像 210
11.6.1 屏幕显示与打印彩色艺术作品的对比 210
11.6.2 复杂的插画或者照片 211
11.6.3 用于计算机屏幕显示的示意图 212
11.6.4 图形文字 214
11.6.5 使用大图 214
11.6.6 隐藏图形 215
11.7 图形标注 215
11.7.1 高度和宽度标签 215
11.7.2 替代性文字 216
11.7.3 彩色背景 217
11.7.4 背景图形 220
第12章 多媒体 222
12.1 对多媒体的一些考虑 222
12.2 网络多媒体策略 223
12.2.1 音频 223
12.2.2 幻灯片 224
12.2.3 视频 224
12.2.4 动画 225
12.2.5 文本替代物 225
12.3 多媒体准备 226
12.3.1 加工 226
12.3.2 传输 227
12.4 设计和多媒体 228
12.4.1 通知用户 228
12.4.2 提供控件 229
12.4.3 支持键盘交互 230
12.4.4 提供选择 230
附录A 缩写词 232
附录B 参考文献 234
