老生常谈CSS网页布局的意义与副作用
发布时间：2008-09-12 12:31:00
如今大部分网站仍然采用表格嵌套内容的方式来制作网站，虽然此方法对于我们来说比较熟悉、比较上手；但是，它却阻碍了一种更好的、更有亲和力的、更灵活的，而且功能更强大的网站设计方法——DIV+CSS。
CSS网页布局的意义体现在如下方面：
一、使页面载入得更快
由于将大部分页面代码写在了CSS当中，使得页面体积容量变得更小。相对于表格嵌套的方式，DIV+CSS将页面独立成更多的区域，在打开页面的时候，逐层加载。而不像表格嵌套那样将整个页面圈在一个大表格里，使得加载速度很慢。
二、降低流量费用
页面体积变小，浏览速度变快，这就使得对于某些控制主机流量的网站来说是最大的优势了。
三、修改设计时更有效率
由于使用了DIV+CSS制作方法，在修改页面的时候更加容易省时。根据区域内容标记，到CSS里找到相应的ID，使得修改页面的时候更加方便，也不会破坏页面其他部分的布局样式。
四、保持视觉的一致性
DIV+CSS最重要的优势之一：保持视觉的一致性；以往表格嵌套的制作方法，会使得页面与页面，或者区域与区域之间的显示效果会有偏差。而使用DIV+CSS的制作方法，将所有页面，或所有区域统一用CSS文件控制，就避免了不同区域或不同页面体现出的效果偏差。
五、更好地被搜索引擎收录
由于将大部分的HTML代码和内容样式写入了CSS文件中，这就使得网页中正文部分更为突出明显，便于被搜索引擎采集收录。
六、对浏览者和浏览器更具亲和力
我们都知道网站做出来是给浏览者使用的，对浏览者和浏览器更具亲和力，DIV+CSS在这方面更具优势。由于CSS富含丰富的样式，使页面更加灵活性，它可以根据不同的浏览器，而达到显示效果的统一和不变形。
说了这么多CSS网页布局的意义与优点，同时也不能轻视CSS网页布局的副作用：
一、DIV+CSS尽管不是高不可及，但至少要比表格定位复杂的多，即使对于网站设计高手也很容易出现问题，更不要说初学者了。
二、CSS网站制作的设计元素通常放在1个外部文件中，或几个文件，有可能相当复杂，甚至比较庞大，如果CSS文件调用出现异常，那么整个网站将变得惨不忍睹。
三、虽然说DIV+CSS解决了大部分浏览器兼容问题，但是也有在部分浏览器中使用出现异常，比如火狐浏览器，在IE中显示正常的页面，到了火狐浏览器中可能会面目全非。当然这应该是浏览器的问题，但是可以说在目前来看，DIV+CSS还没有实现所有浏览器的统一兼容。
四、DIV+CSS对搜索引擎优化与否,取决于网页设计的专业水平,而不是DIV+CSS本身。
DIV+CSS网页设计并不能保证网页对搜索引擎的优化，甚至不能保证一定比HTML网站有更简洁的代码设计，何况搜索引擎对于网页的收录和排序显然不是以是否采用表格和CSS定位来衡量，这就是为什么很多传统表格布局制作的网站在搜索结果中的排序靠前，而很多使用CSS及web标准制作的网页排名依然靠后的原因。因为对于搜索引擎而言，网站结构、内容、相关网站链接等因素始终是网站优化最重要的指标。
0
投稿猜你喜欢
- 照片尺寸 单位：cm1X1.5 (1寸) 2.6*3.9 一寸2.5*3.5 1.5X2 (2寸) 3.8*
- MySQL由于它本身的小巧和操作的高效, 在数据库应用中越来越多的被采用.我在开发一个P2P应用的时候曾经使用MySQL来保存P2P节点,由
- Q0.创建用户【前提】 你必须有CREATE USER系统权限。当你使用CREATE USER语句创建一
- 基于ASP技术开发Internet/Intranet上的MIS系统是非常方便的，首先是它借用了ADO技术和概念，同时
- ASCII(str) 返回字符串str的第一个字符的ASCII值(str是空串时返回0)mysql> select ASCII(
- 在开发过程中，有时遇到由于缓存问题导致页面不能及时更新，有时页面引入了不必需的样式脚本文件，有时由于文件太多，字节过大导致页面的性能缓慢，为
- 在学会了SELECT语句的构造和用途之后你就该学习如何使用它了。在你所掌握的数据库工具下，这可能意味着你得按下某个写着“执行”字样的按钮。在
翻译说明：这是Solid State Group网站上的一篇很友好的文章，解决了我在设计中遇到的很多问题，故在此我翻译其文，并对原作者表示非- SPAN 和 DIV 的区别在于，DIV(division)是一个块级元素，可以包含段落、标题、表格，乃至诸如章节、摘要和备注等。而SPAN
- 不知道用ASP写代码的朋友是不是和我有一样的感受，ASP中最头疼的就是调试程序的时候不方便，我想可能很多朋友都会用这样的方法&ldq
- Ajax 技术改变了大型商业 Web 应用程序的外观，但是许多较小的 Web 站点都不具备足够的资源重新构建完整的用户界面（UI）。Ajax
- 1. 不使用全局变量，适当封装2. 兼容性还行～～3. 代码短，可读性凑合～～呵呵～～～～～a. 拖动效果，16行JS<!DOCTYP
- 简介如果你经常网上冲浪，这样参差不齐的多栏布局，是不是很眼熟啊？类似的布局，似乎一夜之间出现在国内外大大小小的网站上，比如 Pinteres
- SQL Server 2005的新功能为动态管理对象，它们是在指定时间返回某个数据库实例的特殊状态信息的数据库视图或函数。这些对象允许数据库
- 随着互联网的飞速发展，很多主页都是越做越漂亮、越来越有个性。如果你是一个资深的网虫不会没有自己的主页吧！下面小弟就来谈谈如何使你的网上“小窝
- 1.设置phpMyAdmin Language:Chinese simplified (zh-utf-8)MySQL 字符集：UTF-8 U
- Window.Open详解 一、window.open()支持环境：JavaScript1.0+/JScript1.0+/Nav2
- 支持CSS属性Safari和WebKit实施大子的CSS 2.1规格所界定的万维网联盟（ W3C ） ，以及部分的CSS 3规格。 。这个C
- 背景：pony是公司的首席体验官、首席产品经理。这次在产品峰会上pony将自己平时经验的积累与大家交流，体验较细。这次分享研发管理部，设计中
- 本来在网上有不少关于这方面的文章，可是我找了好久也没看到把（可能我的搜索水平有线把）不过倒是聊天室的很多。如何统计会员再线状态，希望对刚开始
