序：
Web设计师与开发者面对的一个很大挑战是跨越纯视觉思考者和纯线性思考者之间的交流鸿沟。只有少数的人才有能力平衡精巧而有创意的设计与日益进步的复杂技术间的关系。正因为如此，Jeffrey Zeldman，DouglasBowman和Dave Shea都为这个行业做出了具大的贡献，不仅因为他们的工作兼顾各方面，更重要的是他们把这种能力传授给别人。

数年前，我在New Rider出版了一本叫作IntegratedWeb Design的书，在这本书中我就试图解决上述问题。我们怎样才能让设计者具有符号和结构的思考能力？如何让逻辑分析型的思考者喜欢和理解美学？还有更为复杂的沟通与管理、市场营销等领域。而更大的难题在于创建真正强大的平台来实现高效的工作流程、有力的技术和奇妙的设计，让我们这个行业持续发展，并不断追求卓越。

这使我想到Andy Clerke。几年前我第一次注意到Andy的工作是因为他的博客。他在博客中发表一些关于标签命名规范和CSS的帖子，这个主题在很长的一段时间里吸引了我。通过深入研读他的文章和他的设计作品，我意识到这个博客的主人是一个拥有把想法付诸实践的激情的家伙。2005年著名的“Britpack Invasion”期间，我们相会在SXSW大会上。我们开始讨论一些问题。之后的几个月里，我们开发了一系列深受欢迎的内容，包括“设计师的CSS”和“开发者的CSS”，旨在通过我们互补的技术和经验来教育和启发我们的同行。

当写一本书的主意顺理成章地进入我们的会谈时，我非常热情地把Andy介绍给了Peachpit和New Riders的出版人Nancy Aldrich-Ruenzel，我知道如果有什么印刷品能把握Andy的思想的话， 那一定是New Riders的“Voices That Matter”系列。后来我们三个人在旧金山会面。有趣的是，我坐在他们旁边，却没能在这次促膝长谈中插上几句嘴。显然，他们是棋逢对手了。我们坚决认为这本书将是恰到好处，尤其是鉴于Dave Shea和我设计的The Zen of CSS（禅意花园）的成功。我参与这本书的编辑工作，和Andy一起调整书的观点和内容。而Dave也将参与，为这本书撰写前言，让本书成为任何想成为更好的设计师或更好的开发人员的读者的资源。

正是这本书所面临的挑战，促成了它的完善。你看，由于Andy技术上的成就，他是而且将一直是一个视觉型人才。而我在设计领域可能受过大量的正规的美学的训练，我是一个逻辑、线性思维的人。Andy跟所有的视觉型思考者一样，生活在一个充满想象力和创造力的世界，而我喜欢秩序、交流与过程。在写作本书的过程中，有许多的挑战是我们必须面对和解决的，而这种种问题在我们的领域与我们这种类型的人之间是到处可见的。这本书，其不可思议的美感、扎实的技术和如真实的梦境，正是我们最初的设想：进一步证实只有当人们致力打破那些难以逾越的鸿沟时，真正的创新才会发生。今天我可以带着自豪、尊敬和荣誉将这段经历的结果分享给努力工作想要超越职业挑战的您。但愿本书像我们希望的那样帮助您让Web工作的每件事情都如我们所想所愿那样完成。

献上我所有爱，
Molly E. Holzschlag
2006年10月于伦敦

译者序：
界面重不重要？
我在一次做顾问时，这样跟开发人员阐述，重视界面其实是事半而功倍的事情。
你做了一个很不错的产品，有很强大的功能，代码规范，架构设计堪称典范，唯一的不足在于界面流于庸俗。

为了将产品推向市场，你做了非常详细的说明，一一介绍产品的设计和功能，然后你的业务员手捧宣传材料努力地向客户介绍这款产品。但很多客户都心不在焉地听着，一过打着电话，一边看着手表，最后非常有礼貌地告诉你的业务员，他们还要“研究研究”。好不容易有一个客户比较有兴趣地听完了功能介绍，但后来一看产品的界面，又呶起了嘴—因为他觉得让他的客户看到界面如此落伍的软件，是一件很没面子的事。

后来，你做了一个功能很简单的产品，它专注于一件事情，甚至用一句言简意赅的话就能清楚地说明。但是这个产品有着简单易用的操作方式，界面也美观大方，处处闪动着灵感，显得非常精致。你为这个产品做了一个布满界面截图的精美的使用说明书。你的业务员只是把这个很薄的小册子放在客户的办公桌上，也没有打扰他们的工作，就回家睡大觉了。然而这一次，你反而接到了很多客户打来的订购电话，因为他们觉得这个产品一开始就深深吸引了他们，而且产品功能也一目了然，极具价值。通过这个故事，深陷于逻辑与秩序的代码开发者也许能明白，只注意功能和架构并不能成为“Heros”。Web 2.0思潮的涌动，AJAX技术的炙手可热，让很多人认识到了客户端技术的重要。但恶补了一番Javascript和CSS后，心中仍感觉不到一丝踏实—因为从一开始就没有了解Web 2.0思想的核心，“为了技术而技术”，照着书本写几个Demo又怎能驾驭这个更加“苛刻”（海量信息时代，用户找信息已经变成了信息主动找用户，如何在众多竞争者中脱颖而出、吸引用户变得困难重重）和“变化多端”（客户访问终端也在发生很大的变化，拿着手机、PDA或你想都想不到的终端看网页也大有人在）的时代。

从2005年CSS类书籍的热销的情况来看，估计很多人都学会了float和clear，也理解了什么是盒模型。但刚刚学会使用@import指令来使浏览器能够导入高级CSS设计，学会了几个CSS hacks、“山顶角”和“滑动门”的你，不得不马上面对Andy又为我们提出更高的目标的现实。

阅读这本书是很享受的，掠过一幅幅精美的图片，最先进的Web设计思想已深深地印在你的脑海中，开发人员得以理解什么是设计，设计人员也学会了摆脱从视觉的角度去思考设计的旧习，何乐而不为呢？而每每想到我再也不用花费大量口舌去纠正别人“Web标准就是用DIV而不用Table”的论调，则更是心中暗爽。

本书由谭振林、何颍、桂冠、于飞、田少雄合作翻译。由于这本书的语言非常活泼，增加了我们翻译时理解和表达作者本意的难度，但我的合译者们坚强地走过了这段艰难的旅程，相信我们每一个人都在这个过程中成长了。

最后，谢谢你们。
任何语言在这本漂亮的书的面前，都显得那么苍白无力，大家还是赶快翻开书页吧！
谭振林
2007年5月于深圳罗湖

前言
为了介绍这本书，我建议您先不要去阅读它，而是花点时间好好欣赏它。
希望通过粗略地翻阅书页，您已经在某种意义上领会了它的设计风格。它太漂亮了，不是吗？图片和截屏俯拾皆是。亮点在于它巧妙地利用图像而不是一行接一行沉闷的标记和CSS。引入真实的例子说明具体的Web议题。太不可思议了，关于代码的书居然可以看上去这样漂亮！

这就是我要提醒您的。正如您可能已经从书名中推断出来的，这不仅仅是另一本代码书籍，它的内容远远不止于此。它阐述了代码和设计的精妙配合、代码如何很好地支持设计创意以及如何打破枷锁，让我们不必过于顾忌实现。正如您将从这些页面中学到的那样，庞大的在线空间，比如Yahoo，已经开始使用向下兼容老浏览器的技术，但更重要的是，很多公司正在使用新的技术充分发挥新型浏览器的优势。而这些技术全都是我们需要实践并应用到自己的项目中产生效果的。Andy Clarke向我们展示如何做到这些。

某种意义上，这本书让我想起了2005年早期的一些事情。也许您读过《CSS禅意花园》（已由人民邮电出版社翻译出版），一本我有幸和MollyHolzschlag合著的书，她也是本书的编辑。

在《CSS禅意花园》中，我们首次讨论CSS不仅放在面向结构化代码的风格中讨论，还应结合设计理论和精心设计的例子来解释、说明和启发。而本书让我想到了一个很好的下一步。完成了《CSS禅意花园》，然后呢？Clarke先生走过来，告诉了我们所有的答案。

在《CSS禅意花园》中我们领会到基于CSS的设计并不一定丑，在技艺高超的视觉设计师的手中，CSS可创造无限可能。现在我们通过学习本书明白Web现在的情形仅是一个起点，是时候展望未来了。

更重要的是理解。本书不仅仅是一本指南，只介绍那些众多技术手册已经讲解得很充分的内容。您面临这本书的理念的挑战，启发您把Web从现在的情况带入一个新的高度。本书不仅是一本解决问题的手册，更是一份宣言：超越今日之Web。不要只是关注过去，把您的目光转向更广阔的未来。Clarke先生告诉了您如何去做。
Dave Shea
2006年10月

专家评书：
《超越CSS》，我听到这本书名时充满了无限期待，由于标准化WEB页面制作的热捧，市面上关于CSS的书籍也雨后春笋般的热销开来。《超越css》到底如何超越呢？

当W3C提出结构与表现分离的思想开始，CSS这项技术就开始在WEB领域得到了广泛应用,页面设计师开始尝试使用CSS来控制页面的展示效果，使用符合标准的XHTML标签来构架网页基本结构，设计师们也逐渐发现在页面结构标准化框架下，使用CSS可以随心所欲控制页面中内容的布局、定位、字体大小及所有内容展现的表现形式，也帮助我们更好的协调页面内容组织与关系。CSS+DIV的排版布局方式可以说推动了网页发展的一场革命，web中越来越多页面结构更加合理化，页面中数据可以更好的被搜索引擎检索到，合理的页面框架也很好的被程序开发人员认可。CSS广泛应用从2001年到现在，已经不再单纯是一种技术，而更加带有了艺术气息。WEB页面可以由CSS控制其所展现的样式，通过改变某个CSS文件来做到页面在瞬间发生结构和颜色的变化而满足不同环境的需求。

《超越CSS》这本书中，作者向我们介绍了如何将CSS技术与艺术美妙结合起来,使用大量范例来论证如何更加艺术化展示CSS技术,而不再单单是纯粹CSS技术应用的知识推广。

它不仅教会我们如何更好的使用CSS来控制页面布局和页面表现效果，并且它引导我们如何去使用合理的XHTML标签。XHTML作为一种优秀的结构化语言，更好的使用XHTML标签，页面的结构才更加合理、规范。合理化选择XHTML标签加之CSS及CSS高级技巧的灵活运用，我们的WEB页面才会更加的完善。在本书中，作者以Cookr项目为主题，用结构和表现分离的手法，逐步去实现Cookr项目的制作过程。对于Cookr项目首页，合理的使用<h1>-<h6>标签，然后配合使用<ul>及<p>标签，完成了首页的结构布局，没有冗余的不必要的标签，作者还应用了类似<cite>及<blockquote>辅助标签来配合使用以控制实现预先设计的效果，启发我们对辅助标签应用的灵感。如果能灵活使用<cite><dfn><var><code>等标签，会带来事半功倍的效果。页面主体结构之后就是使用CSS完成表现层的制作。作者详细声明浏览器默认样式的定义，可以说对于默认的样式定义考虑非常充分，涵盖了常用的标签的全局定义，为之后使用这些标签做好了铺垫。通过Cookr项目的实战，作者介绍了布局、定位、字体弹性控制、颜色控制等CSS技巧，在CSS的使用中，作者应用z-index,position等技巧处理版式表现效果，值得我们效仿、思考。最后作者为我们展示了排版样式的定义，使其Cookr项目的交互原形的最终完成。在《超越CSS》中，学习CSS不再枯燥，因为艺术与技术得到了结合。

没有最好、只有更好，《超越CSS》值得拥有。

——CSDN UI组组长,首席页面架构师武悦

出处：蓝色理想
责任编辑：蓝色

上一页 《超越CSS》新书上市 下一页 目录