浅谈网页设计中DIV+CSS技术应用的优势及缺陷.docVIP

浅谈网页设计中DIV+CSS技术应用的优势及缺陷 摘 要：作为一种重要的网页布局方法技术，DIV+CSS技术对于改善网页的传输速率及网页表现效果具有重要的作用。本文首先对DIV+CSS技术进行概述，然后具体分析了网页设计中DIV+CSS技术应用的优势与缺陷，以期为相关技术与研究人员提供参考。 关键词：网页设计；DIV+CSS技术；应用；优势；缺陷 中图分类号：TP393.092 原有的网页布局设计通常采用表格嵌套内容的方式来完成，此种方式虽在一定程度具有较高的可理解性且通过代码完成，但其也同时存在较多的弊端。而DIV+CSS网页布局技术，能够依据网页设计标准对不同对象进行定位，对采用的CSS创建网站样式与DIV定义网站结构对于促进网页的维护与更新、提高网页传输速率具有重要的推动作用。因此，加强有关网页设计中DIV+CSS技术应用的有关研究，对于改善网页设计的质量具有重要的现实意义。 1 DIV+CSS技术概述 1.1 DIV与CSS简介 （1）DIV技术。DIV元素主要是为HTML文档内容提供背景结构的因素，其能够把文档拆分为具有不同意义的多个模块或区域，模块内容则由DIV的结束标签与开始标签构成，而其所包含元素的性质则由DIV标签的属性来决定；（2）CSS技术。CSS技术是一种网页制作的新技术，其又称为层叠样式表，主要用于调整网页形式且能分离网页内容与样式信息的一类标记性语言。采用CSS技术能够有效分离结构与格式，并提高页面布局的效果，进而生成下载速度快、体积小巧的网页。[1] 1.2 CSS技术的特点 传统的网页缺乏动态效果，且在网页排版布局中存在较多局限，即使是充分利用HTML语言也要经过重复测试采用完善信息排版的过程。而采用CSS技术具有以下特点：（1）有效改善页面布局，采用CSS技术能够从整体上把握HTML语言，且能通过屏幕对图像位置进行有效定位；（2）能够提高图片、文字等内容结构控制的灵活性，促进网页元素的精确定位；（3）CSS样本表无需执行程序、图像、流格式、插件等过程和内容，其只是简单地文本，同HTML指令具有一致的速度性；（4）用户主要感兴趣的是网页的内容结构，若使用户能够更有效的获取这些信息，就必须使用格式控制来进行，采用CSS技术便能够更充分控制页面布局，利用其独立的CSS代码就能控制全面控制页面外观。 2 网页设计中DIV+CSS技术应用的优势与缺陷 2.1 网页设计中DIV+CSS技术应用的优势 （1）与搜索引擎更友好。搜索引擎主要利用Spider程序对内容站点进行查找。Spider程序先从单个或多个简单的页面开始，待这些页面完成扫描后在引入到其他页面，然后再访问Web页面，重复进行扫描直至无新页面索引出现后才停止。采用原有的Table制作网页时其代码数量较多，而搜索引擎工作时需要将多余代码清除，浏览文字相当复杂；而采用DIV+CSS技术，其整体样式都会储存在CSS里，其正文中只存在与ID相关的布恩，这大幅度简化了正文代码与HTML代码，使得正文更加明显，搜索程序在较短的时间内就能完成对页面的扫描，其程序执行效率得到有效改善，这对于提高收录质量具有重要作用。代码简化的网页由于与搜索引擎的友好程度更好，其在搜索引擎中的评比也就会更靠前；[2]（2）更方便网页的维护改版。当采用Table对网页进行改版设计时，需要同时整合全部页面的结构代码，所以其改版效率非常低。而采用CSS技术便能够分离网页中的样式与展示内容，即将网页外观信息从内容中隔离进行集中控制。当需要对网页外观进行改善时则指改变样式中的设定部分，其他部分则无需进行改变；其还能利用早期嵌套在网页中的CSS设置独立储存在文本文件中，技术人员只需利用标记区域内容，从CSS内查找对应的ID便能对页面进行灵活修改，且不会对其他页面布局样式造成破坏；当修改完CSS文件后，剩余的HTML文件可直接进行套用，使技术人员无需对各个HTML文件进行重复设定，这对于减少技术人员工作量、提高页面维护改版的效率具有重要作用；（3）使页面传输速率更快。部分网页设计时为提高网页整体外观效果会使用较多的图片，从而降低网页的传输速率。采用CSS技术能够灵活设定文字样式，同时利用IE内部的滤镜插件，便很容易取代原有图片具有的视觉效果。此种设计方式还能减小页面占用体积，提高下载速率。相比较传统的表格嵌套方式，DIV+CSS技术能够将页面划分成多个区域，在页面开启时能够逐层进行加载，无需像表格嵌套间页面储存在一个较大的表格里，所以页面的传输速率也就更快；（4）具有较高的视觉一致性。在采用Table进行网页制作时，对于不同区域及页面之间的显示效果保真程度不高，且通常网站建设由多人共同给完成，不同的技术人员会按照自身喜好进行网页设计，所以整体网页设计出来的风格杜洋，很难集中到同一个网站中。而