如何令你的网站“动感十足”

　　您的网站是否仍一如既往地保持“静态”?目前呈几何增长的互联网网站中，有相当一部分仍固守“静态”，无形中已大大落后于时代的步伐。所谓“静态”指的就是网站的网页内容“固定不变”，当用户浏览器通过互联网的HTTP(Hypertext Transport Pr otocol)协议向WEB服务器请求提供网页内容时，服务器仅仅是将原已设计好的静态HTML文档传送给用户浏览器。其页面的内容使用的仅仅是标准的HTML代码，最多再加上流行的GIF89A格式的动态图片，比如产生几只小狗小猫跑来跑去的动画效果。若网站维护者要更新网页的内容，就必须手动地来更新其所有的HTML文档。

　　“静态”网站的致命弱点就是不易维护，为了不断更新网页内容，你必须不断地重复制作HTML文档，随着网站内容和信息量的日益扩增，你就会感到工作量大得出乎想象。

　　你不禁要问：那么什么是动态网站呢?这就是本文将重点讲述的核心，所谓“动态”，并不是指那几个放在网页上的GIF动态图片，在这里笔者为动态页面的概念制定了以下几条规则：

　　1、“交互性”即网页会根据用户的要求和选择而动态改变和响应，将浏览器作为客户端界面，这将是今后WEB发展的大事所趋。

　　2、“自动更新”即无须手动地更新HTML文档，便会自动生成新的页面，可以大大节省工作量。

　　3、“因时因人而变”，即当不同的时间、不同的人访问同一网址时会产生不同的页面，是不是很酷?

　　现在你已经对“动态”网站有了一个基本的概念，接下来应挑选称手的“兵刃”了。将网站“动态”化的方法很多，这要看你是出于何种需求。如果你是个人网站的维护者，使用的是免费主页空间，那么绝大多数情况下你只能使用Java、Java Script和最新的DHTML技术，如果你的主页空间提供者能给予你CGI权限或ASP支持，那么你将能非常幸运地发挥真正的动态技术。关于CGI和ASP技术将在后面的着重讨论，这里针对个人网站仅就最新的DHTML技术进行重点介绍。

　　究竟什么是DHTML?它与传统的HTML有什么不同?DHTML就是当网页从WEB服务器下载后无须再经过服务器的处理，而在浏览器中直接动态地更新网页的内容、排版样式、动画。比如，当鼠标移至文章段落中，段落能够变成蓝色，或者当你点击一个超链后会自动生成一个下拉式的子超链目录。这就是Dynamic HTML(动态HTML)，它是近年来网络飞速发展进程中最振奋人心也是最具实用性的创新之一。它是一种通过各种技术的综合发展而得以实现的概念，这些技术包括Java Script , VB0Script, Document Object Model (文件目标模块)，Layers和Cascading Style Sheets ( CSS样式表)等。非常遗憾的是在网景Netscape和微软IE浏览器几番大战后，我们仍没有得到一个对DHTML支持的统一标准。因此本文在介绍DHTML时不得不分别讲述。让我们先来看看Microsoft IE 4对DHTML的支持：

　　1 .动态内容(Dynamic Content)：动态地更新网页的内容，可"动态"地随时插入、修改、或删除网页的元件，譬如文字、标记等。

　　2 .动态排版样式(Dynamic Styles Sheets)：通过W3C的“Cascading Style Sheets”(串联式排版样式，简称CSS1或CSS)，提供了设定HTML标记的字体大小、字型、粗细、字型样式、行高度、文字颜色、加底线或加中间横线、与边缘距离、靠左右或置中、缩排、背景图片或颜色等排版功能。而“动态排版样式”，可以“动态”地随时地改变排版样式。

　　3 .动态定位(Dynamic Positioning)：通过W 3 C的“Working Draft on Positioning HTML with Cascading Style Sheets”，提供HTML元件在X、Y、Z轴的定位功能，让设计者可以放置影像、控件、文字等在网页上的任何位置上。而放置在不同的Z轴上，设计者就可以产生重叠的效果。

　　4 .内建资料处理(Data Awareness)：无须复杂的程序，无须花费服务器太多资源，即可让网页设计者即时处理文档。

　　5 .内建多媒体支援：IE 4.0结合CSS与内建的ActiveX Controls，提供多媒体支持的功能，包括转换特效、滤镜特效、路径控制、顺序控制、动画、制图、播放声音和影像等多媒体功能。

　　让我们再来看看Netscape Communicator 4.0对DHTML所提供的支持：

　　1 .动态排版样式(Dynamic Styles Sheets)：支援W 3 C的“Cascading Style Sheets”(串联式排版样式，简称CSS1或CSS)、和自创的“Java Script Style Sheets”。

　　2 .Dynamic Layers：提供图文定位、改变图文重叠顺序、控制隐藏或显示图文、移动图文的功能，让您设计出“动画”的效果!

　　3 .Dynamic Fonts：提供由服务器下载字型的功能。可见虽然IE 4.0和Netscape Communicator 4.0都提供了“Dynamic HTML”的支持，但是事实上两者除了对“Cascading Style Sheets”的规格相近外，其余都相差甚远。因此当你设计DHTML页面时必须充分考虑到兼容性的问题，选择称手的“兵刃”和方法对于设计者来说始终是最重要的。有关DHTML的使用方法和设计技巧作者将在第二章《动态网页设计十八般武艺》中仔细讲解，请密切关注。

　　或许对于一个个人网站来说充分运用DHTML技术足以令网页栩栩如生，动感十足。然而对于建立商业网站的企业而言，仅仅拥有DHTML是远远不够的。因为仅仅发生在客户浏览器端的动态效果是无法满足商业网站大量信息查询，客户咨询，资源交互等“动态”需求的。因此作为商业网站的设计者，必须要设计出更具实用性和交互性的“动态”网站。由于绝大多数商业网站都具有大量的数据和信息，而建网的初衷也就是在于方便客户查询企业资料，方便同客户的交流，及时获得信息反馈。那么，就必然会面临如何让使用者在浏览器界面中，通过互联网或内联网(Intranet)查询WEB数据库的资料，甚至输入、更新和删除WEB服务器上的资料。下面笔者就简单介绍几种常用的“动态”网站设计方法：

　　1、CGI(Common Gateway Interface)通用网关接口的传统方式，当用户在浏览器端填好表单(form)要求输入的资料，提出HTTP请求后，WEB服务器端将执行一个表单所设定的可执行的CGI应用程序，CGI程序分析表单(form)中所输入的资料，存取WEB数据库，将查询执行的结果以HTML的格式返回给浏览器。使用CGI方式存取WEB数据库，有很多的缺点，譬如不易开发、变更修改成本高、功能有限、不易侦错、执行速度慢等，而且由于并非整合于HTML文档之中，因此必须使用与HTML完全不同的设计过程来设计一个可执行的应用程序。

　　2、IDC(Internet Database Connector)互联网数据库连接头是Windows NT Server内含Internet Information Server(简称IIS)2.0的特征之一，它提供了一种使你的互联网数据库内容得以发布并可与用户交互的方法，它实际上是一个包含于IIS中的I S A P I应用程序。你只需掌握HTML和SQL的基本知识并写为数不多的代码就能编出具有交互能力的数据库应用程序，让使用者在浏览器界面中得以查询、输入、更新、和删除WEB服务器上的数据资料。正如VB程序员所喜欢的那样，构成IDC应用程序的文件是解释性的，由于设计简易，只要准备两个档案，即可在用户端的浏览器中存取WEB服务器的数据资料，且无须编译，因此具有快速的开发循环和反馈。但这种简单性的代价是牺牲了许多灵活性，使你不得不放弃许多对用户接口的控制，并几乎放弃了所有验证数据的能力。因而I D C仅适用于简单的WEB应用程序。

　　3、ActiveX Data Object(ADO)是WEB数据库应用的最佳选择。

　　ActiveX Data Object(简称ADO)究竟是什么呢?ActiveX Data Object的技术，让您可以与Active Server Pages(简称ASP)结合以建立提供数据资讯的网页内容，只需在网页面中执行Structured Query Language(结构化查询语言，简称SQL)指令，让用户在浏览器界面中输入、更新、和删除WEB服务器上的数据资料。当用户端的浏览器填好表单所要求输入的资料并按下“Submit”按钮后，经过互联网、内联网传送HTTP请求到WEB服务器，该请求在WEB服务器执行一个表单所指定的Active Server Pages程序(后缀名为. ASP的文档)。一个. ASP文档是一个纯文字档，包括：HTML标记(tags)、VBScript或JScript语言的程序代码、ASP语法、和结构化查询语言SQL指令。IIS3.0 / 4.0 WEB服务器执行. ASP文档，通过ODBC驱动程式，连接到支持ODBC的数据库上，执行ASP文档所指定的SQL指令，最后将执行的结果以HTML的格式传送给用户浏览器。ADO具有容易使用、开发执行快速、消耗系统资源较少，和占用磁盘空间小等优点。

　　以上就是目前设计商业网站常用的“动态”技术，由于本人的工作和使用经验，笔者较倾向于ADO和ASP的结合，从长远来看这对搭档也势必成为今后一段时间内“动态”WEB的核心技术。因此在本文第二章《动态网页设计十八般武艺》中，笔者将就ADO和ASP的使用进行展开讲述，敬请期待。