来看看：网站重构：使用CSS改良网站可会见性

你的设计不仅仅用于web浏览器，也可以发布在其他设备上，比如PowerPoint。
比来，我不能不对我的一个客户的旧网站举行更新，使得它可以到达可会见性的尺度。对三四年前的旧代码举行发掘的设法基本没有吸引力，次要是由于我已经利用的良多编程常规已不再合用，出格是从可会见性下去讲。我已经利用相对的字体巨细，流动的页面宽度和表格来做版面计划和空间分派。

像当时建构的良多网站一样，我的客户的网站利用了CascadingStyleSheets(CSS)来格局化文本。它没有利用任何CSS的加倍强无力的版面计划功效，也没有同意HTML设备自力，而这是CSS可会见性的次要长处之一。

成绩是怎样呈现的？

在我概述使网站加倍具有可会见性的办法之前，懂得当今浩瀚的会见性成绩的原因大概是很有匡助的：

对HTML浅薄的了解：在1990年月的互联网年夜开展时代中，一切人都入手下手建构网站。WYSIWYG编纂器使得几近每一个人都能够很简单地建构一个网站，而不必操心往进修HTML。但不幸的是，这类在利用上的便当带来了一些糟糕的代码，对可会见性形成了妨害。

HTML在计划方面的范围性：开辟者和计划者常常会存心错用HTML标签，出格是标签，来克制HTML在版面和计划上的范围性。这类计划体例也会带来妨害可会见性的代码。

甚么使得CSS更具有会见性？

CSS在1996年呈现，用来办理上述的成绩。经由过程利用CSS，你能够将一个HTML文件的内容与有关它的体现情势或作风的信息分别开来。这就使你能够使用正确的格局化并到达想要失掉的版面计划，而无需利用大概会让屏幕浏览器和专门的扫瞄器软件发生狐疑的HTML代码。

比方，固然HTML表格是用来分列表格局数据的，但他们也常常被用来分列对齐一个页面上的元素的。可是浏览器和比方语音分解器的软件请求无效的HTML代码。因而当他们碰到一个页面毛病地利用了诸如一个表格的元素，发生的了局就会让利用者感应稀里糊涂。

CSS的另外一个可会见性的长处就是它同意利用者界说他们本人的作风单，这个作风单能够与网站的作风单配合事情。因而，比方一个利用者能够设定，一切经由过程<P>标签订义的文本都应当是1.5emArial，即便这个网站的作风单暗示它应当是18pxVerdanaBold。

要注重用户界说的作风只要在用户的作风称号与HTML页面中的标签符合时才会起感化，这是很主要的。这就将确保兼容性的义务交到了开辟者的手中。比方，假如用户的作风单指定<P>标签应显现1.5emArial文本，可是HTML页面其实不利用<P>标签来从作风单中挪用一个作风（大概它利用），用户关于标签订义的作风将会被疏忽。因而要确保你对你的题目和段落利用尺度的HTML标签，这将削减用户界说的作风单被疏忽的时机。

入手下手

假如你是重新入手下手建构一个新的网站，那末经由过程CSS来改良可会见性就会很简单。但你仍旧能够轻松地将现有的网站变化为CSS情势。

步骤1：反省现有代码

为了更好地申明，我将用在表A中这个复杂的HTML代码来代表一个利用CSS的页面。这个例子假定页面还没有利用CSS，不外你也能够利用类似的办法来评价一个基于CSS的站点。次要的分歧点就是年夜多半的改动将产生在CSS文件中而不是HTML文件中。

步骤2：从HTML中往失落一切特别作风标签

要在这个页面中到场CSS，我起首必要往失落一切要把持内容体现的标签。样本代码利用了字体标签来界说字体表面，作风和色彩。往失落这些元素使得样本代码如表B所示。

步骤3：从HTML中往失落并交换任何错用的标签

如今我要往失落任何错用的HTML标签。在样本代码当中，一个表格用来在页面的内容创立一个15象素的边沿，代码还利用标签来创立段落。

在我往失落表格和标签以后，我将他们交换为得当的标签。比方，我对页面题目利用标签，用标签来显现段落。利用这些尺度HTML标签使得以后的CSS的使用变得十分简单，并且与用户界说的作风单加倍兼容。如今的样本代码如表C所示。

步骤4：建构一个CSS文件来掩盖作风信息

如今我已从HTML文件中往失落了一切作风信息，我必要将这些信息转移至一个CSS文件中。CSS文件仅仅是一个存为.css扩大名的文本文件，因而它能够在任何一个文本编纂器中举行创立。我利用的是DreamweaverMX。

为了使在HTML中使用CSS文件变得简单，我利用了名为p和h2的作风来对应尺度HTML标签。我利用了可变的字体巨细，使得用户能够轻松地在扫瞄器中增年夜或减少字体巨细。利用相对巨细能够避免扫瞄器对字体举行巨细的调剂（除Netscape6或今后的版本以外，它将不思索相对字体巨细）。我还在必要的中央指定了字体的品种，分量和色彩。

要从头发生由HTML标志代码创立的版面，我必要将和标签设置宽度为780象素。但是，因为我们的目标是将可会见性最年夜化，因而我将往失落宽度设置使得页面能切合扫瞄器窗口的巨细。并且我将让HTML页面利用扫瞄器的缺省边沿，而不是用原始代码的标签来从头创立15象素的空缺，这也使得别的比方打印机等的设备来利用它的缺省边沿设置。

表D显现了我创立的CSS文件。我将它定名为Mystylesheet.css并将它安排在网站根目次下的一个作风文件夹当中。

步骤5：在HTML文件上附加新的作风单

在创立了CSS文件以后，我在HTML文件中拔出了它的作风。由于HTML文件已包含了一切在CSS文件中援用的标签(和)，以是我只必要毗连到HTML文件头部的作风单上就能够了。HTML文件从CSS文件中取得作风并将他们使用到和标签傍边。

步骤6：考证代码

全部历程的最初一个步骤就是考证HTML代码的可会见性。假如你关于CSS来讲是个老手的话，你最好对CSS代码也举行考证。有良多种的工具都能够帮你对两者举行考证。

我利用DreamweaverMX来反省我的样本代码的可会见性。你能够经由过程在文件菜单当选择CheckPage然后选择CheckAccessibility来完成。任何毛病或是告诫城市显现出来，还包含呈现地位的行号和对成绩扼要的注释。你能够在DreamweaverMX的Reference工具中找到更多关于这些毛病和告诫的内容。你只需从Dreamweaver的Windows菜单当选择Reference然后从Book菜单当选择UsableNetAccessibilityReference就能够了。

别的，WorldWideWebConsortium(W3C)供应了凌驾30个的可会见性评价工具的链接。W3C还供应了针对HTML和CSS的基于Web的收费考证器。

可会见性和复杂的办理

固然这里给出的例子是很复杂的，但它申明了使用CSS使你的站点加倍具有可会见性长短常简单的。并且，关于CSS的利用不止这一个长处罢了。

基于CSS的网站要比仅仅只要HTML的网站要好办理很多。CSS文件中的作风上的变更能够使用到全部网站中而不必要改动网站中任何的HTML文件。并且CSS的利用减少了每个HTML文件的全体文件巨细，由于一切的作风信息都存储在了CSS文件当中。

因而假如你想要改良可会见性的话，将其视为一个时机，而不是一个停滞。要懂得更多关于CSS和可会见性的内容，你能够往看一看WorldWideWebConsortium中的WebAccessibilityInitiative(WAI)。

层叠样式表（CascadingStyleSheets）的缩写，用于定义HTML元素的显示形式，是W3C推出的格式化网页内容的标准技术。网页设计者必须掌握的技术之一。

技术的学习如同长跑。只要越过极限，就会越跑越轻松。技术的学习其实并不像想象中那么可怕，任何技术都并不高深莫测。

HTML技术的不断发展和完善，随之而产生了众多网页编辑器，从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器（则原始代码编辑器）

使用所见即所得的接口，亦有HTML编辑的功能。它现在有Mac和Windows系统的版本。原本由Macromedia公司所开发。

dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS，三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。

足见市场的反响和MACROMEDIA公司对它们的自信。说到Dreamweaver8我们应该了解一下网页编辑器的发展过程，随着互联网(Internet) 的家喻户晓。

直接用代码建立链接，如：可以直接输入 <a herf = \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"red.html\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\">红色的网页 12、插入标签法建立链接，可以再选中文字后在代码中插入html标签，页元素<a>.也可以按ctrl+t进入html标签插入方法之后输入代码即可。

滚动条)层属性--溢出(visible/hidden/scroll/auto)

俗话说：兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中，我们难免会遇到各种各样的问题。

足见市场的反响和MACROMEDIA公司对它们的自信。说到Dreamweaver8我们应该了解一下网页编辑器的发展过程，随着互联网(Internet) 的家喻户晓。