标（biāo）签，来克服（fú）HTML在版面和（hé）设计上的局限性。这种（zhǒng）设计方（fāng）式也会带来妨碍可访问性的代码。
什么使（shǐ）得（dé）CSS更具有访问性？
CSS在1996年出（chū）现，用（yòng）来解决上（shàng）述的问题。通过使用CSS，你可以将（jiāng）一个HTML文件的内容与有（yǒu）关（guān）它的表（biǎo）现形（xíng）式（shì）或风格的（de）信息分离开来。这就使你可（kě）以应用准（zhǔn）确（què）的格式化并达到想要得到（dào）的版面设计，而无需使用（yòng）可（kě）能会让（ràng）屏幕阅（yuè）读器和专（zhuān）门的浏览器（qì）软件（jiàn）产生困惑的（de）HTML代码。
例如，虽然HTML表格是用来排列表格（gé）式（shì）数据的（de），但他（tā）们也经常被（bèi）用（yòng）来排列（liè）对齐一个页（yè）面上（shàng）的元素的。但是阅读器和例如（rú）语音合（hé）成（chéng）器的软件要求（qiú）有（yǒu）效（xiào）的HTML代码（mǎ）。因此当他们遇到一个页面错误地（dì）使用了诸如一个表格的元素，产生的结果就会让使用者感（gǎn）到莫名其妙（miào）。
CSS的另（lìng）一个可访问性的优点就（jiù）是它允许使（shǐ）用者定义他们自己（jǐ）的风格单，这个风格单可（kě）以与网站的风格单（dān）共同工作（zuò）。因此，例如一个使用者可以（yǐ）设定，所有通过
标签定义的文（wén）本都应该是1.5em Arial，即使这个网（wǎng）站的（de）风格单表示它应该是18px Verdana Bold。
要注（zhù）意（yì）用户定（dìng）义（yì）的风格只有在用（yòng）户（hù）的风（fēng）格名称与（yǔ）HTML页面中（zhōng）的标签相符（fú）时才会起（qǐ）作用，这（zhè）是很重要的。这就将确保兼（jiān）容性的（de）责任（rèn）交到（dào）了开（kāi）发者的手中。例如，如果（guǒ）用户的风格单指定标（biāo）签应（yīng）显（xiǎn）示1.5em Arial文本，但是（shì）HTML页面并不使用
标签来从（cóng）风格单（dān）中调用（yòng）一个风格（也许（xǔ）它使用），用户对于标签定义（yì）的风格将会被（bèi）忽略。因此要确保你对你（nǐ）的（de）标题和段落使用标（biāo）准的HTML标签，这将减少（shǎo）用户定义的（de）风格单被忽略（luè）的机会。
开始
如果你是（shì）从头开始建（jiàn）构一个新的网站，那么通过CSS来改善可访问性（xìng）就会很容易。但你仍然可以（yǐ）轻松地（dì）将（jiāng）现（xiàn）有的网站转变为CSS形式。
步骤1：检查现有代（dài）码
为了更好地说明，我（wǒ）将用在（zài）表A中这（zhè）个简单的HTML代码来代表（biǎo）一个使用CSS的页面。这（zhè）个例子假设页面还（hái）没有使用CSS，不过你也（yě）可以使用相似的方法来（lái）评价一个基（jī）于CSS的站（zhàn）点（diǎn）。主要的不同点就是（shì）大多（duō）数的改变将（jiāng）发生在（zài）CSS文件中（zhōng）而（ér）不是HTML文（wén）件中。
步骤2：从HTML中去掉所有（yǒu）特殊风格标签
要在这个页面中加入CSS，我（wǒ）首先需要去掉所有要控制内（nèi）容表现的标签。样本代（dài）码使（shǐ）用了字（zì）体标签来（lái）定（dìng）义（yì）字体外观，风格和颜色（sè）。去掉这些元素（sù）使（shǐ）得样本代码（mǎ）如表B所（suǒ）示（shì）。
步骤3：从HTML中去掉并替换任何错用的（de）标签
现在（zài）我要（yào）去掉（diào）任（rèn）何错用的HTML标签。在样本代（dài）码之（zhī）中，一个表格用（yòng）来在页面的内容创建一个15象素的边缘，代码还使用
标签来创建段落。
在（zài）我去掉表（biǎo）格和
标签（qiān）之（zhī）后，我将（jiāng）他们替换（huàn）为适（shì）当（dāng）的标签。例如，我对（duì）页面标（biāo）题使（shǐ）用
标签，用
标签来显（xiǎn）示段（duàn）落。使用这（zhè）些标（biāo）准HTML标签使得之后的CSS的（de）应用变得非常（cháng）容易，而且与（yǔ）用户定（dìng）义的风格单更加兼容。现在的样（yàng）本代码如（rú）表（biǎo）C所（suǒ）示。
步骤4：建构一个CSS文件来覆（fù）盖风格信息
现在我已经从（cóng）HTML文件中去掉（diào）了（le）所有（yǒu）风格信息，我需要将这些信（xìn）息转移至一个CSS文件中。CSS文件仅（jǐn）仅是一个（gè）存（cún）为.css扩展（zhǎn）名的文（wén）本文件，因（yīn）此（cǐ）它可以在任何一个文本（běn）编辑器中进行（háng）创建。我（wǒ）使用的是Dreamweaver MX。
为了使在HTML中应用CSS文件（jiàn）变得（dé）容易（yì），我使用了名为p和h2的风格（gé）来对应标（biāo）准（zhǔn）HTML标签。我使（shǐ）用了可变的字（zì）体大（dà）小，使得用户可以（yǐ）轻松地在浏览器（qì）中增大（dà）或缩小字体大小。使用绝对大小可以防止浏览器对字（zì）体进行大小的调整（除（chú）了Netscape 6或以（yǐ）后的版本之外，它将（jiāng）不考虑绝对字体大小）。我还在需要的地方（fāng）指定了字体的种类，重量（liàng）和颜色（sè）。
要重新产（chǎn）生由HTML标记代码创建的版面，我需要将
和
标（biāo）签设置宽度为780象素。然（rán）而，由于（yú）我们的目的是将可访问性最大（dà）化，因（yīn）此我将去掉宽度设（shè）置（zhì）使得页面能符合浏览器窗口（kǒu）的大小。而且（qiě）我将让HTML页面使用浏览器（qì）的缺省边缘，而（ér）不是用（yòng）原始代码的（de）
标（biāo）签来重新创建15象素的（de）空白，这也使得其它例如打印机等的设备来使用它的缺（quē）省边（biān）缘设置。
表D显示了我（wǒ）创建的CSS文（wén）件（jiàn）。我将它命名为Mystylesheet.css并将它（tā）放置在网站根（gēn）目录下的一（yī）个风格文件夹之（zhī）中（zhōng）。
步（bù）骤5：在HTML文件上附加新的风格单（dān）
在创建了CSS文件（jiàn）之后（hòu），我在HTML文（wén）件中插入了它的风（fēng）格（gé）。因为HTML文件已经包括（kuò）了所（suǒ）有在（zài）CSS文件（jiàn）中引用的标签（qiān）(和
)，所以我只需要连接到HTML文件头部的（de）风格单上就可（kě）以（yǐ）了。HTML文件从CSS文件（jiàn）中获（huò）得风格并将他们应用到
和
标签（qiān）当中，如（rú）表E所示（shì）。
步骤6：验证（zhèng）代码
整个过程的最后一个步骤就（jiù）是验证HTML代码的可访问性。如果你对于CSS来说是（shì）个新（xīn）手的话（huà），你最好（hǎo）对CSS代码也进行验证。有很多种的工具（jù）都可以帮你对二者进（jìn）行验证。
我使用Dreamweaver MX来检查我的（de）样本代码的可访问性。你可以通过在（zài）文件菜（cài）单（dān）中（zhōng）选择Check Page然后（hòu）选择Check Accessibility来实现。任何错误或是警告都会（huì）显示出来（lái），还包括出现位置的（de）行号以及对问题简要的（de）解释（shì）。你可（kě）以在Dreamweaver MX的Reference工具（jù）中找到（dào）更（gèng）多关于这些错（cuò）误和警告（gào）的内容。你只要从Dreamweaver的Windows菜单中选择Reference然后从Book菜单中选择（zé）UsableNet Accessibility Reference就可以了。
此（cǐ）外，World Wide Web Consortium (W3C)提供了超过30个的可访问性评估工具的链接（jiē）。W3C还提供（gòng）了针对HTML和（hé）CSS的（de）基（jī）于（yú）Web的免费验（yàn）证器。
可访问性和简单的管理
虽然这里给（gěi）出的（de）例子是很简单的，但它说明了利用CSS使（shǐ）你的站点更（gèng）加具有可访问性是非常容易的。而且，对于CSS的使（shǐ）用不止这（zhè）一个优点而（ér）已。
基于CSS的网站要比（bǐ）仅仅只有HTML的网站要好管理得多。CSS文件中的风格上的（de）变化可以应用到整个网站（zhàn）中而不需要改（gǎi）变网站中任何的HTML文件。而且CSS的使用（yòng）缩小了每（měi）一个HTML文（wén）件的（de）整（zhěng）体文件大小，因为所有的风格信息都存储在了CSS文件之中（zhōng）。
因此如果（guǒ）你想要改善可访（fǎng）问性的话，将其视为一（yī）个机会，而不是一个障碍。要了解（jiě）更多关于CSS和可访问性（xìng）的内容，你可以去看一看（kàn）World Wide Web Consortium中（zhōng）的（de）Web Accessibility Initiative。
|
