Web视觉设计
点击看大图基本信息
- 原书名： Visual Design for the Modern Web
- 原出版社： New Riders Press
编辑推荐
结合实例，讲解如何将基本的设计原则运用到Web领域
使用大量的图表、图片和图形，以加强学习记忆效果
内容涉及站点分析，导航，布局，色彩，图形，排版和表单
结合实例，阐述了多种用于美化完善站点的技术
关注网站的可用性，以及如何使网站充满吸引力、令人难以忘怀
继《点石成金 Don't make me think》后关于WEB设计的经典著作。
推荐阅读
内容简介回到顶部↑
本书系统全面地介绍web页面外观设计的相关知识。本书分为八章：导论、站点分析、导航、页面布局、色彩、图形、排版和表单。全面讲解网站界面所涉及的内容，叙述生动，由浅入深，提供了大量的示例代码以具体地说明如何运用所讨论的设计概念。
本书可供web开发技术人员和美工人员参考。
本书可供web开发技术人员和美工人员参考。
作译者回到顶部↑
本书提供作译者介绍
麦金太尔，自1982年起执教于北伊利诺伊大学计算机系。她编写的教科书《lntroduction to Analysis and Design》，在20年间已再版至第3版。作者在2000年开始教授“Web设计”这门课程。
.. << 查看详细
.. << 查看详细
目录回到顶部↑
译者序
前言
第1章 现代web视觉设计入门
1.1 web技术回顾
1.2 网站开发生命周期
1.3 内容分析入门
1.4 网站架构分析入门
1.5 可用性因素入门
1.6 视觉设计入门
1.7 交互设计入门
1.8 web可访问性入门
1.9 本章小结
第2章 网站分析
2.1 明确组织目标
2.2 确定目标受众
2.3 确定目标受众的目标
2.4 决定网站约束条件
2.5 决定网站的内容
2.6 定义网站架构
2.7 本章小结
前言
第1章 现代web视觉设计入门
1.1 web技术回顾
1.2 网站开发生命周期
1.3 内容分析入门
1.4 网站架构分析入门
1.5 可用性因素入门
1.6 视觉设计入门
1.7 交互设计入门
1.8 web可访问性入门
1.9 本章小结
第2章 网站分析
2.1 明确组织目标
2.2 确定目标受众
2.3 确定目标受众的目标
2.4 决定网站约束条件
2.5 决定网站的内容
2.6 定义网站架构
2.7 本章小结
译者序回到顶部↑
Web设计中，什么最重要？毫无疑问，内容！但是，能够在一瞬间，抓住访问者眼球的是什么？是外观！.
单从书名，就可以看出，本书主要阐述Web设计中的“视觉设计”方面。“爱美之心人皆有之”，在Web领域也不例外。无论网站界面采用什么样的设计风格，或简约、明快，或复杂、精致，大家都喜欢井然有序、外观漂亮的网站。漂亮的外观，首先给访问者一个不错的第一印象。
然而，我们大家都知道，网站仅有漂亮的外观是无法长久地吸引住用户。除了漂亮的外观，网站还必须有好的内容，条理清晰的网站架构，易于使用的导航，等等。所有这一切综合在一起，才能够牢牢地抓住用户，增强用户的忠诚度。细读本书，你会发现，本书作者的视野并非只局限在如何进行“视觉设计”。
作者高屋建瓴，从Web设计全局考虑出发，先阐述了Web设计的总体原则，以及Web设计中相互依赖、紧密联系的5要素（内容、技术、网站架构、视觉设计、交互）。紧接着，作者没有直接阐述有关视觉设计的内容，而是先进行网站分析，引导读者去思考，网站的宗旨是什么？网站的目标受众有哪些？目标受众的目标是什么？只有在明确了这些问题之后，我们才能够集中有限的时间和精力，为用户提供最好的产品和服务。
在确定网站的内容之后，我们就需要决定如何以有效、便捷的方式，为用户呈现这些内容。而这就涉及到如何定义网站架构的问题。没有逻辑条理清晰、方便使用的网站架构，即使网站有好的内容，用户也很难从庞杂浩瀚的信息中找到自己所需要的内容。可以说，网站架构决定了网站的“功能”，而视觉设计决定了网站的“形式”。毫无疑问，无论是人还是产品，只有“外在美”而缺乏“内在美”，都无法长久地吸引人们的注意。..
网站的内容、呈现内容的方式等等基本问题解决之后，才到“视觉设计”的出场时间。“好酒也怕巷子深”。毕竟，好产品也要经过包装，才能被更多人更快地接受。作者站在Web设计全局的高度来阐述视觉设计，可以使读者清楚地知道视觉设计在Web设计中的地位，不至于产生以偏概全、主次不分的错误观念。
除此之外，作者还涉及Web设计中的可访问性问题。毕竟，出于人性化的考虑，我们设计出来的网站应该可以供所有人使用，不论访问者是否具有生理上的缺陷。由此可见，作者考虑问题的全面性、系统性。而这正是基于作者对于“系统分析与设计”的透彻研究和运用。
本书由叶永彬、雷钧钧、范一、杨旭旭合作翻译完成。众所周知，计算机方面的英文书籍大多使用口语化的表达方式，试图轻松、自然地表达枯燥、乏味的理论。而这增加了译者在翻译过程中的难度，同时也给读者造成了理解上的障碍。本书也不例外。因此，希望各位读者多多包涵。
在此，感谢在翻译过程中给予我们无私帮助的朋友们！...
叶永彬
2008年5月于郑州
单从书名，就可以看出，本书主要阐述Web设计中的“视觉设计”方面。“爱美之心人皆有之”，在Web领域也不例外。无论网站界面采用什么样的设计风格，或简约、明快，或复杂、精致，大家都喜欢井然有序、外观漂亮的网站。漂亮的外观，首先给访问者一个不错的第一印象。
然而，我们大家都知道，网站仅有漂亮的外观是无法长久地吸引住用户。除了漂亮的外观，网站还必须有好的内容，条理清晰的网站架构，易于使用的导航，等等。所有这一切综合在一起，才能够牢牢地抓住用户，增强用户的忠诚度。细读本书，你会发现，本书作者的视野并非只局限在如何进行“视觉设计”。
作者高屋建瓴，从Web设计全局考虑出发，先阐述了Web设计的总体原则，以及Web设计中相互依赖、紧密联系的5要素（内容、技术、网站架构、视觉设计、交互）。紧接着，作者没有直接阐述有关视觉设计的内容，而是先进行网站分析，引导读者去思考，网站的宗旨是什么？网站的目标受众有哪些？目标受众的目标是什么？只有在明确了这些问题之后，我们才能够集中有限的时间和精力，为用户提供最好的产品和服务。
在确定网站的内容之后，我们就需要决定如何以有效、便捷的方式，为用户呈现这些内容。而这就涉及到如何定义网站架构的问题。没有逻辑条理清晰、方便使用的网站架构，即使网站有好的内容，用户也很难从庞杂浩瀚的信息中找到自己所需要的内容。可以说，网站架构决定了网站的“功能”，而视觉设计决定了网站的“形式”。毫无疑问，无论是人还是产品，只有“外在美”而缺乏“内在美”，都无法长久地吸引人们的注意。..
网站的内容、呈现内容的方式等等基本问题解决之后，才到“视觉设计”的出场时间。“好酒也怕巷子深”。毕竟，好产品也要经过包装，才能被更多人更快地接受。作者站在Web设计全局的高度来阐述视觉设计，可以使读者清楚地知道视觉设计在Web设计中的地位，不至于产生以偏概全、主次不分的错误观念。
除此之外，作者还涉及Web设计中的可访问性问题。毕竟，出于人性化的考虑，我们设计出来的网站应该可以供所有人使用，不论访问者是否具有生理上的缺陷。由此可见，作者考虑问题的全面性、系统性。而这正是基于作者对于“系统分析与设计”的透彻研究和运用。
本书由叶永彬、雷钧钧、范一、杨旭旭合作翻译完成。众所周知，计算机方面的英文书籍大多使用口语化的表达方式，试图轻松、自然地表达枯燥、乏味的理论。而这增加了译者在翻译过程中的难度，同时也给读者造成了理解上的障碍。本书也不例外。因此，希望各位读者多多包涵。
在此，感谢在翻译过程中给予我们无私帮助的朋友们！...
叶永彬
2008年5月于郑州
前言回到顶部↑
数年前一个晴朗的秋日，我与我的上司，北伊力诺依大学计算机科学系的系主任Rod Angotti在一起闲聊。我抱怨说，我们系一些教员，或任何教员，应该开设一门Web设计课程。因为当时非常希望接手这门课程，我赌气地说，“如果在短时间内没有人开设这门Web设计课程，那么我只好自己来教这门课。”话虽如此但我对Web设计一点都不了解。诚然，我执教计算机科学这门课程已将近二十年。诚然，我一直是其他媒体领域的行家里手。但是，谈及Web设计？我却知之甚少。.
两周后，公布了春季教学进度表。我作为Web设计这门新课程的教师，出现在教学进度表中。我能做什么呢？我要迅速地了解掌握Web设计方面的知识。幸运的是，在第一个学期我就可以亲自挑选我的助教Jeff Cernauske（Jeff Cernauske已获得艺术学学士学位，包括Web设计）以及我的学生（渴望与我共同冒险、了解这门科目的优秀学生）。随着课程的进展，我常常不得不说，“对不起，我不知道答案。让我们一起来寻找答案吧。”但是，我们感觉很棒。那个学期是我度过的最愉快的一个学期。可以说，那个学期不仅是对教师的一个挑战，也是对学生的一个挑战。
首次执教Web设计课程之后很长一段时间，Web设计依然令我非常着迷。现在，我不再经常说“我不知道”。即使如此，我的学生每年都会教会我一些新技巧。我并不羞于承认这样一个事实，我是一名Web设计教师，而非一名Web设计者。事实上，学生通过训练，他们的设计能力常常会超越我自己。这令我欣喜若狂。
那段经历是如何促成本书的？在执教Web设计课程的数年间，我始终没有找到一本令人满意的、全面的Web设计图书。HTML、CSS和JavaScript的图书，无论是教材还是参考书都随处可见。有些书华而不实，只是展示一些设计华丽的网站。而有些书，只是告诉读者，在设计当中不要做什么。但是，我从没见到一本简明扼要的书，可以系统地阐述设计概念以及如何将这些概念应用到网站中。我希望本书是这样的书。
本书具体涵盖了哪些内容呢？
首先，让我们先来谈一谈本书不包含什么。本书不包含以下内容，它们均需另外详述。
·HTML和CSS基础。我编写本书的前提是，你已经了解有关HTML和CSS的基础知识，也许还懂一点JavaScript知识（虽然这并不是必须的）。因为，在本书中我会给出许多HTML和CSS实例，用以展示如何应用所讨论的原理。
·Adobe Creative Suite。虽然我不具体讲解这些工具，但是我会使用来自这些工具的截屏图片，用以阐述一些技术。而这些技术在其他开发环境中同样能得以实现。
·有关服务器端的技术，比如ASP、JSP、ColdFusion、Perl和PHP。
·多媒体，包括声音和视频。
本书所要阐述的内容是设计概念，以及如何通过使用HTML、CSS和较少的JavaScript，将这些概念应用到网站中。聪明的读者可能从书名就已猜出，本书专注于视觉设计方面，以及那些令网站具有可用性、吸引力，并且难以忘记的特性方面。坦白地说，网站设计不是件容易的事情。因为要考虑的因素实在太多，涵盖了从技术到组织，再到美学问题，以致在最初之时我把本书的书名定为《Web Design Alchemy》（《Web设计炼金术》）。因为，中世纪的炼金术消除了科学、艺术、魔法之间的界限。虽然一个设计完美的网站不是中世纪的黄金，但是它确实是不可思议的。
目标读者
本书的读者至少需了解Web技术的一些基本原理，包括基本的HTML和CSS。除此之外，还应该是那些想要通过培养在Web设计方面的审美能力，从而进一步掌握Web技术的人：
·技术人员懂计算机编程，急切需要学习Web设计中有关美学方面知识的技术人员。本书内容适用于那些没有受过正规艺术训练的读者。虽然各大公司通常由图形设计人员来做视觉设计工作，但是Web开发技术人员仍有必要熟悉美学理论，从而与图形设计人员进行交流并对其工作作出评价。还有一些小公司的技术人员，他们需要做Web设计方面的工作，但却没有受过任何设计理论方面的培训。虽然Web开发技术人员很少能够达到专业艺术家的设计水平，但他们依然可以通过学习，掌握足够的设计知识，从而创建专业的、具有吸引力的网站。毕竟，最优秀的程序员都是富有创造性的。
·美工和设计人员掌握美学理论，但在如何将美学理论应用到Web技术媒介时，常常遇到困难的美工和设计人员。比如：调色。假如有红、黄、蓝、黑和白5种颜料，美工能够调出可以想象出来的任何颜色。但是，当调色媒介变成以十六进制数字呈现的像素，而且原色变成红、绿、蓝时，美工该如何调色呢？黄色由红、绿像素混合而成，这个事实对于大多数美工来说是完全陌生的。本书可以教授那些传统的美工，如何将他们的技能转化到Web上。
本书的特点
本书分为八章：导论、网站分析、导航、页面布局、色彩、图形、排版和表单。在这些章节中，我提供了大量的“代码示例”用以具体说明如何运用所讨论的设计概念。请注意：书中提供的代码示例通常都经过简化，只保留了与所讨论问题相关的代码。为达到清晰简洁的目的，我用本地CSS样式替代了更佳的外部样式表。
如对本书版本有任何疑问或建议，请您直接与我联系。如果您是使用本书授课的教师或教授，请与我联系索取可能对您授课有帮助的幻灯片及其他材料。
本书网站www.VisualDesignModernWeb.com，包含了各种各样的补充话题和精彩的趣闻。我希望，在本书出版之时，网站可以建好并投入运行。另外，今后我也会不断增加一些我创建的或发现的，您可能会感兴趣的内容。
致谢
两周后，公布了春季教学进度表。我作为Web设计这门新课程的教师，出现在教学进度表中。我能做什么呢？我要迅速地了解掌握Web设计方面的知识。幸运的是，在第一个学期我就可以亲自挑选我的助教Jeff Cernauske（Jeff Cernauske已获得艺术学学士学位，包括Web设计）以及我的学生（渴望与我共同冒险、了解这门科目的优秀学生）。随着课程的进展，我常常不得不说，“对不起，我不知道答案。让我们一起来寻找答案吧。”但是，我们感觉很棒。那个学期是我度过的最愉快的一个学期。可以说，那个学期不仅是对教师的一个挑战，也是对学生的一个挑战。
首次执教Web设计课程之后很长一段时间，Web设计依然令我非常着迷。现在，我不再经常说“我不知道”。即使如此，我的学生每年都会教会我一些新技巧。我并不羞于承认这样一个事实，我是一名Web设计教师，而非一名Web设计者。事实上，学生通过训练，他们的设计能力常常会超越我自己。这令我欣喜若狂。
那段经历是如何促成本书的？在执教Web设计课程的数年间，我始终没有找到一本令人满意的、全面的Web设计图书。HTML、CSS和JavaScript的图书，无论是教材还是参考书都随处可见。有些书华而不实，只是展示一些设计华丽的网站。而有些书，只是告诉读者，在设计当中不要做什么。但是，我从没见到一本简明扼要的书，可以系统地阐述设计概念以及如何将这些概念应用到网站中。我希望本书是这样的书。
本书具体涵盖了哪些内容呢？
首先，让我们先来谈一谈本书不包含什么。本书不包含以下内容，它们均需另外详述。
·HTML和CSS基础。我编写本书的前提是，你已经了解有关HTML和CSS的基础知识，也许还懂一点JavaScript知识（虽然这并不是必须的）。因为，在本书中我会给出许多HTML和CSS实例，用以展示如何应用所讨论的原理。
·Adobe Creative Suite。虽然我不具体讲解这些工具，但是我会使用来自这些工具的截屏图片，用以阐述一些技术。而这些技术在其他开发环境中同样能得以实现。
·有关服务器端的技术，比如ASP、JSP、ColdFusion、Perl和PHP。
·多媒体，包括声音和视频。
本书所要阐述的内容是设计概念，以及如何通过使用HTML、CSS和较少的JavaScript，将这些概念应用到网站中。聪明的读者可能从书名就已猜出，本书专注于视觉设计方面，以及那些令网站具有可用性、吸引力，并且难以忘记的特性方面。坦白地说，网站设计不是件容易的事情。因为要考虑的因素实在太多，涵盖了从技术到组织，再到美学问题，以致在最初之时我把本书的书名定为《Web Design Alchemy》（《Web设计炼金术》）。因为，中世纪的炼金术消除了科学、艺术、魔法之间的界限。虽然一个设计完美的网站不是中世纪的黄金，但是它确实是不可思议的。
目标读者
本书的读者至少需了解Web技术的一些基本原理，包括基本的HTML和CSS。除此之外，还应该是那些想要通过培养在Web设计方面的审美能力，从而进一步掌握Web技术的人：
·技术人员懂计算机编程，急切需要学习Web设计中有关美学方面知识的技术人员。本书内容适用于那些没有受过正规艺术训练的读者。虽然各大公司通常由图形设计人员来做视觉设计工作，但是Web开发技术人员仍有必要熟悉美学理论，从而与图形设计人员进行交流并对其工作作出评价。还有一些小公司的技术人员，他们需要做Web设计方面的工作，但却没有受过任何设计理论方面的培训。虽然Web开发技术人员很少能够达到专业艺术家的设计水平，但他们依然可以通过学习，掌握足够的设计知识，从而创建专业的、具有吸引力的网站。毕竟，最优秀的程序员都是富有创造性的。
·美工和设计人员掌握美学理论，但在如何将美学理论应用到Web技术媒介时，常常遇到困难的美工和设计人员。比如：调色。假如有红、黄、蓝、黑和白5种颜料，美工能够调出可以想象出来的任何颜色。但是，当调色媒介变成以十六进制数字呈现的像素，而且原色变成红、绿、蓝时，美工该如何调色呢？黄色由红、绿像素混合而成，这个事实对于大多数美工来说是完全陌生的。本书可以教授那些传统的美工，如何将他们的技能转化到Web上。
本书的特点
本书分为八章：导论、网站分析、导航、页面布局、色彩、图形、排版和表单。在这些章节中，我提供了大量的“代码示例”用以具体说明如何运用所讨论的设计概念。请注意：书中提供的代码示例通常都经过简化，只保留了与所讨论问题相关的代码。为达到清晰简洁的目的，我用本地CSS样式替代了更佳的外部样式表。
如对本书版本有任何疑问或建议，请您直接与我联系。如果您是使用本书授课的教师或教授，请与我联系索取可能对您授课有帮助的幻灯片及其他材料。
本书网站www.VisualDesignModernWeb.com，包含了各种各样的补充话题和精彩的趣闻。我希望，在本书出版之时，网站可以建好并投入运行。另外，今后我也会不断增加一些我创建的或发现的，您可能会感兴趣的内容。
致谢
加载中...
