七彩知识堂[网站设计知识]
使用CSS样式表页面下载速度会更快
 我确定几乎每个 Web 设计者和开发者都经历过这样的痛苦时刻:当您小心地布置好页面,完成所有嵌套的表格后,客户要求进行一点“小小的”更改。这小小的更改可能只是“能不能把那个图形稍稍往左移动一点?”,也可能非常富有戏剧性:“我不喜欢这些标题,能把它们的字体弄大一点吗?改字体的时候,顺便把颜色也改了,怎么样?”如果只需要处理有限的几个页面,您可以深吸一口气,花上大半个小时做那些让人恼火的改动。但如果涉及到较大的站点(而这已经很常见),一个简单的更改无论如何也简单不了。
   这样的情形为什么会如此痛苦呢?因为定义页面外观的标记本身就是页面的一部分。要看到实例,您只需到任何站点的任何页面上去数一下 font 和 table 标签的数量。只要您能够从实际页面的流程(或代码)中删除这些标记,或者采用更好的办法,即将其外置,您就可以进行集中更改。而这就是 CSS 所能做的。
   如果使用一个或多个外部样式表,通过修改样式表然后将修改后的版本上载,您就可以将更改应用到站点。
   想象一下,在传统的基于表格的布局中,将站点浏览从页面左侧移到页面右侧将有多么困难。这需要几个小时重复而乏味的工作。但是,如果您选择使用 CSS 的定位属性(通常称作 CSS-P)来设计页面,只需更改外部样式表中的“浮动”或“位置”属性,即可更新页面。而且还有以下附加优势:您更新了站点中使用该样式的所有页面。
   呈现性
   由于宽带的广泛使用,很多开发者已经不再考虑在浏览器中呈现页面所花费的时间。但是,你们应该记住,很多目标用户仍然在使用拨号连接。传统的基于表格的布局是页面下载速度慢的主要原因。因为浏览器从服务器接收页面时,必须首先检查并“理解”一系列复杂的镶嵌式表格。它必须先找到镶嵌在最里面的内容,然后小心地逐步处理代码,直至到达最外层的容器,即 body 标签。完成以上所有过程后,浏览器才能开始在屏幕上呈现内容。
   如果使用 CSS,浏览器从服务器接收内容后,立刻就可以开始呈现过程,因为页面中没有或只有很少的显示标记。
   使用外部样式表还有一个潜在的呈现方面的好处。在传统的基于表格的方法中,浏览器必须检索、分析并单独呈现每个页面。也就是说,浏览器在您的站点上显示第 30 页时耗费的工作和显示第 1 页时一样多。
   但是,如果使用外部样式表进行显示,站点的第一页将提示浏览器将页面使用的已链接样式表文件缓存起来。这意味着站点中所有使用上述样式表的后继页面下载速度会更快,因为浏览器已经缓存了样式表。
   最后一个与呈现有关的优点让我想起电影《莫扎特》。电影中,莫扎特问国王对自己的歌剧有什么看法。国王说很好,但是很沉闷。莫扎特一再追问,国王解释说,问题就在于“音符太多”。Web 设计也可能有同样的问题,当然这里的音符指的是实际 HTML 代码。代码越多,浏览器理解页面所花的时间就越长。
   大家也许都听说过有关官方应用程序的传言,它们编写了非常糟糕的代码,满是复杂的信息,然而文档页面却无法呈现。作为 Dreamweaver 的用户,你们不会遇到这样的问题,但是如果编写了太多代码,你们也会感到内疚。典型的基于表格的设计就是一个很好的例子。
   在设计中使用 CSS 后,您将减少客户需要下载的代码的数量。仅仅减少某些页面中的字体标签就可以大大减少代码的数量。在很多情况下,如果完全使用 CSS-P 进行设计,代码的数量最多可以减少 50% 甚至更多。代码减少就意味着页面下载的速度加快。
 
经典短信推荐
资讯中心 | 电子商务 | 搜索营销 | 设计学院 | 中医养生 | 养生保健 | 节日祝福 | 民俗文化 | 奇闻趣事
建站知识 | 人世百态 | 网站导航 | 传统节日 | 搜索热点 | 星座运势 | 趣闻轶事 | 祝福的话 | 短信大全
© 2023 QicaiSpace.Com