学习 web标准概念div css

一：了解web标准

1.什么是web标准？
首先要明确一个概念。我们本书讲的web标准，不是指XML，而是指为了实现大量HTML信息向XML标准的过渡，W3C和ECMA制定的一系列的技术规范，目前主要包括XHTML1.0、CSS2.0、DOM1.0和ECMA JavaScrit。web标准不仅仅是一个规范，而是一系列规范的总称。

按这些规范制作的网页，符合XML格式规范，内容与表现相分离，将使你的页面数据在以后可以被分享、交换和重用。

下面，让我们一起了解一些重要的基础知识。如果你已经掌握，可以跳过直接阅读第二节。

2. 什么是w3c？
W3C是“World Wide Web Consortium”的缩写，中文称万维网组织。是一个专注于“领导和发展web技术”的国际工业行业协会。它由万维网发明者Time Berners-Lee领导，成立与1994年。W3C已经有超过500家的会员--包括微软、美国在线(Netscape的母公司)、苹果电脑、Adobe、Macromedia、SUN 以及各类主流硬件、软件制造商和电信公司。学会主要研究由三家学术机构主理--美国麻省理工学院(MIT)、法国的欧洲信息与数学研究论坛(ERCIM)、日本的应庆大学(KEIO)。

W3C主要工作是研究和制定开放的规范(事实上的标准)，以便提高web相关产品的互用性。W3C的推荐规范的制定都是由来自于会员和特别邀请的专家组成的工作组完成。工作组的草案(Drafts)在通过多数相关公司和组织同意后提交给W3C理事会讨论，正式批准后才成为“推荐规范(Recommendations)”发布。更多的信息您可以访问W3C的网站：www.w3.org

3.W3C发布的标准

3.1 HTML4.0
HyperText Markup Language(HTML,超文本标识语言)广泛用于现在的网页，HTML目的是为文档增加结构信息，例如表示标题，

表示段落；浏览器可以解析这些文档的结构，并用相应的表现形式表现出来。例如：浏览器会将...之间的内容用粗体显示。

设计师也可以通过CSS(Cascading Style Sheets)来定义某种结构以什么形式表现出来。

3.2 XML1.0
XML是Extensible Markup Language(可扩展标识语言)的简写。XML类似HTML也是标识语言，不同的地方是：HTML有固定的标签，而XML允许你自己定义自己的标签，甚至允许你通过XML namespaces为一个文档定义多套设定。看一个XML例子：

<addressbook> 
<entry> 
<name>AJIE</name><email>ajie33@hotmail.com</email> 
</entry> 
<entry><name>ALLAN</name><email>neo_n@21cn.com</email> 
</entry> 
<entry><name>YAHOO</name><email>tingpeng@msn.com</email> 
</entry> 
</addressbook> 

一些XML的应用，例如XHTML和MathML,已经成为W3C推荐规范。你同样可以通过样式规范(CSS和XSL)，来定义XML标签的表现形式。XML文档目前还不能直接用浏览器显示，页面展现依然采用HTML或者XHTML，XML现在大多用于服务器与服务器(系统与系统)之间的数据交换。

3.3 CSS2.0
CSS是Cascading Style Sheets层叠样式表的缩写。通过CSS可以控制HTML或者XML标签的表现形式。W3C推荐使用CSS布局方法，使得web更加简单，结构更加清晰。

3.4 XHTML1.0
XHTML实际上就是将HTML根据XML规范重新定义一遍。它的标签与HTML4.0一致，而格式严格遵循XML规范。因此，虽然XHTML与HTML在浏览器中一样显示，但如果你要转换成PDF，那么XHTML会容易的多。

XHTML有三种DTD定义：严格的(strict)，过渡的(Transitional)，框架的(Frameset)。 DTD是Document Type Definition文档类型定义的缩写。它写在XHTML文件的最开始，告诉浏览器这个文档符合什么规范，用什么规范来解析。

3.5 DOM1.0
DOM是Document Object Model文档对象模型的缩写。DOM给了脚本语言(类似ECMAScript)无限发挥的能力。它使脚本语言很容易访问到整个文档的结构、内容和表现。

4 什么是ECMA？
是“European Computer Manufactures Association”的缩写，中文称欧洲计算机制造联合会。是1961年成立的旨在建立统一的电脑操作格式标准--包括程序语言和输入输出的组织。

ECMA位于日内瓦，和ISO(国际标准组织)以及IEC(国际电工标准化机构)总部相邻，主要任务是研究信息和通讯技术方面的标准并发布有关技术报告。ECMA并不是官方机构，而是由主流厂商组成的，他们经常与其他国际组织进行合作。

4.1 ECMA发布的标准 ECMAscript
ECMAscript是基于Netscape javaScript的一种标准脚本语言。它也是一种基于对象的语言，通过DOM可以操作网页上的任何对象。可以增加、删除、移动或者改变对象。使得网页的交互性大大提高。

上述标准是我们目前从HTML向XML过渡时期用到的主要标准，也是本书主要讨论的范畴。

5.web标准的优势

5.1 易用性
用web标准制作的页面，对搜索引擎更加“透明”，因为良好清晰的结构使得搜索引擎能够方便的判断与评估信息，从而建立更精确的索引。按web标准制作的页面也可以在更老版本的浏览器中正常显示基本结构，即使CSS/XSL样式无法解析，它也能显示出完整的信息和结构。

符合web标准的页面也很容易被转换成其他格式文档，例如数据库或者word格式,也容易被移植到新的系统--硬件或者软件系统，比如网络电视、PDA等等。这是XML天生具有的优势。

符合web标准的页面也具有天生的“易用性(accessibility)”,不仅仅是普通浏览器可以阅读，那些有残疾的人们也可以通过盲人浏览器、声音阅读器正常使用。

5.2 向后兼容性
使用web标准建立的页面，将在未来的新浏览器或者新网络设备中很好的工作。我们只要修改CSS或者XSL定制相应的表现形式就可以了。

二：web标准的思考与争论

通过上文的介绍，我们已经初步了解为什么W3C要建立XML标准，为什么各大厂商都愿意支持XML。也了解到为了向XML标准过渡，我们目前阶段需要学习和掌握的web标准有那些，接下来就是具体应用了。但我们发现应用也并不如想像中那样顺利，依然有一堆的困难摆在我们面前：

有99%采用HTML4.0或者更老规范建立的网页需要转换到XHTML；
每天依然有大量的新的页面采用不符合web标准的技术在发布；
缺乏易用的、强大的支持web标准的页面开发软件；
主流浏览器IE对web标准的支持不完善；
大批的设计师需要了解web标准，转变观念；
其中“转变观念”是最重要、也是最难的。许多设计师还不理解web标准，依然在观望甚至反对。这里我们来分析web标准推广过程中遇到的典型问题与争论：

(一)关于web标准
1.web标准并不是“标准”，我为什么要遵守？
的确，web标准并不是标准，它只是W3C制定的推荐规范，W3C并没有强制要求和监督业界去执行。Web标准组织(webstandards.org)为了便于这些规范的推广，才把它们统称为“web标准”。虽然W3C制定的只是“推荐规范”，但它已经是事实上的标准，世界前500家大IT企业会员都认可的规范，你没有理由怀疑它的广泛性和可行性。微软也是W3C的主要会员，它自己通过的规范一定会支持，但出于商业竞争的考虑，微软通常都会做一些细节调整来绑定用户，但这并不影响W3C规范的方向性和权威性。

2.DIV+CSS就是web标准吗？
DIV+CSS只是具体的实现技术手段，并不能涵盖web标准。Web标准不仅仅是HTML向XHTML的转换，更重要的是信息结构清晰、内容与表现相分离，而DIV+CSS技术能较好的实现这种思想。因此，我们看到的多数符合标准的页面都是采用DIV+CSS制作。

(二).关于web标准的好处

1.科技在进步，网络带宽越来越大，速度越来也快，节省那点字节有意义吗？

web标准的好处之一是：用web标准制作的页面代码量小，可以节省带宽。这只是web标准附带的好处，因为DIV的结构本身就比TABLE简单，TABLE布局的层层嵌套造成代码臃肿，文件尺寸膨胀。通常情况下，相同表现的页面用DIV+CSS比用TABLE布局的节省2/3的代码。这是web标准天生的好处。 至于节省带宽的意义并不主要针对普通用户，而主要针对网站经营者，特别是中大型网站，类似新浪、网易这样的站点。一个新闻首页从500K缩小到170k，假设一天的pageview是3000万(保守数字)，那么节省的服务器流量就是330k*30000000=9440G，这个成本的节约是可观的。

2.我需要考虑残障人士（盲人和弱视）吗？

为残障人士提供网络浏览方便是美国及欧洲一些国家的法律规定，由于web标准页面的清晰结构、语义完整，一些相关设备能很容易的正确提取信息给残障人士。因此，方便盲人阅读信息也成为web标准的天生好处之一。至于有人说中国目前还有很多人为解决温饱发愁，哪有时间考虑残障人士。这是社会文明和社会道德问题，不在本书讨论范畴。但如果你页面按web标准制作了，就能达到这个效果，何乐而不为呢？

(三).关于布局

1.web标准就不能用表格了吗？

首先要澄清一个概念：web标准并不是不允许用TABLE标签，TABLE也是XHTML1.0中的标准标签。我们只是提倡用DIV+CSS布局来替代传统的table布局。原因是：原来的TABLE布局将表现和内容混杂在一起，结构不清晰、内容不完整，不利于内容的重用。而且从语义上讲，W3C制定TABLE标签时候只是用它来做表格结构定义的，文档中如果有表格，那么就应该用TABLE。而排版、定位这些表现的东西应该由CSS来控制。

2.我用table布局改版也很方便，你用CSS不一定就比我效率高。

个别情况或者个别项目，有可能象你说的，用table布局改版也很快。但这不是长远之计，我们需要透过现象看本质，web标准将内容与表现相剥离，所有样式、风格、布局等等表现的东西独立出来，由CSS或者XSLT来单独控制，这样的剥离后，改版才是真正的方便。而且“改版”并不仅仅是浏览器上的改版，同样的页面如果我需要发布到手机上，符合web标准的页面就只需要修改样式文件，而table布局的则需要完全重做，未来如果还需要再发布到网络电视上或者其它新设备上呢？CSS的效率一定比table高。

3.用web标准能制作出漂亮的页面吗？

由于一开始研究和推广web标准的人士做得页面都比较“朴素”，因此引起大家的误解，以为web标准的页面就是简洁、轻图形、轻视觉效果的。实际上，用TABLE布局能够实现的页面效果，用CSS也基本上能实现。这个问题不需要多解释，看看国内外新建立的web标准站点就清楚了。

(四).关于浏览器兼容

1.我不需要关心web标准，IE占有99%的市场，我做的页面只要IE能看就可以了。

“以用户为核心”通常都是反对web标准者的档箭牌，实际上这是虚伪的“以用户为核心”。你不能保证IE永远是垄断浏览器市场，你也不能保证IE不做任何改变(事实上，微软的IE7已经开始改善对web标准的支持)。坚持用html+table布局制作的页面将是“死”的信息，不方便搜索，无法重用与共享，从长远来讲，这才是对用户最大的伤害。

2.为什么web标准的页面兼容性并不好？

我们说web标准的优势是兼容性好，这个兼容是指向后兼容，向新浏览器、新设备兼容。对已有的浏览器来说，因为它们对web标准的支持程度不一样，因此会出现不同浏览器下页面变形的情况。我们必须采用一些"hack"技巧来实现不同浏览器的兼容。这是无奈、也是不可避免的，是web技术发展必然要经历的一个过程，是我们向XML过渡必须克服的一个困难。

(五).其它

1.没有好用的开发工具，难道要我手写代码？

是的。我们建议你手写代码，可以促进你更加深刻理解web标准。事实上，很多开发软件已经开始支持web标准。你可以看看最新版的Dreamweaver 8，还有Adobe的Golive，微软的Visual Studio.NET 2005，这些工具都已经很好的支持web标准页面的开发。当新技术出现时，我们的态度应该是去了解、实践和评估，而不是盲目反对或者坐等其成，那样你永远都是落后者。

2.老板不懂，客户也没有要求，我为什么要用web标准？

在自己或者开发团队都不熟悉web标准技术的情况下，新项目采用web标准的确有风险(技术和成本风险)，可以评估后再决定是否采用web标准。但是如果有能力采用标准依然蒙混老板和客户，这就属于职业道德和敬业精神的问题。

三：未来与方向

下一轮的新技术热点在什么方向。其实，要回答这个问题，没有谁比W3C更有权威了。只要看看W3C在做什么，正在研究什么规范就知道WEB的走向和趋势了。

W3C明确地告诉我们：XML是未来的趋势毋庸置疑，开放和共享是互联网的精神和根本动力。

蒂姆.贝纳斯-李（Tim Berners-Lee） ，W3C领导人，万维网之父，说到：XML提供了信息交换的手段，但这仅仅只是开始。我们的目标是web的语义化，即：使得web上的信息内容更加容易理解、更便于交换和共享，RDF和OWL语言将在这方面提供更强大的支持。

web技术即将迎接新一轮的变革和发展，如果你还在犹豫是不是需要学习web标准，那么你将失去这次机会。