13.1　Web标准与CSS布局

Web标准是网站开发中一系列标准的集合，包括XHTML、XML、CSS、DOM和ECMAScript等。制定这些标准是为了便于维护，代码更简洁，降低带宽的运行成本，更容易被搜索引擎搜索到，改版方便，不需要变动页面内容，提高网站易用性等。

13.1.1　什么是Web标准

Web标准是由W3C和其他标准化组织制定的一套规范集合，Web标准的目的在于创建一个统一的用于Web表现层的技术标准，以便通过不同的浏览器或终端设备向最终用户展示信息内容。

Web标准由一系列规范组成，目前的Web标准主要由三大部分组成：结构（Structure）、表现（Presentation）、行为（Behavior）。真正符合Web标准的网页设计是指能够灵活使用Web标准对Web内容进行结构、表现与行为的分离。

1．结构（Structure）

结构用于对网页中用到的信息进行分类与整理。在结构中用到的技术主要包括HTML、XML和XHTML。

2．表现（Presentation）

表现用于对信息进行版式、颜色、大小等形式的控制。在表现中用到的技术主要是CSS层叠样式表。

3．行为（Behavior）

行为是指文档内部的模型定义及交互行为的编写，用于编写交互式的文档。在行为中用到的技术主要包括DOM和ECMAScript。

DOM（Document Object Model）文档对象模型：DOM是浏览器与内容结构之间沟通的接口，使浏览者可以访问页面上的标准组件。

ECMAScript脚本语言：ECMAScript是标准脚本语言，用于实现具体界面上对象的交互操作。

13.1.2　CSS布局的优势

掌握基于CSS的网页布局方式，是实现Web标准的基础。在制作主页时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其他效果实现更加精确地控制。只要对相应的代码做一些简单的修改，就可以改变网页的外观和格式。采用CSS布局有以下优点：

image01　大大缩减页面代码，提高页面浏览速度，缩减带宽成本。

image01　结构清晰，容易被搜索引擎搜索到。

image01　缩短改版时间，只要简单地修改几个CSS文件就可以重新设计一个有成百上千页面的站点。

image01　强大的字体控制和排版能力。

image01　CSS非常容易编写，可以像写HTML代码一样轻松地编写CSS。

image01　提高易用性，使用CSS可以结构化HTML，如<p>标记只用来控制段落，heading标记只用来控制标题，table标记只用来表现格式化的数据等。

image01　表现和内容相分离，将设计部分分离出来放在一个独立的样式文件中。

image01　更方便搜索引擎的搜索，用只包含结构化内容的HTML代替嵌套的标记，搜索引擎将更有效地搜索到内容。

image01　table布局灵活性不大，只能遵循table、tr、td的格式，而div可以有各种格式。

image01　table布局中，垃圾代码会很多，一些修饰的样式及布局的代码混合在一起，很不直观。而div更能体现样式和结构相分离，结构的重构性强。

image01　在几乎所有的浏览器上都可以使用。

image01　以前一些必须通过图片转换实现的功能，现在只要用CSS就可以轻松实现，从而可以更快地下载页面。

image01　使页面的字体变得更漂亮，更容易编排，使页面真正的赏心悦目。

image01　可以轻松地控制页面的布局。

image01　可以将许多网页的风格格式同时更新，不用再一页一页地更新。可以将站点上所有的网页风格都使用一个CSS文件进行控制，只要修改这个CSS文件中相应的行，那么整个站点中的所有页面都会随之改变。