网页设计中选择哪种方式布局比较好

 一、 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、页面浏览速度较快: 对于同一个页面视觉效果,采用DIV+CSS重构的页面容量要比TABLE编码的页面文件容量小得多,代码相对而言是很少的,浏览器加载的不多,故而速度相对较快。

    4、页面布局灵活:DIV+CSS使得页面布局方便操作灵活,改版时只需改CSS样式即可实现页面重新布局,而不用改动程序,从而降低了网站改版的成本。

    缺点:

    1、可观性差:用户在编辑的时候并不能立即看到编辑效果,需要预览才可看到。

    2、建站繁琐:相对于新手来说,对代码不是很了解,操作起来很是麻烦。

    3、兼容性较差:DIV+CSS设计的网站在IE浏览器里面正常显示,到火狐浏览器中有可能面目全非,故设计时需要把不同浏览器样式都考虑进去。

    以上TABLE与DIV+CSS的对比中我可以得出,用DIV+CSS建设页面要好的多,同时也是网站建设的发展趋势。如果对html语言已经很了解,或者需要进行SEO优化,想做关键词推广,那最好是用DIV+CSS来实现,这样网站的流量和页面浏览速度会快一些。

时间: 2024-09-18 07:59:37

网页设计中选择哪种方式布局比较好的相关文章

网页设计技巧:网页设计中的F式布局

文章描述:今天我们来重点介绍网页设计中的F式布局.传统的布局方式,依赖布置视觉线索,"控制"用户的视觉路径,相较之下,F式布局更加自然,更加友好.本文将讲述一些F式布局的规则.原理以及设计方法. 网页设计中的F式布局 今天我们来重点介绍网页设计中的F式布局.传统的布局方式,依赖布置视觉线索,"控制"用户的视觉路径,相较之下,F式布局更加自然,更加友好.本文将讲述一些F式布局的规则.原理以及设计方法. F式布局简介 F式布局是一种很科学的布局方法,基本原理依据了大量的

网页设计中的F式布局

  今天我们来重点介绍网页设计中的F式布局.传统的布局方式,依赖布置视觉线索,"控制"用户的视觉路径,相较之下,F式布局更加自然,更加友好.本文将讲述一些F式布局的规则.原理以及设计方法. F式布局简介 F式布局是一种很科学的布局方法,基本原理依据了大量的眼动研究.一般来说,用户浏览网页的视觉轨迹是这样的--先看看顶部,然后看看左上角,然后沿着左边缘顺势直下-.而用户往往不太注意右边的信息,这是不是有点像字母F?据此,我们习惯性的把重要元素(诸如品牌Logo,导航,行为召唤控件)放在左

网页设计中图片格式的选择技巧

  网页设计中,切图输出是指设计师将手边绘制完成的原始图稿转换成网页用的图片格式.并交由下一位人员网页排版的重要步骤.选择适合的图片格式不但可以将让设计得到合理的显示效果.甚至还可以有效的控制图档的档案大小,节省下载时间.有效的减少服务器的负担. 以设计师最常用的 Photoshop 以及 Illustrator 为例,都提供了「储存为网页用-」的功能.与默认的存盘模式不同,在这个模式中,软件提供了仿真图文件输出的质量调整.档案大小控制等针对网页图文件需求的选项: 相信许多人都知道网页设计中最常

网页设计中常见的五种交互设计错误

  交互设计从来都不是简单的事情.可靠的交互通常需要借助对用户行为的深入分析,然后有针对性的精心策划.可是随着新的技术和新的交互模式的不断涌现,事情就变得不是那么容易了. 其实大家遭遇的困境都很相似,用户已经很难被单纯炫酷的图片.流畅的悬停效果和出人意料的动效所打动,真正能让他们露出微笑的是持久.令人愉悦的交互设计和用户体验.如果你对于日常的设计中的常见的误区有所了解,自然会有意识地绕过这些坑. 为了更好的设计,我们为你简单总结了一下最常见的5种交互设计的误区. 1.过度的创意 网页设计师绝对不

网页设计中的tab应用的两种类型

当今,网页设计中的tab应用十分普遍,不过一般都脱离不了一下两种类型: 第1种 鼠标单击切换.此种情形下tab是没有链接的(但是在选中的tab区域内增加 更多或者more链接). 第2种 鼠标悬浮切换.此种情况下很多tab都加了链接,所以 a:hover 应该生效,也就是鼠标停靠时有下滑下或颜色等提示.其实这也是Norman设计理念里,对于用户恰当Feedback(反馈)的实践.在实际案例中,我们看到了一些好的设计,也有些我不赞成的设计,这里稍做分享. 案例一:yahoo美国首页,属于第1种ta

网页制作高手进阶:网页设计中的文字运用

设计|网页|网页设计  如今,互联网越来越走近我们的生活,网上冲浪也渐渐成为我们生活不可缺少的一部分.网络世界五彩缤纷,涌现出大量优秀精美的网页.大量网络信息的呈现,无非就是通过文本.图像.Flash动画等,其中, 文本是网页中最为重要的设计元素.对于网页设计初学者而言,了解和掌握网页设计中的文字排版设计就显得尤为重要,下面笔者想谈谈一己之见.     文字的格式化     1.字号.字体.行距字号大小可以用不同的方式来计算,例如磅(Point)或像素(Pixel).因为以像素技术为基础单位打印

网页设计译文:网页设计中数学的运用

"数学是美妙的."对于在数字和公式面前畏缩的人来说,这听起来也许是荒谬的.但是,从最小的贝壳到最大的漩涡星系,自然界和我们这个宇宙中大部分美丽的东西都呈现出数学特性. 其实,古代最伟大的哲学家之一亚里斯多德曾说过:"数学格外地展现了秩序.对称和极限,而这些是美的极致形式". 由于其美丽的天性, 数学一直以来都是艺术和建筑设计的一部分.但它至今还没有在网站设计中发挥作用.其原因可能是因为我们大多认为数学是创造性的对立面.相反,其实数学可以成为创作创意设计的工具.也就是

网页设计:创建整洁有序的内容布局的8个技巧

网页设计中,内容组织恐怕是最至关重要.最影响设计品质的方面了.如何将信息组织到好的布局中,是一个网站的基础,并且应该在考虑外观之前就决定好.没有好的布局,网页信息流就不能正确传递,所有东西都不能建立起合理的联系. 在这篇文章中,我们将讨论八个布局解决方案/技巧,这些方案和技巧将有助于你创建整洁有序的内容布局.这八个技巧包括:滑门(sliders).标签式.渐进布局(progressive layouts).结构网格.模态窗口(modal window).翻转元素.手风琴效果(accordions

网页设计中的极简主义

  由于其永恒的优雅和清晰的内容呈现方式,极简主义一直被视为是Web设计中最持久的视觉框架之一.虽然设计思潮来来去去,但极简主义设计却变得日益经典,它的视觉和设计理念被身处不同专业和行业的设计师共同接受. 作为一种艺术风格,极简主义并非是网页设计独有的,简约设计运动的根源可以追溯至20世纪初.自那时以来,极简主义设计理念一直长盛不衰,仿佛是一种可以经历时间考验的永恒模型. 每个时代的设计师都会发现自己与简约设计的原则多少有些关联,更不用说我们现在这个极简主义爆炸的时代.在这一篇文章中,我们将探讨