codetc - 网站开发技术 首页 前端 查看内容

网页为什么使用CSS布局

2014-11-18 19:08| 发布者: CODETC| 查看: 2296| 评论: 0

在WEB2.0标准化设计理念广泛普及的今天,基本上大部分网站都采用DIV+CSS制作方法,从实际应用中来看,此种方法绝对好于表格制作页面的方法。虽然表格布局方法相对简单、比较上手;但是,它却阻碍了一种更好的、更有亲和力的、更灵活的,而且功能更强大的网站设计方法——DIV+CSS。

CSS网页布局的意义:

一、使页面载入速度得更快

CSS网页布局中大部分样式代码都会写在了CSS当中,使得页面体积容量变得更小。相对于表格嵌套的方式,DIV+CSS将页面独立成更多的区域,在打开页面的时候,逐层加载。而不像表格嵌套那样将整个页面圈在一个大表格里,整体加载,使得加载速度很慢。

二、降低流量费用

页面体积变小,浏览速度变快,同时可结合脚本语言对页面分块加载,这就使得对于某些控制主机流量的网站来说是最大的优势了。

三、修改设计时效率更高

由于使用了DIV+CSS制作方法,在修改页面的时候更加容易、省时。根据区域内容标记,到CSS里找到相应的ID,使得修改页面的时候更加方便,也不会破坏页面其他部分的布局样式,而且每个DIV层在需要变更布局位置时也变得异常方便。

四、保持整站视觉的一致性

DIV+CSS最重要的优势之一:保持视觉的一致性;以往表格嵌套的制作方法,会使得页面与页面,或者区域与区域之间的显示效果会有偏差。而使用DIV+CSS的制作方法,将所有页面,或所有区域统一用相同CSS文件控制,就避免了不同区域或不同页面体现出的效果偏差。

五、有利于搜索引擎收录

由于将HTML代码中的大部分样式代码写入了CSS文件中,这就使得网页中正文部分更为突出明显,HTML结构更为简单,雍余代码更少,便于被搜索引擎采集收录。

六、对浏览者和浏览器更具亲和力

网站做出来的最终目的是给浏览者使用,对浏览者和浏览器更具亲和力,DIV+CSS在这方面更具优势。由于CSS富含丰富的样式,使页面更加灵活性,它可以根据不同的浏览器,而达到显示效果的统一和不变形,也可以根据使用者的屏幕尺寸进行适当的网页宽度调整。


尽管CSS网页布局的意义与优点众多,但的确也存在一些副作用:

一、DIV+CSS尽管不是高不可及,但至少要比表格定位复杂的多,即便是对于网站设计高手也很容易出现问题,更不要说初学者了。

二、CSS网站制作的设计元素通常放在1个外部文件中,或几个文件,有可能相当复杂,甚至比较庞大,如果CSS文件调用出现异常,那么整个网站将变得惨不忍睹。

三、虽然说DIV+CSS解决了大部分浏览器兼容问题,但是也有在部分浏览器中使用出现异常,比如火狐浏览器,在IE中显示正常的页面,到了火狐浏览器中可能会面目全非。当然这应该是浏览器的问题,但是可以说在目前来看,DIV+CSS还没有实现所有浏览器的统一兼容,在代码编写过程中,为了兼容各种浏览器,往往要花费更多的功夫。

四、DIV+CSS对搜索引擎优化与否,取决于网页设计的专业水平,而不是DIV+CSS本身。DIV+CSS网页设计并不能保证网页对搜索引擎的优化,何况搜索引擎对于网页的收录和排序显然不是以是否采用表格和CSS定位来衡量。因为对于搜索引擎而言,网站结构、内容、相关网站链接等因素始终是网站优化最重要的指标。

综合以上讨论的DIV+CSS优势和劣势,在网页的开发过程中,能合理的运用各种方式布局显得尤为重要,这需要很长时间的学习和锻炼,而如何将DIV+CSS运用的更好,我觉得这需要通过不断的实践和体检,积累丰富的设计经验,才能很好的掌握这门技术。
文章来源 CODETC,欢迎分享,转载请注明地址: http://www.codetc.com/article-60-1.html

最新评论

 作为游客发表评论,请输入您的昵称

返回顶部