CSS禅意花园：Web设计艺术的王者之书

CSS Web前端开发技术，经典书籍内容提要本书作者是世界著名的网站设计师,书中的范例来自网站设计领域最著名的网站— CSS Zen Garden(CSS禅意花园全书分为两个主要部分。第I章为第一部分,讨论网站“CSS禅意花园”及其最基本的主题,包含正确的标记结构和灵活性规划等。第二部分包括6章,占据了本书的大部分篇骊。毎章剖析“CSS禅意花园”收录的6件设计作品,这些作品围绕一个主要的设计概念展开,如文宇的使用等。通过探索36件设计作品面临的挑战和解决的问题,读者将洞恶主要的Web设计原则以及它们运用的CSS布局技巧,理解CSS设计的精髓,恰当地处理图形和字体来创建界面优美、性能优良且具有强大生命力的网站。本书原版书自出版以来持续畅销,受到众多网站设计师的推崇。本书适合网站设计人员和网站设计爱好者阅读,更是专业网站设计师必读的经典著作译者序CSS禅意花园”网站(www.csszengarden.com)的超常创意就已经足够让我们唏嘘不已—亘古不变的HTML文本,仅靠者数百个不同的CSs样式表,就成就了数百个凤格迥异而又精彩绝伦的网页设计作品!而一本计算机技术著作的书名若是敢包含“禅(zeny,那么作者又将会对该技术有怎样的理解,对自己有着怎样的自信?而此时此刻,这样一本讲述“Cs樺意花园”网靖的、名为《CSs禅意花园》的书就这样静静躺在你手中!毫不夸张地说,它丝老没有墓负“禅”这个美名的褒扬,加上“CS禅意花园”在Web标准领域内无可争议的地位,二者相轴相成,交相辉映,让本书当之无愧地站在了Wb标准设计领域中旁人难以企及的巅峰。这本书是教我们学习CS的么?不尽然。这本书是教我们学习Web标准的么?不尽然。这本书是教我们学习网页设计的么?不尽然。那这本书是做什么的呢?为什么要读呢?实际上,这并不是一本用来入门的教科书,它已经跳出了某种技术或是某个主题的限制,涉及的范围异常广泛:从Web技术的发展到用户体验,从简单的模仿到富有灵性的创意,从心理学、人类学和社会学到深层次的艺术理念所不包却又大都点到为止,留给我们充分的思考空间——薄薄的300页篇、屈指可数的7个章节,寥塞的36个实例无一不体现了作者的精巧与良苦用心。所谓滴水藏海,阅读本书,我们将体会到的是一种开阔、超然的对技术、对美的总体把握能力—这或许也正是“禅”的真谛吧!全书始终围绕在符合Web标准的网页设计的方方面面,但却从没有任何枯燥的说敦,抑或是冗长的代码,而是在更高的位置、从一个全新的角度娓娓道來,如涓涓禩流潜移戥化地让你体会到Web标准的好处。正如老子在《道德经》中所说的那样,大音希声,大象无形。100个人眼中有100个哈姆雷特,本书也是如此。对于CSs,Web标准以及网顶设计技术,无论你是初出茅庐的新手,还是渴望更进一步的提高者,抑或是浸淫多年的专家,都能在书中领悟到独一无二的意境,学到适合自己的知识。当然,你最好已经有了丰富的Web设计、开发经验,否则只被本书中那一个个漂亮精致的设计所吸引,而却对其背后隐藏的那片世界望洋兴叹,岂不进憾?若你只是想要一本CS法的快速参考手册,或是一本从头到尾循序渐进讲述Web标准的优势以及实现方法的“传统”技术图书,那么本书显然不会是一个好的选择—若你正在书店中,那么方圆一米之内就有无数种更“好”的替代品。阅读本书,你需要小资一般的情调—幔暖阳光的午后、安静舒适的房间、一盏弥漫的香茗…仔细领悟其中蘊含的深意,时而沉浸其中,时而掩卷沉思,时而打开电脑记录下最新的灵感,你的心灵将要充盈着沉静、安闲,直至领悟到技术与艺术结合起来的那份超然的意境。正是因为本书的原版如此经典,我们在翻译时备感诚愠诚恐。原作语言带有强烈的西方文化特色,很多俗语、典故更是让翻译的过程充满了艰辛,加之时间有限,以致一度让我们萌生了退却的念头,深恐一不小心糟蹋了如此的传世之作。虽在翻译的过程中竭力以求信、达、雅,但限于自身水平,译本很多地方仍旧有所不足,还望各位读者不吝指正。您可以通过我的博客(htp/ flying cnblogs,eom)或 E-mail(FlyingChent@hotmail.com)与我们联系。本书的勘误也将发布到我的博客网站上在CSS领域,很多术语的翻译颇有争议,也非常值得玩味。这里我们列出翻译中過到的一些常见的、争议较大的CSS术语对照。选择的标准主要考虑约定俗成的译习惯以及更明确的表露。我们还在htt: lying cnblogs. com/ archive/2007/02/(04639837htm中一一列出了选择这些译法的详细原因以及各种译法之间的比较,若有更好的建议,也请至上述地址指出,我们会在再版时予以修订□ box model:盒模型口 padding:内边距口 argIn:外边距口hack:(不译)口 liquid layout:式布局口 ancestor element:粗先元素口 descendant elemen:后代元素口 filter:滤镜口 selector:选择器口 accessibility:可访问性在译过程中,我们得到了众多家人、朋友和同事的关心与鼓勵。感谢 AdityaBansa先生,不厌其烦地为我们解释了很多原著中艰深酶涩的语句;感谢段大为先生为我们解释原著中的日语;感谢人民邮电出版社的谢工女士、李际女士和付飞先生, ajaan,org的李锟先生给了我们这宝贵的翻译机会;感谢cure、 xilihwalasheva wen、 kevin,hax、 Cat chen、琳琳的小狗、THN、 small tirer和 iuaes等博客网友为本书的术语翻译提出的宝贵意见。没有你们的支持与帮助,我们不可能在如呲短的时间之内做到这些!陈黎夫2007年3月1日作者简介Dave shea是一位图像设计师,"CSs掸意花园”网站的创始人和耕耘者该网站获得了很多奖项,包括 South west interactive会议授予的“ Best ofshow"。 Dave Shea曾在全球的行业大会上发表演讲,其作品被世界各地的书籍和杂志广泛收录。他还是Web标准项目( Web Standards Project,wnsP)的成员,该项目是一个由Wb开发人员和设计师组成的小组,致力于推广基于跨平台和标准技术的Wb设计。Dave还是Web设计机构 Bright Creative的拥有者兼总监,其在线出版物 mezzoblue. com中所有的Wb内容几乎均为Dave所作Molly E Holzschlag是一位作家、教师和web设计师,編编写了30多本有关Web设计和开发的图书。她享有“最伟大的数字作家之一”的萸誉,同时被认为是网上最有影响力的2位女性之一。Moll无疑是Web设计和开发界最有趣、最活跃的人物之一。作为WaSP指导委员会的成员,Moly同其他Web开发人员和设计师一道,致力于推广W3C推荐规范。她还在亚利桑那大学、菲尼克斯大学和比马社区学院教授“网站管理员( Webmaster课程。在 Web Techniques Magazine关闭之前的最后三年中,M在该杂志撰写的专栏 ntegrated Design深受欢迎;她还在 WebReview, com担任过一年的执行辑。若想更详细地了解Moy,请访问她的网站htp:∥molly.coma前言No億e欢迎阅读这本关于一个将要塑造Web未来的项目的图书。可以到www.cssZEngarden,com浏览本书的诞生缘于2003年5月8日创办的一个网站。该网站的初衷是改变“CSS意花回”网站和本书中列出的所有设计作品。人们对web设计的看法,但最终却出乎意料地改变了全球技术发展的趋势。若想查看某段HTML标记,可使用浏宽该网站名为“CSS樺意花园",是来自世界各地的众多天才协力合作的结晶。器的“查看源文件”功能,该功能通常位于查牾"菜单中。若想查若设计中使用的CS禅意花园”在发布宣言和展示作品两方面双管齐下,其创建目的cSS,首先选择该作品,然后找点击页面中在于展示基于CSS设计可实现的视觉效果。网站以样式表和图像的方式向设的“ View This Design's Css"链接。需要注意的是,不同作品中该链接在页面中的位计师征集原创作品,但规则是所有作品都必须使用相同的HTML文件。每件置也各不相同。作品的HTML都完全相同,无一例外。不可思议?甚至有点疯狂?也许兼而有之,但毫无疑问,只要使用得当,csS与任何设计工具相比都毫不逊色。本书展示了网站收到的36件最杰出的作品,深入剖析了创作人员的设计历程及他们使用的工具和编码方法。整本书就谈论一个网站?是真的吗?如果这是一个普通的网站,当然有理由这样怀疑。但“CSS禅意花园”的内容是如此丰富多彩前又如此实用,并且都由世界各地各怀绝技的设计师创作,因此对本书来说最严峻的挑战则是如何将其揉合到一本书中。本书介绍的内容本书是介绍和描述该网站的吗?从某种意义上说,是的。本书是有关Web设计最佳实践和技巧的教程吗?显然如此。它是一个令人赏心悦目的设计画廊,设计网站时能从中获取灵感吗?当然没问题。Cs禅意花园”涉及了众多有关如何完成现代Wb设计的主题,如果专门探讨设计的某个方面,比如布局,那么连展示该网站的冰山一角都谈不上。縮写本书时,我们就清楚地认识到了这一点,因此必须涵盖方方面面文字的使用、色彩理论、布局设计技巧,应有尽有。从本书中能够学到CS知识吗?当然,但不是人门水平的基础知识。要侧重于视觉设计技巧,必须跳过入门课程,直接进人中级。市面上的另外一些不错的技术书可帮助读者快速掌握有关CSS句法和语法的基础知识。我们建议读者购买其中一本进行快速人门,然后在本书中学习如何以极具视觉震撼力的方式应用CS技术。本书将重点放在解决视觉设计问题上,而不是详细描述CSS規范的方方而面。在恰当的时候也会讨论浏览器的支持情况,以保证实用性。本书针对的读者本书适合所有对设计和开发网站感兴趣的读者阅读。设计师本书采用视党化的方式讨论CSs设计理论和实践,以使用基于标准的最新技术完成实际作品和解决实际问题为目标。程序员本书的重点是视觉艺术,但并不要求读者具有图形设计基础。作者从始至终都在尽最大努力以最佳的方式定义设计术语,确保即使读者不具备任何设计知识,也能理解并运用本书中介绍的概念和技巧。CSS新手尽可能少用行话和技术术语,即使读者对CSS没有足够清晰的认识,也能理解大部分章节。建议CSS新手从推荐读物(参见本书末尾的“结语”部分)中选择一本阅读,学习基本概念和话法,然后通过阅读本书来括展这些概念并在作品中实际应用。书中探讨了一些基本的Web设计原则,适用于大多数但不是所有情况。当然可以使用 Adobe dreamweaver等自动设计工具来创建基于CSs的网页,但对那些使用HTML缤辑器手工绵写代码的设计人员来说,本书介绍的大部分CSs技巧将显得更加有用。如果仅依赖拖放来完成Web设计,将会发现本I原文为" Macromedia dreamweaver",但 Macromedia已与Adbe公司合并,产品名称也有所改变。—译者注前书在很多方而技术性太强。但曝这不会让读者丧失拓展知识的勇气。GSS高级用户即使是对cSS了如指掌的读者也能从阅读本书的过程中受益良多。本书侧重于视觉艺术,轴以实际的CSs示例,这些实例均出自当今最具创意的些设计师之手;书中涉及的主题丰富多彩,即使是那些经验最为丰富的专业人员也能从中学到一些全新的技巧。如何阔读本书网站通常都有人口,被称为主页。在这里,用户可以通过点击某个标题跳转到网站的任何地方,浏览其中包含的内容;也可以使用搜索功能查找所需的内容;还可以随意单击,了解能获恶哪些更深入的内容a本书釆用的也是这种模型,阅读的方式也没有对错之分。既可以从头开始逐页阅读,也可以直接跳到感兴趣的章节。读者可以以任何非线性方式间读本书,以任何顺序研究书中的每个作品。本书分为两个主要部分口第一部分为第1章,讨论网站“CSS禅意花园”的创建及其最基本的主题,包含正确的标记结构和灵活性设计等口第二部分包括6章,占据了本书的大部分篇幅。每章剖析“CSS禅意花园”收录的6件设计作品,这些作品围绕一个主要的设计概念展开,如文宇的使用。通过探索36件设计作品面临的撓战和解决的问题,读者将洞悉主要的Web设计原则和CSs布局技巧的运用下面概述这7章的内容。第1章追本溯源概述“CS禅意花园”的来历及CS的发展历程,讨论正确的标记结构和设计。