400-685-0732

WJMonitor舆情之声

企业大数据智能舆情监测管理解决方案

全网监测海量数据按需发布监测预警

实时把握舆情动态精准追溯信息源头

获取验证码
企业采购 个人使用
当前位置: 首页 > SEO博客 > 为何DIV+CSS架构比Table要好?

为何DIV+CSS架构比Table要好?

时间:2011-12-16 19:46:58
DIV+CSS的网站结构设计,已经流行和被使用好多年了,那么,对于开发者或爱好者的你来说,能说出一些相对于table结构的好处吗?

在这里,本人通过一些平时项目的经验,来阐述一下DIV+CSS究竟比Table好在哪些地方。

1,高效性。由于网页内容被各个版面布局的样式分割,重新设计展现一个网站就是一个CSS代码的改造问题。你所需要改的,就是将CSS文件更新一下,然后该CSS文件的修改就会在整个网站中得以生效。这样就不需要为了修改一个标签,而在整个网站中一个一个的页面去抠一些细节代码了。因为页面的布局信息存储在CSS中集中进行了管理,这些更改就会很快地传达到整站的各页面中。页面标签也会由于布局信息被逻辑化的组织,因此而很容易被定位。

2,有利于SEO。CSS的使用是否有利于SEO,值得一些人去讨论。有些搜索引擎,比如谷歌,不会告诉你采用了CSS会有哪些好处,但是,由于页面采用了CSS,代码量明显减少了,搜索引擎的蜘蛛在爬取你的页面时,所花地时间明显的减少了,从而有助于多爬取你的网站的页面数。从这个角度来讲,搜索引擎蜘蛛更喜欢精简高效的代码。

3,有利于页面快速加载。采用了DIV+CSS后,你的网站的内容和描绘文本和图片等页面元素的布局、颜色等样式信息就被分离开来,放到了CSS文件中。这样就明显减少了页面的代码量,从来使得页面加载更加迅速。而采用Table来实现一个布局的话,相对于采用DIV+CSS的布局,会多出不少Html代码。通过CSS文件,那些Talbe的标签如td的宽度及对齐信息,会被各个CSS文件修饰过的Div所取代。对于CSS文件来说,处理margin、padding、width及height等可视化的细节信息,简直就是信手拈来,很方便编码实现。Html代码中采用300多个字符来描述的展现信息,通过CSS代码,可能只需要70个字符就轻易的实现了。正式由于CSS消减了大批Html代码,DIV+CSS的网站加载就比基于Table布局的页面更快,所以也客观地吸引了更多用户来访问。

4,保持网站风格的一致性。你只需简单的更改一个CSS,风格就会作用于整个网站,这样也保持了网站的统一性和一致性。这也是一个网站的定位,宽度、高度、边距等信息,为什么被任何指向同一个CSS的Html页面处理成一个同样效果的原因。这样一来,你就提高了网站的可用性,信任度,以及用户体验度的友好性。而开发者利用该特性,可以方便的制作出各种风格的CSS文件,不同的CSS使用产生了不同的效果,达到网站模板化的目的。

5,复杂布局的设计和实现。CSS使得设计者们能取得一些Table达不到的效果。基于Table的代码实现,固定而死板,伸缩性不强,并且是基于网格的,而基于DIV+CSS的代码实现,流畅,灵活,并且扩展性强,从而赋予了设计者们更多的灵感和自由来发挥各自的创造力。例如,CSS允许元素的绝对定位,通过z-index属性,设计者可以方便地将一个元素叠放到另外一个元素之上。CSS的这些特色,让设计者们充满了想象力,借助于此,可以创造出更多复杂而漂亮炫目的布局。

6,节省网络带宽。CSS样式单一般是被浏览器缓存化处理过的,这样一来,多个页面就不需要被重新同样的CSS文件,从而提高了页面速,并降低了网络中数据的传输量。

既然DIV+CSS有这么多好处,何乐而不为呢,还在采用Table的你,为什么还不赶紧呢?

CSS
分享按钮