CSS参考手册 第1章 Web标准布局的本质.pdf

第章

Web标准布局的本质

为什么要建立Web标准

什么是Web标准

内容、结构和表现

两种思考方式

Web标准的前景
Web标准网站欣赏

了解Web标准的本质，掌握关于内容、结构和表现的相关知识，学会使用新的思
维方式进行思考，这些是能否成功使用CSS布局页面的关键。在本章将详细讲解Web
标准的本质、Web标准的概念、使用Web标准的好处。本章还将着重介绍使用CSS布

局和传统布局的本质区别，帮助读者建立起全新的网页布局观念。

通过对本章的学习，读者需要重点掌握页面中的内容、结构和表现的概念，了解使
用CSS布局页面的思考方式。

·4·CSS标准网页布局开发指南

1.1为什么要建立Web标准

传统的用网页布局（使用Table进行布局）已经有很长的历史和较成熟的技术规范了。但其存在
很明显的缺点。由于页面的内容和修饰没有分离，导致改版的困难；由于页面代码的语义不明确，导
致数据利用的困难。而使用CSS进行网页布局，分离了结构和表现，所以能成功解决这些问题。

1.1.1建立Web标准的目的

Web标准的目的是解决网站中由于浏览器升级、网站代码臃肿、代码不易用等带来的问题。Web
标准是在W3C（W3C.org万维网联盟）的组织下建立的，其主要目的如下：
因为使用了统一的标准，所以使得更多的网站用户有了最多的利益。
因为实现了结构和表现相分离，所以确保了任何网站文档的长期有效性。
因为简化了代码，所以降低了成本。
因为可以容易地调用不同的样式文件，所以使得网站更容易使用，适合不同用户和网络设备。
因为实现了向后兼容，所以当浏览器版本更新，或者出现新的网络交互设备时，所有应用能够
继续正确执行。

1.1.2使用Web标准的好处

使用Web标准的好处是可以大大缩减页面代码，提高浏览速度，缩减带宽成本。由于其清晰的结
构，能使网页更容易被搜索引擎搜索到。其具体的好处主要体现在以下两个方面。
1．对网站浏览者的好处

由于页面代码量减少，所以文件下载速度更快，同时浏览器显示页面的速度也更快。
由于清晰的语义结构，所以使得内容能被更多的用户所访问。
由于实现了结构和表现相分离，所以内容能被更多的设备（包括手机、打印机等）所访问。
由于样式文件的独立性，所以用户选择自己喜欢的界面变得更容易。
由于可以调用独立的打印样式文件，所以便于页面的打印。

2．对网站拥有者的好处

由于代码变得更简洁和组件用得更少，所以使得维护变得很容易。
由于对带宽要求降低，所以节约了成本。
由于页面结构清晰的语义性，所以使得搜索引擎的搜索变得更容易。
由于实现了结构和表现相分离，所以使得修改页面外观很容易，同时可以不变动页面内容。
由于可以调用不同的样式文件，所以使得提供打印版本变得更容易。
由于清晰合理的页面结构，提高了网站的易用性。

第1章Web标准布局的本质·5·

1.2什么是Web标准

Web标准可以分为3个方面：结构标准语言（主要包括XHTML和XML）、表现标准语言（主要
包括CSS）和行为标准（主要包括对象模型、ECMAScript）等，下面简单介绍这些标准。
1．结构标准语言
结构标准语言包括两个部分：XML和XHTML。其具体区别如下：
XML是TheExtensibleMarkupLanguage的简写，是一种扩展式标识语言。XML设计的目的是对
HTML的补充，它具有强大的扩展性，可以用于网络数据的转换和描述。同时XML具有简洁有效、
易学易用、具有开放的国际化标准、高效可扩充等特点。
XHTML是TheExtensibleHyperTextMarkupLanguage（可扩展标识语言）的缩写。XHML是基于
XML的标识语言，是在HTML4.01的基础上，用XML的规则对其进行扩展建立起来的，它是HTML
向XML的过渡。
2．表现标准语言
CSS是CascadingStyleSheets（层叠样式表）的缩写。目前推荐遵循的是W3C于1998年5月12
日推出的CSS2。CSS标准建立的目的是以CSS进行网页布局，控制网页的表现。CSS标准布局与
XHTML结构语言相结合，可以实现表现与结构相分离，提高网站的使用性和可维护性。
3．行为标准
行为标准也包括两个部分：DOM和ECMAScript，其具体区别如下：
DOM是DocumentObjectModel（文档对象模型）的缩写。W3C建立的W3CDOM是建立网页与
Script或程序语言沟通的桥梁。它实现了访问页面中标准组件的一种标准方法。
ECMAScript是ECMA（EuropeanComputerManufacturersAssoci