网页风格指南

目录部分[先把原文和译文写一起了，内容时会分开]

WEB STYLE GUIDE, 2nd edition

Front matter 前言
·Foreword by Lou Rosenfeld 序言-Lou Rosenfeld
·Preface to the second edition 第二版序言
· Preface to the first edition 第一版序言


Chapter 1: PROCESS 流程
·Before you begin 写在开始前
....Planning 制订计划
....Developing a site specification 制作详细的策划案

· The site development process 网站开发流程
....Site definition and planning 站点的定义与制订相应计划
....Information architecture 信息结构
....Site design 站点设计
....Site construction 站点结构
....Site marketing 站点的行销策略
....Tracking, evaluation, & maintenance 跟踪回访，评估与维护

·References 参考


Chapter 2: INTERFACE DESIGN 界面设计
·Web page design versus conventional document design 对比网页设计与传统文档设计
·Make your Web pages freestanding 确保页面元素的独立特点存在
·Basic interface design 初涉界面设计
....User-centered design 以浏览者使用为本的设计
....Accessibility 可用性

·Navigation 导航
·References 参考


Chapter 3: SITE DESIGN 站点设计
·Organizing information 信息的组织
...."Chunking" information 压缩信息长度

·Site structure 站点结构
....Basic information structures 基本信息结构
....Creating site diagrams 建立系统的站点计划与结构图表

·Site design themes 站点设计主题
....Training 培训站点
....Teaching 教育站点
....Continuing education 高等教育站点（继续教育话题？？？）
....Reference 提供信息参考和检索的站点
....Entertainment and magazine sites 娱乐与杂志相关的站点
....News sites 新闻站点
....E-commerce 电子商务网站

·Site elements 站点元素
....Home pages 主页
....Menus and subsites 菜单与子页面
....Resource lists, "other related sites" pages 资源列表与“其他相关站点”的页面
....Site guides 站点导航
...."What's new?" pages “最新信息”页面
....Search features 搜索的特性
....Contact information and user feedback 联系信息与浏览者的信息反馈
....Bibliographies and appendixes 提供参考信息列表和附录文件
....FAQ pages 常见问题页面
....Custom server error pages 常见的服务器端页面错误

·Internet versus intranet design 互联网设计与企业内网设计的对比
....Design standards 设计标准

·References 参考


Chapter 4: PAGE DESIGN 页面设计
·Visual hierarchy 视觉层次
·Consistency 连贯性
·Page dimensions 页面尺寸
·Page length 页面长度
·Design grids for Web pages 平面网格系统在网页设计的应用
·Page headers and footers 页面的头部与底部的设计
·Page layout 页面排版
....Layout tables 利用表格进行排版
....Fixed versus flexible 固定大小与者自适应大小的页面设计
....Other uses for tables 表格的其他用法

·Frames 框架
·General design considerations 设计中经常涉的问题
·Cross-platform issues 关于页面跨平台显示的问题
·Accessibility 可用性
·References 参考


Chapter 5: TYPOGRAPHY 排版
·Characteristics of type on the Web 网页上的字体
·Content structure and visual logic 文字内容的结构与视觉逻辑
....Cascading style sheets 样式表

·Legibility 易读性
....Alignment 对齐
....Line length 长度
....White space 留白
....Typefaces 字体
....Type size 字号
....Emphasis 重点

·Consistency 连续性
·Cross-platform issues 关于页面跨平台显示的问题
·Accessibility 易用性
·Type graphics 字体的图片化处理
·References 参考


Chapter 6: EDITORIAL STYLE 文字编辑的风格
·Organizing your prose 组织你文章
·Online style 适合在线阅读的文字风格
·Titles and subtitles 标题与子标题
·Links 连接
·References 参考


Chapter 7: GRAPHICS 图片
·Characteristics of Web graphics 网络图片的特点
....Color displays 颜色的显示问题
...."Browser-safe" colors 关于网页安全色
....Dithering 使用抖动图
....Screen resolution 显示器分辨率
....Gamma 关于Gamma的问题
....Graphics and network bandwidth 图片与网络带宽问题

·Graphic file formats 图片文件的格式
....GIF files gif格式
....JPEG graphics jpeg格式
....PNG graphics png格式
....Imaging strategies 图片使用的策略问题
....Summary: File formats 小节：文件格式

·Images on the screen 图片在屏幕上的显示问题
....The screen versus printed color artwork 显示器的颜色显示原理与印刷颜色显示原理的对比
....Complex illustrations or photographs 复杂的插图与照片
....Diagrams for the computer screen 像素图案在屏幕上的应用

·HTML and graphics html与图片
·Accessibility 易用性
·References 参考


Chapter 8: MULTIMEDIA 多媒体文件
·Applications for multimedia 多媒体文件的使用
·Web multimedia strategies 网络媒体的使用策略
....Audio only 只有声音文件
....Slide shows 滑动展示
....Video 视频文件
....Animation 动画

·Preparing multimedia 多媒体文件的准备
....Processing 处理
....Delivery 传送

·Design and multimedia 多媒体与设计
·Accessibility 易用性
·References 参考

第一章：流程
In the long run men hit only what they aim at.
— Henry David Thoreau

无论你去设计任何一种网站，设立一个明确的目标是你首先要做的东西。没有详细地制订任务和确立目标会造成整个项目偏离目标，停滞不前，或者错过适当的终点。仔细的规划和清晰的意图是建立成功网站的关键所在，如果你是团队作战，这点的重要性就更为突出。

THE FIRST STEP in designing any Web site is to define your goals. Without a clearly stated mission and objectives the project will drift, bog down, or continue past an appropriate endpoint. Careful planning and a clear purpose are the keys to success in building Web sites, particularly when you are working as part of a development team.



写在开始前

规划网站包括两个步骤：
1.召集全体开发人员，分析你们的需求和目标，通过大概描述开发进程来进一步细化提炼你计划内容。
2.建立一个详细的网站规划文档，详细描述你准备采取的方案和为何选取这种方案：你需要何种技术和内容；整个进程占用的时间；将要消耗何种东西（你会投入哪些东西）；还有就是如何去评估你的投入带来的收获。网站规划书对于建立成功网站来说是至关重要的，它既是你项目的蓝图，又是判断计划是否按设想进行和检测其实用性的试金石。

Before you begin

Planning a Web site is a two-part process: first you gather your development partners, analyze your needs and goals, and work through the development process outlined here to refine your plans. The second part is creating a site specification document that details what you intend to do and why, what technology and content you'll need, how long the process will take, what you will spend to do it, and how you will assess the results of your efforts. The site specification document is crucial to creating a successful site, as it is both the blueprint for your process and the touchstone you'll use to keep the project focused on your agreed goals and deliverables.



制订计划

网站的开发实际就是一部分人在满足另一部分需求的过程。不幸的是，网站项目经常被误解为是一种“技术问题”，而往往项目一开始就被渲染上了这种色彩，如对网络技术和浏览器插件（Flash, digital media, XML, databases, etc.）的狂热，要清楚这些并不是大众和商业所真实需要的东西。人是网站项目成功的关键所在。建立一个真正实用的网站你需要：内容组织方面的专家，作家，信息构建人，平面设计师，技术专家，制作人或者一个委员会主席来担负维持项目实施的职责。如果你的网站是成功的，站点将会很好的满足目标人群的使用，满足他们的需求和期望同时有很容易掌握它的使用。

虽然你的网站成功与否是决定于使用它的人群，但是具有讽刺意味的是，这些不同口味的受众几乎是不可能参与到你网站的设计和建立过程中的。牢记你的开发团队应该时刻保持积极的态势，并且永远终于最终用户的需求的。一些有经验的人可能会提出质疑：你说的漂亮，但是在你面对管理的压力，有限的预算，投资人的利益问题的时候，你真能按部就班的实施么？回答是肯定的，如果你希望你能建立一个成功的网站，那你就必须这么做！如果你只是一味听从管理者的摆布，没有和开发团队沟通整个开发进程，给假想的用户讲我们的计划是如何的适合他们，那你就等着失败吧。关心真实的用户，倾听他们的需求，并做出相应的反应，把你设计拿给他们试用，保持站点的易用性，这个项目将一定会获得成功。

1.什么是你的目标？
简短的明确两三条目标是你网站设计的基石。它主要包括：明确将要建立的网站会采取什么策略，站点设计、建立和评估周期要耗时多久；明确评估站点是否成功的质量和数量尺度。网站的建立是一个实时的过程，而不是一个能够一次规定出所有内容的具体完成时间的过程。后期的内容编辑管理和技术的支持都应该考虑到你网站的预算和生产计划中。没有建立这种观点，你的作品就会重演那些corporate communications initiatives的一幕（呵呵，翻不出来了，一会看原文吧），虎头蛇尾。

2.了解你的受众
下一步是甄别你网站潜在的用户，以此来确立你网站的结构，满足他们的需求和期望。你的客户可能是初次尝试上网的新手，他需要一个具有明确结构和说明引导的站点。你的客户也可能是一个久经沙场的老手，他会鄙视一切影响他们获取信息东西，这包括引导作用的东西和延误其搜索的东西。总之要你面对一坨有着不同知识背景、不同兴趣和需求的用户。一个设计出色的系统应该可以同时满足不同水平用户的需求。举例来说，如果你网站的目标是在企业内部发布信息，传递人力资源文档，或是以前在纸媒体出版过的东西，那么你的受众可能就会同时包括每天数次访问的用户，和只是偶尔访问的用户。

3.制造不同意见
项目中的每个团队成员都具有不同的信仰、喜好和技能。一旦团队人员达到对项目的任务和目标的某种认同后，需要确立一个多数人认同的实施方案。这个阶段的主要目标是在其他网站中甄别具有潜在成功特质的模型，并且从最终使用者的角度去考虑设计问题。
不幸的是，制作团队中罕有成员是网站的最终目标用户。除了参考已经存在的网站外，并没有更好的方式帮助经验不足的设计人员去实施这步计划。小组讨论通常是了解一个网站为何成功的好办法，因为团队里的每个人在浏览不同网站的时候是以最终用户身份出现的。让每个组员都带来一些他们喜欢的网站来讨论，让他们介绍这些网站，并说明每个设计的成功所在。通过这个方法，大家可以相互了解各自的设计态度，并且逐步确立出一个统一的感觉体验-也就是你的受众在浏览将来完成的网站时的感觉。

4.详细罗列站点内容
站点的任务和基本结构一旦产生，你就可以开始评估站点内容，你需要了解你的计划。建立一个详细的目录或者数据库，罗列出已经到手的内容和其他需要的内容，这样可以强迫你去浏览现有的资料，然后确定出哪些你需要的东西还没有到位。这样可以让你只去针对这些不足的部分，而不会把精力浪费在已经存在并可以使用的部分。建立明确的需求可以帮助你建立更加实际的时间安排和预算安排。较早的制订一个坚定的计划可以确保避免将来你得到一个架构良好但是没有内容的网站。

B.创建网站规划说明文档

在网站规划说明文档中定义了项目的核心目标，评估标准和主要意图,为后面的步骤提供指向性的参考。设计一个充实的网站是一件既耗费大量金钱同时又耗费大量时间的事情。在项目实施过程中，当你被每天接踵迩来的挑战牵着脖子走的时候，你会吃惊的发现自己经常会不清楚自己在做什么，为什么这样做，远离当初的目标，迷失方向，同时也不清楚自己每天花费时间做的工作是否符合整个项目的需求和目标。而一份书写规范的网站规划说明文档是一件非常好的日常工具，它可以用来衡量整个网站的开发效率。它就好比整个团队的罗盘，确保每步的开发进度都是服务于最终网站建立的意图。同样，它也会成为一件很好的参考工具，用来衡量、比对工作中产生的不同意见，判断新提议的潜在实用价值，权衡进度，以及保证开发团队向既定目标前进。

至少，一个好的网站规划说明文档中要说明：内容范围，预算问题，进度问题，和网站实施中的技术问题。最好的网站规划说明文档是非常简短的，目的性突出的，往往只是一个简短的提纲，或者是提领携纲式的对主要设计和技术特性进行描述。而更为完美的网站规划说明文档会包含策划阶段的目标规划和网站的结构细节。

1.目标与策略
你团队的使命是什么？
如何按照的建立网站？
列举两到三条你建设这个站点的主要目的？
谁是你站点的主要受众？
你想让你的受众在浏览网站后有什么想法和反应？
为了达到目的，你会采取那些策略？
你会怎样评估你的网站是否取得成功？
怎样才能很好的完成将来对站点的维护和更新？

2.制作中的问题
整个站点要包括多少页面？当前预算下能接受的最大页面数量是多少？
需要哪些特别的技术和功能需求？
站点的预算是多少？
站点的制作排期如何安排？（包括阶段性的时间计划）
谁是销售人员，以及他们的职责是什么？

上面这些都是很重要的问题，而这些问题往往在你的团队开始“实际”运做的时候最容易被忽略。如果你不能自信的回答出上面全部的问题，那么任何一件设计或工作出来以后，都不会被保证是肯定有用的东西。

3.避免“战线拉的太长”
网站规划说明文档规定了整个项目中你应该做什么，你的预算问题和开发的时间安排。“战线拉的太长”是导致网站失败的一个普遍原因。在没有很好的规划站点的时候，随着一些原计划外的东西逐渐加入到项目中，你的战线也会越来越长(涉及的内容会越变越多)，而且往往为了满足各个出资人的要求，你会加入新的内容和特性，在网站的结构已经建立后对内容和结构进行重大改变，填塞进很多你当初意图之外的很多内容和一些交互程序。上述的情况没有一条是具有完全致命的特性的，但是这些东西逐步累加，往往会导致整个项目预算超支，延误档期，使原来周密切实的计划被埋葬在混乱的内容中。

不要试图在你没有确立明确目标和没有创建一份坚定、现实网站规划说明文档而开始行动。你计划的越周密，你得到的结果就越好。

在规划中明确规定一个最大页面数量是一个防止“战线过长”的好办法。尽管页面数量并不是一个容易确定的具体量度（你可以把页面做的很长，或者说你可以把所有内容都放到同一个页面中），但它还是可以给那些项目中试图添加不必要内容的人一个限定。如果要添加页面数量，你就有意的去联系、暗示预算部分，逐渐让这种做法成为习惯，因为现实严峻的预算、时间问题往往会压制住组员的“热心”，打消他们“不就是多加一个页面”的念头。一个限制页面增加的好方法是把页面增加设计为“零总合”的游戏。如果有人要增加页面数量，那就必须让他找出一个需要去除的页面来替换，或者得到预算和时间部分的相应增长，以此来平衡、抵消增加的工作量。

变化和改进也不失为一件好事，但前提必须是大家能够现实的对待由于变化而引起项目预算和时间放生的改变。对任何原计划站点内容、设计、技术问题的改变，都要和预算、时间建立紧密联系。人们经常不太愿意直接去讨论预算和最终期限的问题，而且宁愿默许项目实施中做出变化和添加无用内容，也不愿意召集客户或组员进行一场实际的讨论。这种不理性的，对内容变化默许的态度只不过是在时间上推迟了最终的结果----不可避免的失败。

综合考虑时间、预算和内容范围是让项目不至于脱离实际的时间、金钱和最终质量要求而陷入混乱的唯一选择。在开始前制订坚定务实的计划会避免将来的很多麻烦。制订明确的计划，然后切实的去执行它。
二、网站开发流程

在不同的网站项目开发过程中都要面对不同的挑战，但是对于开发一个复杂的网站来说，则主要会面对下面六点内容：

1.站点的定义与规划
2.信息结构的搭建
3.站点设计
4.站点建设
5.站点推广
6.跟踪回访，评估和维护

对于一个开发团体来说，无论是在开发进度期间还是在站点成功的建立以后，一个大的站点的建立过程是长期的预算，团队成员及公共关系间综合作用的结果。太多站点的建立都是以奇怪的方式开始的，独立工作于整个开发队伍外的小的利益群体在还没有搞清楚整个队伍的核心目标内容的时候就已经着手开始制作了。缺乏计划，仓促上阵的结果往往是生产出了一个没人要的站点，以财源和浏览量的耗尽为终结。

在你开始考虑下列的各种主要的开发进程内容的时候，注意起到构建整个站点作用的页面结构是一个成功项目建立过程中最后需要考虑的几件事情之一。考虑进程中的每一个步骤，让它们对你的制订的计划产生影响。先思而后行，确保你已获得了有组织的资助，足够的财力和人力，以及一切可以使项目获得成功资源。

A.站点的定义与规划

在站点建立的开始，你需要为你的站点制订相应的目标，然后开始收集和分析各类信息，以便了解所需的预算和其他资源情况。同时也要开始确立站点内容的范围，所需的交互功能和相应的技术支持，以及你用来填充站点内容和满足受众期望所需的信息的深度和广度。如果你是采取外包的方式来制作网站，你依然会需要面对一些设计公司，并从中选择一个中意的。在理想的情况下，你的站点设计师们应该尽快的参与到站点的规划讨论中来。


站点制作过程列表

不是所有的站点开发都需要考虑下列的全部内容。为公司或更大规模的企业工作的开发者在站点建立的时候往往可以依靠公司内部坚实的技术力量。如果你是独立工作或者是一个规模较小的公司，你或许就需要联络不同的技术和设计提供者，以此来聚集你所需要的一切信息，用来建立一个内容充实的站点或者一个小的电子商务站点。

1.制作过程
*你的制作团队是由内部人员组成？还是由外部的承包商组成？或者两者是兼顾？
*整个进程由谁支配？
*谁是善于组织内容的专家？
*谁来联络外部的承包人？
*谁可以长期的作为站点的管理员和高级站点编辑？

2.技术
*你的站点应该支持哪些浏览器和操作系统？
Windows, Macintosh, UNIX, Linux
Netscape Navigator, Internet Explorer; 兼容低版本浏览器

*站点受众的平均网络带宽
国内受众或国外受众?
使用以太网或其他典型的高速连接的办公网络用户
使用ISDN或DSL等典型的郊区家庭网络用户
在更偏远的地区，国外或低端的使用拨号的用户

*DHTML和高级属性
需要javascript或者vbscript
需要Java程序
需要样式表
需要第三方浏览器插件支持
UNIX和NT服务器端所需要的不同特性
需要特殊的安全或机密特性

*浏览者通过何种方式联系到技术支持人员？
通过Email
通过聊天室，论坛，帮助中心或者电话支持

*是否需要数据库支持？
是否在站点的一些部分使用用户登录？
是否需要调查问卷？
是否需要查询并取回数据库内容？

*视听内容
视频或音频的制作

3.网络服务器支持
*内部服务器或从ISP租用的服务器
可以使用独立的域名
空间或流量的限制和额外的成本
足够满足网络流量需求的能力
7x24的技术支持和维护
对浏览者和流量的统计
服务器日志分析：内部服务器或外部租用的服务器？
适合你站点内容的搜索引擎
是否支持CGI，编程和数据库中间件？
数据库支持或在内部的同等功能支持

4.预算
*对负责短期开发人员和负责长期编辑维护、技术支持人员的薪水和利益的安排。

*内部开发人员的软硬件消耗

*站点和数据库使用的培训，站点的推广，以及站点的设计

*外包费用
站点设计和开发
技术咨询
数据库开发
站点推广

*站点运行所需的支持人员
站点编辑和网站管理员

*站点运行所需的服务器和技术支持

*数据库的维护和技术支持

*新内容的开发和更新

5.指定一个站点编辑
“人人都要负责”的观点会使网站很快的被遗弃。日后的维护计划需要指定一个专门负责站点内的各个页面内容的人。为了保持编辑风格，图形设计和管理策略的一致，你也需要一位负责整个站点内容的编辑。站点编辑的职责由你选择的维护方式决定。一些编辑负责全部站点内容的维护，同时帮助同事直接处理页面。而另一些编辑负责整理和编辑从那些直接负责页面的人手里接过的材料。如果有很多人负责页面的维护，编辑就会选择在他们制作并发布页面后对内容进行编辑，以免形成通信过程的瓶颈。而最终,包含特殊内容或重要内容的页面都要在编辑审核后再进行发布。

为了确保编辑的质量，站点编辑还必须确保站点内容如实的反映企业的政策，符合当地的一些适当的使用政策，并且确保不会出现触犯版权的内容材料。许多人都从别的站点上复制图片，卡通，音乐文件和文章，并发布在自己的站点上，他们没有真正的理解版权问题和滥用受版权保护作品的潜在法律风险。一个站点编辑经常面对的头等大事就是如何防止因为滥用受版权保护的材料而造成昂贵的诉讼开销。