DIV与Table两种页面布局方式的优缺点
2014-01-24 12:43
281 查看
一、 TABLE方式
优点:1、简单易用:比较适合入门级的用户操作,用户可直接利用Dreamweaver(以下简写为“DW”)工具栏插入表格,设置长宽、对齐方式、属性等。
2、所见即所得:当用户插入一个TABLE的时候就可立即看到效果。
3、可读性好:语句编写较为简便,主要代码就是<TABLE></TABLE>、<TR></TR>、<TD></TD>等语句。
4.开发速度较快:新建网站时,从DW中直接拖入TABLE比编写DIV要快速很多。
5.兼容性较强:TABLE设计由来已久,得到浏览器的广泛支持,故显示效果很好,不会出现错位情况。
缺点:
1、 代码冗余,<TABLE><TR><TD><TD></TR>< /TABLE>这是构成一个表格的最基本元素(此为一行一列的表格),相对<DIV></DIV>编写来说,代码繁多。
2、网页打开速度较慢:后台代码太多,导致网站打开速度慢。
二、 DIV+CSS方式
优点:1. 标准化的页面结构:DIV+CSS是行业标准,是WEB发展的趋势。
2、代码简洁:<DIV></DIV>较TABLE来说代码精简许多。
3、页面浏览速度较快: 对于同一个页面视觉效果,采用CSS+DIV重构的页面容量要比TABLE编码的页面文件容量小得多,前者一般只有后者的1/2大小。
4、页面布局灵活:DIV+CSS使得页面布局方便操作灵活,改版时只需改CSS样式即可实现页面重新布局,而不用改动程序,从而降低了网站改版的成本。页面效果丰富,包括视觉效果和用户体验比如拖拉。
缺点:
1、可观性差:用户在编辑的时候并不能立即看到编辑效果,需要预览才可看到。
2、操作繁琐:相对于入门级的用户或是对代码不是很了解的人来说,操作起来很是麻烦。
3、兼容性较差:DIV+CSS设计的网站在IE浏览器里面正常显示,到火狐浏览器(FireFox )中有可能面目全非,故设计时需要把不同浏览器样式都考虑进去。
综上所述,其实页面布局采用哪种排版都可以,如果是初入门的新手,需要从TABLE入手,待对html语言有 所了解时再接触DIV+CSS;或者有的客户强调的是网站开发制作的速度,那html语言排版就可以;如果对html语言已经很了解,或者需要进行SEO 优化,想做关键词推广、那最好是用DIV+CSS来实现,这样网站的流量和页面浏览速度会快一些。
相关文章推荐
- DIV与Table两种页面布局
- DIV和table页面布局的区别和联系
- DIV+CSS布局和TABLE布局的优缺点讲解
- 显示和隐藏菜单栏(两种方式div、table)
- 不用table,两种div+css页面元素居中方法
- css页面左中右分栏布局两种方式示例代码
- 使用<frameset><frame/><frame/></frameset> 布局页面 (div+css布局 和frameset布局,两种并列策略)
- Yii 渲染与布局(渲染页面的两种方式)
- 页面布局Table和Div哪个更好
- HTML5 的div与table的两种布局
- table和div在页面布局上应该注意的问题
- 显示和隐藏菜单栏(两种方式div、table)
- HTML中table和div布局的优缺点
- css页面中常见左中右分栏布局的两种实现方式
- 两种方式实现footer固定在页面最下方布局
- div和table页面布局的区别
- html布局方式:div和table
- table和div布局优缺点
- Yii 渲染与布局(渲染页面的两种方式)
- html中DIV+CSS与TABLE布局方式的区别及HTML5新加入的结构标签(转)