《网站重构》读书笔记9:回想当年的坏习惯

“第7章 紧凑而坚固的页面保证:以严格和混合的标记组成的结构”首先解释了DIV和ID的概念,然后对一些过去的和现在的坏习惯进行了回顾。

看着作者例举的“坏习惯”,想想当年我也曾把这些坏习惯当做“流行圣经”,并且身体力行。如今虽然觉得那时候有点好笑,但是我知道这是因为环境、关注点都发生了变化造成的。如果回到当年,我依然会选择学习那些现在看来是“坏习惯”的东西。那些技法虽然冗长、拖沓、没有结构性,但是至少在视觉效果上比单调的HTML往前迈了一步,而往前迈一步总比什么都不做强。

在这之前,“SPAN”与“DIV”我一直搞不明白有什么不同,因为对于样式表圈地的作用来说,两者似乎都一样。经过本章的介绍,结合以往看代码的感觉,我发现DIV是用来划分逻辑块来使用的,而SPAN只是用来在恶劣的情况下把某一小段内容与周围的内容区分开来,也就是“内置的内容”。(也许即将到货的那本XHTML的书中会做出权威的解释)。

“id”与“class”其实应该是不容易发生混淆的两个标签,但是由于他们经常都伴随DIV出现,并且在CSS的作用机制中关系微妙,说实话,我也不能肯定地把他们的关系讲明白。本章节的描述中,也许是因为翻译的缘故,两者的界限似乎搅得更加的不清晰。下面我试着给他们下一个更明显一点的定义吧(也许不是很严谨):“id”就是声明特定一段XHTML标签的名字。一个名字只能使用一次;而“class”的值是CSS样式表中的定义的名字。

是表示该块的名字叫做“name”,而

则表示,对该块应用名称为“name”的CSS定义。

id的值必须用一个字母或者下划线开头,在JavaScript中他还不可以带有空格和连字符“-”,如果考虑到兼容性问题,连下划线也最好不用。

作者在文中特别提醒:不管是否结构化,任何元素都必须由清晰、紧凑的标记和干净的CSS组成。接下来他举了几个classitis、divitis的例子说明DIV和CSS的组合也可能产生出垃圾代码。看着这些臃肿的代码混乱的逻辑关系,觉得很好笑,有点耍贫嘴的意思。“表格都是不好的,CSS都是好的”这一流行的观念是错误的。

接下来的“过时方法的展示”带我们回顾了“服务器镜象”(我到现在还是不太明白这种技术)、“图片MAP”、“通过切割图片制作网站”、“HTML中详细的说明注释”、“用style把CSS内嵌到网页中”。这些事情都是我曾热衷的做法,当时只觉得大家都这么干,所以我也这么干,从来没有想过什么才是最重要的。也许我今天热心于想把标准搞明白,明天又有人告诉我其实还有一条更光明的大道。谁知道将会发生什么呢?重要的是,今天的每个接触了解,都不会是毫无用处的。如果我是从今天才接触WEB设计的话,那这本书我也许早以看不下去了,正是因为有了那些落后的坏习惯的经验,才越发感觉标准的重要。

《网站重构》读书笔记8:XHTML的9条军规

“第6章 XHTML:WEB重构”开始涉及到一些具体的操作规范的东西。本章最重要的内容就是描述XHTML执行中的九条清规戒律:

1、以正确的DOCTYPE和名字空间开始

XHTML首先需要你声明,你是遵循什么标准建立此文档。如果你的声明和你实际做的事情不相符,就会导致错误、误解的发生。DOCTYPE是一个XML文档的基础,它应该出现在文档的最开头位置。XHTML 1中有三种可能的声明:

  过渡的(Transitional):最宽松的DTD,它能容忍很多老的不良习惯;
  严格的(Strict):有洁癖的DTD,不允许文档使用表现层的标记和属性,如果要给它找一个星座,那它肯定是处女座;
  框架的(Frameset):在使用元素的文档中必须要使用该声明。我对此存有的疑问是,除了针对frameset的特性,这个声明在对待其他元素的标记和属性上,是更象过渡型还是严格型呢?也许后面会有答案。

“名字空间”可能叫命名空间比较合适,对这个部分我也是心存疑虑的:两个附加属性中的语言属性究竟有什么区别,为什么示例中不用utf-8而用en,如果用错会发生什么后果可能这本书不是可以用来解答这个问题的途径,好在我订购的《HTML和XHTML权威指南(第五版)》已经在路上了。

2、使用META内容元素声明你的内容编码语言

生命编码语言有三种方式,就好象孔已己说的“茴”字有四种写法,而常用的只有一个,那就是用meta标签。这在HTML就已经是流行的写法,所以更容易被广大浏览器接受。但是偏偏这种写法却是个“小老婆”,是不被推荐的。大房太太是“XML prolog”以及利用服务器返回http头部设置编码语言两种方法(在书的第132页有提及)。尽管如此,理想也不得不向现实低头,好用的meta标签成了作者推荐的方式。

3、用小写字母写所有元素和属性名称

在XML的规范中,字母的大小写被认为是不同的,这和HTML的懒散形成了对比。所以XHTML要求元素和属性的名字都必须是小写,但属性和内容则不一定。

4、给所有属性值加引号

加引号的规矩也是XML的严谨体现,虽然HTML也是这么要求的,但是他的脾气太好了,即使不加引号,他也会容忍。

5、给所有属性赋一个值

这一截的示例太简单了,所以没有什么有效的信息让我知道什么情况下,按照什么标准加属性和值。难道碰到无属性与值的参数,就复制他本身,然后建立=关系?看起来似乎是这样。

6、关闭所有标签

7、用空格和斜杠关闭空标签

XML的规则:有开始就要有结尾,不要让我猜(看来我n年前看的那篇XML启蒙文章确实很有用)。遇到独立标签就使用“空格加‘/’”的规则,很好记。

8、不要在注释内容中使用“–”

可能“–”符号已经成为注释开始与结束的标记,所以在注释中不能随意出现他们两兄弟,而只能用其他字符,比如用“==”代替。

9、把所有< 和&符号编码

<和&,这两个符号太重要了,如果滥用很容易导致问题。以前我总以为对这两个字符进行编码是为了避免注入问题,原来严格的XHTML也对他们进行了特别对待。 书中对字符编码也做了大致介绍。这类文章我以前也看过,甚至更晦涩的转换编码都看过,没全看明白,大致的是有了个了解。所以作者号称本书最无趣的部分对我来说不算什么。 章节最后本分作者又老调重谈,强调结构的重要以及用CSS进行设计布局。似乎是没什么新义,也许是作者认为有必要在书的任何地方都强调标准的最基本理念。不过有一点倒是引起了我的关注:“用过度的CSS替换HTML表现是不恰当的,这样做只是用另外一种垃圾代替HTML表现代码垃圾。”看来作者对新技术的滥用还是心存忧虑的。

《网站重构》读书笔记7:初识XHTML

“第5章 现代置标语言”解释了为什么使用XHTML,而不是用HTML来标识网页内容。HTML的名声已经被一大群坏习惯的使用者搞臭,并且不是十分严谨的性格也决定了它不能适应严格的标准要求。好地基是好大厦的基础,作为最基础的部分,目前最好的选择莫过于XHTML。虽然XHTML1.1比1.0要更严格,但是这种“严格”会导致一些浏览器和衍生物的消化不良。也许明天是XHTML1.1或者彻底革命的2.0的天下,不过1.0才是目前最合适的,并且在比较长的时间里也会是最佳的选择。

在这一章节里,初步地对XHTML的特性有了一点了解。比如XHTML不处理表现层的东西,虽然你非要使用表现层,也没有人拦着你,但是不要忘记我们辛苦地学习标准是为了什么。

XHTML是以XML为基础的,所以标签有了开始就一定要结束,否则就是错误的。比如
,也将需要对这个标签进行结束处理。

XHTML有着XML天生的好身板,又结合了老HTML的内容,使得需要学习的内容大大减少,所以是目前最适合的置标语言。作者认为学习XHTML对于一个没有经验的人来说是相对容易的,但是对一个已经熟悉HTML的老鸟来说,传统的观念会是一个障碍。到底这个障碍有多大?下一章也许就见分晓了。

《网站重构》读书笔记6:XML作证

“第四章 XML征服世界”。在揭露了危机之后,作者需要给读者一点信心,告诉大家为什么WEB标准是一条阳光大道而不是一条黑暗的羊肠小道。如果不是以前看过“两只老虎”的XML入门文章,我一定会被这一章催眠的。因为XML被作者说得太神奇、太伟大了,但是书中却没有告诉读者为什么XML会如此伟大(也许后面的章节会有提及)。

对于XML,我也是是因为一篇小文看了点小窍,从理论上大致有了个认识。它其实是一个用来制定规范的规范,内容是一些处理机制和运做方式。在这个规范上可以发展出无数的应用。他的伟大之处在于为数据的迁移和格式化提供了一套标准,而这个标准是天生开放的,面对XML的压力,那些死抓着私有数据标准的产品将面对很大的挑战。(但是我还是有些顾虑,这种纯文本的开放数据存储模式,如何面对安全性的需要?难道编码后存储数据?这些疑问还是等以后去解决吧。)

XML这个为WEB制定的标准,如今却在WEB之外红火得不得了,说明了一套开放免费的规范的威力是如何强大。既然XML可以获得如此的成功,那么又有什么理由怀疑其他的WEB标准不可以取得辉煌的成就呢?

作者有一些理论比较有味道。他认为“联合协作,而不仅仅是竞争”是一个行业发展到成熟阶段的标志。很有道理。联合协作说明竞争已经脱离初级阶段的水平,也只有脱离了低水平竞争,才能联合起来做一些有利于行业发展的事情。在谈到GOOGLE和YAHOO开始跟随小竞争者开始使用标准的时候,作者认为:“小家伙们会涉足危险境地,而大家伙们如果确认这样做是安全的话,也会跟随着做。”确实是很妙的比喻。

本章节还嘲讽了FRONTPAGE。虽然是它带我入门,但是自从我发现它有自以为是改代码的小动作,我就开始对它产生了厌恶的情绪。

书中92页,4.6节的第一行有一处错误,CSS1不可能在1966年被建立,而应该是1996年。

在执行标准的过程中,CMS系统是个难点,如果它是不符合标准的,那么网站拥有者就很难保证自己的站点符合标准。不过好在时间又过去了3年,情况应该好很多了。

从下一章节开始,就要开始谈到真正的实务了。这个写书的老外真是非常谨慎,花了全书将近1/3的篇幅来论述重要性,真让人开始觉得受不了。

《网站重构》读书笔记5:技术和商业的博弈

“第三章 推广标准的困难”主要是再次分析了web标准为何在技术上是一回事,而在实际应用中却是另一回事。作者回顾了web浏览器的转型,分析了专业设计人员的现状,为什么标准容易让人失去兴趣,以及一些竞争方式,比如FLASH。

这些问题都是我曾有过的想法或者是很显而易见的问题,看上去象一个领导干部在做总结发言,句句都说在点子上,看人觉得解渴,并且对这些让人迷惘的问题有望得以解决产生了兴趣。

“如果没有工具,许多专业的设计师将无法建立一个基本的网站。”对照这话检查自己,如果用记事本,如果我能把那些模糊的标签确认一下,那么还是能做出一个基本的网站的,只是这样的网站几乎没有存在的意义。不过可以自我安慰的是,90%以上的设计师在这一点上不会做得比我更好。“你不需要手工制造一辆汽车,那为什么你要手工写代码建造网站呢?”

对于商业公司之间的争斗,作者的比喻是“狗咬狗”和“狗买其他的狗公司,目的只为了将它们赶出商业竞争”,回想起ADOBE与MACROMEDIA之间的竞争,不正被作者言中吗?不知道这种犀利的比喻,是否会引起大老板们的不快,我看着是比较过瘾的。

另外针对标准和美观的问题,作者明确了:WEB标准对站点的外观和感觉没有做任何限制,WEB标准只是保证站点为更多的人和更多的平台工作。这话很有道理。就以往的经验看,一个作品是否优秀,主要的其实不是他的载体、手段。比如优秀的音乐,并不在乎演奏他的乐器是什么;优秀的绘画并不在乎他是在岩洞里还是画布上,用的是石块还是画笔;优秀的电影并不在乎是否是黑白还是彩色,是否使用了电脑特技。以这个观点看WEB设计,是否符合标准,并不是能否产生优秀作品的先决条件。就个人的观点看,美观典雅的代码无疑是WEB作品的另一种风韵,只不过这种美只有少数人能体会到。

第一次接触WEB设计是在1997-1998年左右,那个为建行内部网做的小测试,那之前我只知道JPG很牛,没想过GIF其实也很优秀,甚至不知道GIF可以是动态的。看到那个经典的“WELCOME”彩色GIF图标和翻书的GIF图片,甚至真的认为如程序员同事所说,所有动的东西那是需要写脚本才能实现的。那时我找遍了F-PAGE的菜单,也找不出排版的标记,直到靠另存别人的网页才发现:灵活的排版少了表格就无法实现。后来,第一次体会CSS带来的12PX宋体字兴奋不已,但随后发现IE3访问网易会出现字符重叠,给管理员留言,答复是“升级你的浏览器,我们不支持IE3(似乎是ie3.02)”,这简直是个可笑的答案。事情过去这么长时间了,CSS的书我也早有准备,但是一直以来这些新技术都不是那么完善稳定,让人觉得泄气。对DIV标签的认识还只限于dreamweaver早期版本的绝对定位层的应用中,那在我看来是无用的技术。

看书中所介绍的情况看,浏览器和编辑工具已经有很大的进步,似乎现在应该是执行标准的时机了,但愿IE7不要又出现什么非标准的情况。听说它会开始支持没有完全标准化的中文域名,但愿不要把这种独断专行带进WEB页面的解释中来,否则对WEB标准的进展又是一大伤害。

“我们没预算,也没抱太大希望,然而不知道为什么,我们成功了。”作者对web标准组织所做的事情做了这样的表述。也许这就是“水到渠成”的意思吧。

《网站重构》读书笔记4:概念逐渐清晰

“第二章 根据标准设计和制作”主要是例举了一些网站来更详细说明新旧两种方式的差别,用例子说明标准带来了什么好处。

结构与表现及行为相分离是新设计方法的基础。这确实是一个很重要的观点。从这个观点上看,以前普遍认为很酷和眩的“FLASH全站”永远只能是个实验品,它不可能用在普遍性场合,它更象是一个兴趣小组搞出来的为显示技术用的奖杯式作品。

罗马不是一天建成的。用web标准进行工作,瞻前顾后的工作还有很多。书中提出了“过渡型”和“严格型”的概念。看来顽疾也不是一阵风就可以带过的。

看完这章的最大感受就是可怕。一个CSS就看得云里雾里,再加上个XHTML就更昏了,还不用说DOM、脚本……。以前对HTML、XHTML、XML的关系还有点不太清楚,看过了XHTML的代码片段后似乎有点眉目了。XHTML可以说是一个基于XML,用来代替HTML的标准化规范。