自从学习、实践CSS以来,问题层出不穷,实在是自己学习的太肤浅,对CSS的理解也不够。
本篇摘录一段对CSS大师Eric的采访记录,希望加深认识,准备重拾对CSS的学习劲头。
关于作者和此篇采访
原文于2004年4月21日采访,载于webstandardgroup.org由国内CSS的倡导者和先驱阿捷翻译(注,阿捷乃傅捷,是《网站重构》的译著者)。
Eric A. Meyer从1993年开始做网络方面的工作,受雇于Netscape公司做标准设计培训师。Eric在这个行业中相当有名,他经常就web标准、跨浏览器兼容性、CSS和web设计等方面在各种会议上发言。作为一个西方预科大学的网络管理员和毕业生,Eric开发W3C的CSS1校验程序,并于最近出版了尽其所能发现的CSS设计局限。Eric也是《Eric Meyer on CSS》、《Mastering the Language of Web Design》(New Riders)、《样式表:权威指南》(O’Reilly & Associates)、《CSS2.0 程序员参考》(Osborne’ McGraw-Hill)以及众所周知的CSS 浏览器兼容性表的作者。
Eric Meyer是HTML,CSS和web标准方面国际知名的专家,有着广泛的读者,同时也是 Complex Spiral Consulting 的发起人。Complex Spiral Consulting是一个采用web标准技术帮助客户节约成本和提高效益的公司。
问题一
Russ:你的新书《CSS权威指南》(Cascading Style Sheets: The Definitive Guide)第二版 刚刚写好,在我们了解此书细节前,想先问一下:你已经出版了多少本书?我发誓我家当地图书馆有专门一个类别是你的书籍。
Eric:不,不,那都是 Molly Holzschlag 的书,我只是类似的、辅助的部分。我已经写了5本书,其中的一本是精简版,我想那也许能也许不能算作一本书(我妻子坚持认为是)。第一本就是《CSS权威指南》,如果这次的第二版算独立版本,那我就有6本书了。我自己认为这次的第二版是算一本,因为它的工作量相当于写一本新书。
问题二
Russ: 在新权威指南中,比第一版增加或者更新了什么内容?
Eric:几乎所有内容都更新了。唯一不需要改变的是第一章和关于字体的章节,其他内容都大半或者完全的更新了。原来的章节排列在文本状态下完全打散重新排列。例如:在第一版中有"floating in the Visual Formatting"章节和"positioning got its own"章节,在新版中我将它们合并到单独一章中去了,并重写了大部分的格式章节。同样的方式,"the bit about lists"移到了它原有的章节,并增加了大量内容。有三章是全新的,它们是:Table Layout(表格布局), User Interface Styles(用户界面样式), and Non-Screen Media(非屏幕显示类媒体).
问题三
Russ:我听到一个传言说你的《Eric Meyer on CSS》也有新版本,新版本提供了多少种设计方法?
Eric:那个传言是真的。我们已经命名它为"in a blinding flash of creative genius, 'More Eric Meyer on CSS.' " 它比第一版有一些的改进,但并不多。我要说的是,这两本书没有前后的关联性,不需要为了第二版去阅读第一版(即使你两本都拥有。) 第一版的读者可以回想一下,第一个设计方法是如何将表格驱动的布局转换为简单的表格和CSS。而在新书里,第一个设计方法是:将只用HTML标识和空白GIF设计的有关页面转换为一个用纯CSS替代表格布局的页面。
类似的,有许多设计方法,例如:多种方法显示相册(photo gallery)样式,用表列数据实现整齐的金融报表,以及用背景布置在多个浏览器实现半透明效果,包括在IE/Win中。
有一个关于显示三级list的设计方法,包括列表的嵌套以及如何将它们转换为一个"下拉(dropdown)"的菜单,并且可以工作在大部分浏览器上(包括IE/Win),就象Doug Bowman的 Sliding Doors(滑门) 技术一样好。
除了上面这些,还有一个结合的方法解决weblog的入口样式问题。书中的最后一个方法是随便拿 CSS Zen Garden (由 Dave 建立)的一个设计,然后用css来实现它。基本上,Dave给我一个photoshop设计文件,然后我把它切割成我需要的几部分并用CSS使它正常工作,这样做你可以看到从设计到最终代码的整个过程。我也考虑到用PNG图片的方法,并且不会在IE/win中看起来难看。
问题四
Russ: 两年以前,CSS很少被讨论,现在看起来到处都在谈论!你是否认为自己帮助了它转变为主流意识?
Eric:这是自然而然的事情,真的。首先,IE6开始支持DOCTYPE开关,稍后又宣布它将不再发放新的IE版本,给大家一个稳定的感觉。第二,足够的设计师有足够的时间阅读书籍和教程,并用CSS在他们自己的站点上做实验。在这种背景下,一批优秀的设计站点出现了。第三,我想是因为随着设计艺术的提升,那些有设计能力的天才并能真正理解CSS好处的web设计师(象Doug Bowman, Dave Shea, 和 Jeffrey Zeldman)推动了事情的进展。连线(wired)杂志网站的重新设计,禅意花园(CSS Zen Garden)以及其他站点开始展示CSS驱动的设计,不仅仅是能工作,而且看起来非常漂亮、不可思意。
越来越多的实用的、容易跟学的资源(例如:Listutorial 和 Floatutorial)也起到了很大作用,等等。
问题五
Russ:对于那些刚开始接触和使用web标准的设计师和开发者,CSS的哪些方面是最重要的?
Eric:最重要的?我不得不说是层叠(cascading)部分。不仅仅只是层叠,还包括继承(inheritance)、特征(specificity)和选择器(selector construction),一旦你掌握了这些,其他的都只是细节问题。
接下来,我想彻底理解视觉效果,包括块(block)和内联(inline),也是至关重要的。如果你能知道设计将展现什么效果,可以避免很多(CSS没有按预期执行)令人头疼的问题。就象很多语言,CSS有它的规则,忽略规则肯定导致混乱。
问题六
Russ:在过去的12个月里,有一种图片替代(image replacement)技术 被引入。你对它的全面感觉是什么?如果你不得不使用它,你将使用哪种模式(model)?
Eric:我偏向于使用CSS3的方法:用'content'属性来替换内容。这是尽可能轻量(low-weight)和non-hackish的方法。这也是在目前低支持情况下的方法,因为目前只有Opera支持图片替代。
另外,我发现图片替代技术的优点和缺点并存,优点是使某些文本看上去漂亮,缺点是给靠声音阅读者造成易用性问题。坦率讲,真正的问题在于读者自己。他们尝试展现真实的页面和阅读结果,但他们在做的恰恰是一件错误的事情。如果一个页面设置了一个screen-medium样式,而阅读机将完全忽略那些样式,除非大多数的阅读器被重新修理。
问题七
Russ:好象一提到"font size"就会点燃CSS大讨论--一场字体纯化论者和网页设计师的战争。你是否认为有一个适合所有用户的解决方法?
Eric:没有,虽然我希望有别的方式,但是我没有。每一种设置字体的方法都有优点和缺点。你能做的最好的方法就是找到一种以前最佳,以后变化最小的方法,而且,这需要在不断的设计变化(design-by-design)过程中完成。一位设计师的目标是尽可能以pixel控制文本字体达到最好表现,虽然使用ems或者关键字(例如x-small)能达到更好的效果。任何时候,如果有人告诉你,有一种方法定义你的字体尺寸适合所有站点,那么他只是告诉你一个原则,而不是一个解决方法。
问题八
Russ:有一个一直争议的问题,你对CSS技巧(hacks)有什么看法?
Eric:这是不可避免的,直到有一天,我们的浏览器能够完美的支持和执行CSS,就是CSS hacks停止的一天。在此以前我们将坚持做。要指出,我的意思是针对所有的hacks,不管它们是对于CSS,还是其他事情,比如微软的Conditional Comments。
问题九
Russ: 你是否认为当浏览器市场为CSS3做好准备时,将进入一个新时代---记住微软Longhorn操作系统的时间表。
Eric:我是这样认为。但是,按这种说法,那么全面支持CSS2的视觉媒体(visual-medium)看起来早应该在2003年完成。我的预言记录总是比其他人要差,也或许不适合一个长期计划吧。
问题十
Russ:最后一个问题,越来越多的web设计师正加入CSS2的队伍,你是否认为CSS3的复杂性将减少它自身的吸引力,甚至使一些畏惧它的设计师完全放弃CSS?
Eric:有比那更糟的:多数的web设计师仅仅学习了CSS2的一部分,而没有真正理解它的本质。
任何事情都有可能发生,就好象曾经有设计师因为CSS1的"复杂性"(相对他们所掌握的知识)而畏惧的。
关于CSS3,有一件好事情就是:它被分离并集成到模块(modules)中去了,所以你可以忽略你不关心的部分,而集中精力在你想了解的部分。如果你真得想深入到打印样式中,你可以阅读打印模块(Print module)去了解它。如果你关心的是国际化,那么你找到I18N 模块,那里有些每个人都需要了解的部分(如选择器和层叠),但是随后,伴随你的兴趣而来的是不得不啃那些庞大的规范说明书。
Comments