网站技术展望-PPT.ppt

单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,网页设计与制作,*,单击此处编辑母版标题样式,第 十三,章,网站技术展望,本章内容,13.1 HTML,概述,13.2 XHTML,13.3 XML,基础,13.4 DHTML,13.5 CHTML,和,WAP,13.6,动态网站开发技术,2,网页设计与制作,13.1 HTML,概述,蒂姆,伯纳斯李（,Tim Berners-Lee,）爵士是万维网的创始人，也是,Web,发展，,W3C,协调主体的指挥者，他创造了,Internet,上常用的部分,万维网。超文本系统的引进改革了,Internet,的使用方式。,3,网页设计与制作,13.1 HTML,概述,13.1.1 HTML,简史,13.1.2 HTML,的优势,13.1.3 HTML,的缺点,4,网页设计与制作,13.1.1 HTML,简史,HTML,的演变不仅设计标签和属性的改变，其用途的多样化和随之产生的普及程度的增加使得,HTML,的性质从信息资源变成了促销工具。,HTML,并不是依靠某个公司实体演变的。而是很多人共同努力的结果。,HTML 1.0,主要用来制作超文本链接，,1993,年,6,月,由,IETF,组织发布。,HTML 2.0,HTML2.0,于,1995,年,11,月发布，其说明书定义了允许用户显示内联图像和使用交互形式的特征。,HTML 3.0,，,3.2,HTML3.0,与许多浏览器销售商创建的最新,HTML,标签不相容，实现比较困难，最后被放弃了。,1996,年,5,月,7,日，公布了由,W3C,联合,Netscape,、,Microsoft,、,Novell,、,Sun,、,IBM,等大公司共同开发的,HTML 3.2,规范建议。,1997,年,1,月,14,日，,W3C,正式公布了,HTML 3.2,规范。,HTML 4.0,，,4.01,HTML 4.0,1999,年,12,月，公布了,HTML 4.01,的规范建议，其中修正了,HTML4.0,中的许多,Bug,5,网页设计与制作,13.1.2 HTML,的优势,HTML,文档制作不是很复杂，且功能强大，支持不同数据格式的文件镶入，这也是,WWW,盛行的原因之一，其主要特点如下：,1.,简易性，,HTML,版本升级采用超集方式，从而更加灵活方便。,2.,可扩展性，,HTML,语言的广泛应用带来了加强功能，增加标识符等要求，,HTML,采取子类元素的方式，为系统扩展带来保证。,2.,平台无关性。虽然,PC,机大行其道，但使用,MAC,等其他机器的大有人在，,HTML,可以使用在广泛的平台上，这也是,WWW,盛行的另一个原因。,6,网页设计与制作,13.1.3 HTML,的缺点,随着网络的迅猛发展，越来越多的内容移至网上。互联网企业开始在他们浏览器的性能上下功夫，并不断推出新产品。只要网络界喜欢，他们就干。微软公司和网景公司已经开发了被它们的浏览器支持的专有元素，这些被称之为微软和网景的扩展，甚至还为已有的元素添加新的属性。如果事情按先前那么发展下去，,Netscape,和微软将最终产生两种完全独立、毫不相干的,HTML,版本。如果是那样的话，人们将不得不在两种浏览器之间进行选择，内容发展商要么在这两种版本的销售商中选择其一，要么花费更多的人力、物力来创建网页的两种复合版本。,7,网页设计与制作,13.1.3 HTML,的缺点,后来微软借助其,Windows,系统对霸主地位，将,IE,浏览器与,Windows,捆绑销售，一度曾经占据市场主导地位的,Netscape,浏览器遭受了巨大的打击，,IE,成为浏览器市场上的主导产品。随后的反垄断官司闹了,4,年之多，但终究结束了,HTML,技术的不正常发展。,时至今日，网络的发展还残存着这种矛盾的影子，不过已不会再产生当时人们预测的那种可怕局面了。,W3C,的,HTML,部门也改变了研究策略，着手在新推出的浏览器上包容和收纳当前各方的一些实验成果，而不是去设计未来不可理喻的语言版本。,8,网页设计与制作,13.1.3 HTML,的缺点,HTML,发展到今天存在三个主要缺点：,太简单。不能适应现在越多的网络设备和应用的需要。比如手机、,PDA,、信息家电都不能直接显示,HTML,。,太庞大。各浏览器开发商由于,HTML,代码不规范、臃肿，浏览器需要足够智能和庞大才能够正确显示,HTML,。显然在你的,PDA,上装一个,IE6,是不可能的。空间不够，运算也跟不上。,数据与表现混杂。这样你的页面要改变显示，就必须重新制作,HTML,。对不同的网络设备显示同样的数据都需要制作不同的,HTML,。,9,网页设计与制作,13.2 XHTML,13.2.1 XHTML,的优势,13.2.2 XHTML,的语法规范,10,网页设计与制作,13.2.1 XHTML,的优势,由于,HTML,代码不规范、臃肿，浏览器需要足够智能和庞大才能够正确显示,HTML,。随着网络技术对发展，出现了越来越多对网络设备和应用需求。比如：手机、,PDA,、信息家电都不能直接显示,HTML,。因此需要有一种新的语言，能够描述数据使所有的设备都能理解,(,这就产生了,XML),；需要一种语言来控制表现，使数据在不同的设备上都正确显示,(,这就产生了,XSL),。,也就是说，未来我们肯定会使用,XML,来转换数据，使用,XSL,来控制表现。那么现在呢？现在，很明显，原有成千上万的,HTML,页面还需要正常工作，不可能一下抛弃。而且现在的浏览器还不能直接表现,XML,文档。,于是,W3C,又制定了,XHTML,。,XHTML,是,HTML,向,XML,过度的一个桥梁。是一个引导人们逐步走向规范、走向,XML,的过渡方案。,XHTML,虽然有“,X”,但它并不能扩展，只是在,HTML,的基础上严格遵循,XML,规范。它学起来很简单，几乎没有什么新的知识。,而,XSL,呢，现在可以用,CSS,来实现,XSL,的一部分功能。,11,网页设计与制作,13.2.1 XHTML,的优势,XHTML,是由万维网联盟,W3C,制定的一项新标准，它是在,HTML4.0,的基础上产生的，是现在和将来要产生的文档类型和模块的集合。这些文档类型是在,HTML4.0,基础上的扩展、改进或者是其子集的某一部分；,XHTML,是基于,XML,的，其最终将会在基于,XML,的用户代理环境中执行。,只要你小心遵守一些简单规则，就可以设计出既适合,XML,系统，又适合当前大部分,HTML,浏览器的页面。这个意思就是说，你可以立刻设计使用,XML,，而不需要等到人们都使用支持,XML,的浏览器。这个指导方针可以使,web,平滑的过渡到,XML,。,在网站设计方面，,XHTML,可助你去掉表现层代码的恶习，帮助你养成标记校验来测试页面工作的习惯,12,网页设计与制作,13.2.2 XHTML,的语法规范,文件开始必须声明,DTD,1.XHTML 1.0 Strict,2.XHTML 1.0 Transitional,3.XHTML 1.0 Frameset,如果你使用的是,strict.dtd,。也就是最严格的,XHTML,，那么许多定义外观的属性都将不被允许。例如你为图片添加链接的同时想去掉边框。不可以再使用,，而是必须通过,CSS,来实现。,13,网页设计与制作,13.2.2 XHTML,的语法规范,这是粗体和下划线,这是粗体和下划线,XHTML,元素必须是正确嵌套的,14,网页设计与制作,13.2.2 XHTML,的语法规范,This is a paragraph,This is a paragraph,所有的标签和标签的属性都必须小写，属性值可以大写,。,15,网页设计与制作,13.2.2 XHTML,的语法规范,这是第一段,所有的标记都必须要有一个相应的结束标记,在,HTML,中，你可以打开许多标签，而不一定写对应的结束来关闭它们。但在,XHTML,中这是不合法的。,XHTML,要求所有标签必须关闭。如果是单独不成对的标签，在标签最后加一个,/,来关闭它。,16,网页设计与制作,13.2.2 XHTML,的语法规范,在,HTML,中，你可以不需要给属性值加引号，但是在,XHTML,中，它们必须被加引号。如下写法是错误的：,正确的写法为：,所有的属性必须用引号,.,括起来,17,网页设计与制作,13.2.2 XHTML,的语法规范,HTML,中，一些简单对属性可以简化，而在,XHTML,中，完整书写：,错误的：简化属性,正确的：没有简化属性,禁止属性缩写,18,网页设计与制作,表,13-1 HTML,中可以缩写的属性,HTML,XHTML,compact,compact=compact,checked,checked=checked,declare,declare=declare,readonly,readonly,=,readonly,disabled,disabled=disabled,selected,selected=selected,defer,defer=defer,ismap,ismap,=,ismap,nohref,nohref,=,nohref,noshade,noshade,=,noshade,nowrap,nowrap,=,nowrap,multiple,multiple=multiple,noresize,noresize,=,noresize,19,网页设计与制作,13.2.2 XHTML,的语法规范,HTML4.01,中为,a,、,applet,、,frame,、,iframe,、,img,和,map,定义了一个,name,属性，,XHTML,里,name,属性是不能被使用的，需要用,id,来替换。如：,错误代码：,正确的代码：,注意：我们为了使旧浏览器也能正常的执行该内容我们也可以在标签中同时使用,id,和,name,属性。如：,为了适应新的浏览器浏览我们在上述代码中的最后我加了,/,来结束标签。,用,id,属性代替,name,属性,20,网页设计与制作,13.3 XML,基础,13.3.1 XML,的概念,13.3.2,使用,CSS,显示,XML,文档,13.3.3,可扩展样式单语言,XSL,21,网页设计与制作,13.3.1 XML,的概念,XML,和,HTML,同属一个大家族,置标语言家族，因此，为了让大家更好地理解,XML,，我们就首先从,HTML,讲起。,顾名思义，,HTML,的精髓在于“置标”（,Markup,），通俗地讲，就是一种用来给文本添加标记的语言。在,HTML,中，标记就是所谓的“标签”（,tag,），每一个标签都表明了一种显示的格式。它描述了一系列标签，每个标签表明了一定的显示格式。被置标后的文件（即同时包含了纯文本和关于文本显示格式的标签的文件）由一个,HTML,处理工具，譬如一个浏览器，进行读取，然后再根据上述标记规则来加以显示。,22,网页设计与制作,13.3.1 XML,的概念,用,HTML,代码显示一个客户联系信息列表：,张三,用户,ID:001,EMAIL:,zhang,电话,:[phone],地址,:,北京市五街,1234,号,邮编,:100001,李四,ID:002,EMAIL:,libbb.org,电话,:[phone],地址,:,上海市南京路,9876,号,邮编,:200002,23,网页设计与制作,13.3.1 XML,的概念,张三,001,zhang,[phone],北京市五街,1234,号,100001,李四,002,libbb.org,[phone],上海南京路,9876,号,200002,这一段代码是一个非常简单的,XML,文件。看上和,HTML,非常相象，但这里的标签代表的不再是显示格式，而是对于客户信息数据的语意解释。,用,XML,代码描述一个客户联系,:,信息列表,:,24,网页设计与制作,13.3.2,使用,CSS,显示,XML,文档,文件名为：,student.xml,学生花名册,张三,河北,25,65669901,李四,北京,26,82827965,文件名为：,mystyle.css,list,student,font-size:15pt;font-,weight:bold,;,color:blue,;,display:block,;margin-,bottom:5pt;,origin,age,telephone font-,weight:bold,;,font-size:12pt;,display:block,;,color:block,;margin-left:20pt;,name font-,weight:bold,;font-size:14pt;,display:block,;,color:red,;margin-,top:5pt;margin-left:8pt;,25,网页设计与制作,13.3.2,使用,CSS,显示,XML,文档,文件,student.xml,在浏览器中的显示效果为：,26,网页设计与制作,13.3.3,可扩展样式单语言,XSL,可扩展样式单语言,XSL,（,eXtensible,Stylesheet,Languge,），它也是由,W3C,制定的。,XSL,是通过,XML,进行定义的，遵守,XML,的语法规则，本身就是一个,XML,文档。系统可以使用同一个,XML,解释器对,XML,文档及相关的,XSL,文档进行解释处理。而,CSS,则是一种静态的样式描述格式，其本身不遵从,XML,的语法规范。,现在一般所说的,XSL,大都指的是,XSLT,。与,XSLT,一同推出的还有其配套标准,XPath,，这个标准用来描述如何识别、选择、匹配,XML,文档中的各个构成元件，包括元素、属性、文字内容等。,如前所述，,XSLT,主要的功能就是转换，在,XSLT,文档中定义了与,XML,文档中各个逻辑成分相匹配的模板，以及匹配转换方式。限于目前浏览器的支持能力，大多数情况下是转换为一个,HTML,文档进行显示。,27,网页设计与制作,13.3.3,可扩展样式单语言,XSL,mystyle.xsl,文件的代码如下：,学生花名册,.titlefont-size:15pt;font-,weight:bold,;,color:blue,.,namecolor:red,学生花名册,28,网页设计与制作,13.3.3,可扩展样式单语言,XSL,姓名,籍贯,年龄,电话,29,网页设计与制作,13.3.3,可扩展样式单语言,XSL,此时，文件,student.xml,在浏览器中的显示效果为：,30,网页设计与制作,13.4 DHTML,我们经常会发现一些网站页面中的一个重要界面特性,当浏览者将鼠标指针移动到页面导航条上时，会动态地弹出一个菜单，在该菜单中移动鼠标，所指向的菜单项变为红色显示；如果将鼠标指针移出菜单所在范围，则菜单自动隐藏：如果将鼠标指针移动到导航条上另外一个区域，则会弹出另外一个菜单,.,这种效果非常类似于,Windows,应用程序的特性，即通过图形化的界面为用户提供尽可能多的功能。实际上，采用这种方式可以使同一个页面上包含更多的信息，对于许多庞大的站点来说十分有用。,要实现这种效果，单纯依靠,HTML,和,JavaScript,已经无法实现，必须采用新的技术,这就是动态,HTML,。所谓动态,HTML(Dynamic,HTML,，简称,DHTML),，其实并不是一种技术、标准或规范，它只是,HTML,、,CSS,和客户端脚本的一种集成。他通过,HTML,语言，利用,CSS,样式表和脚本语言使一向静止不变的页面得以动起来。,31,网页设计与制作,13.4 DHTML,DHTML,建立在原有技术的基础上，可分为四个方面：,1.HTML,（,XHTML,），也就是页面中的各种页面元素对象，它们是被动态操纵的内容；,2.CSSL,（,Clent,-Side Scripting Language,）客户端脚本，主要有,JavaScript(JS,),，,VBScript(VBS,),，,JScript,。,Netscape,主要支持,JS,，,IE,主要支持,JS,，,VBS,和,JScript,。它实际操纵,WEB,页上的,HTML,和,CSS,。,3.DOM,（,Document Object Model,）指文档对象模型是,W3C,日前极力推广的,WEB,技术标准之一，它将网页中的内容抽象成对象，每个对象拥有各自的属性,(Properties),、方法,(Method),和事件,(Events),，这些都可以通过上面讲到的,CSSL,来进行控制。,IE,和,NS,的对象模型都是以,W3C,的公布的,DOM,为基准，加上自己的,Extended Object(,扩展对象,),来生成的。,4.CSS,，,CSS,属性也是动态操纵的内容，从而获得动态的格式效果，它是,HTML,的辅助设计规范，用来弥补,HTML,在排版上的所受的限制导致的不足，它是,DOM,的一部分。理论上说通过,CSSL,动态地改变,CSS,属性可以做出任何你想要的页面视觉效果。,所以，简单地说，要实现,DHTML,，就是以,HTML,为基础，运用,DOM,将页面元素对象化，利用,CSSL,控制这些对象的,CSS,属性以达到网页的动态视觉效果。,32,网页设计与制作,13.5 CHTML,和,WAP,13.5.1,移动无线网络,13.5.2 CHTML,13.5.3 WAP,33,网页设计与制作,13.5.1,移动无线网络,移动通信技术的发展经历了,1G,、,2G,、,2.5G,、,3G,的过程。其中：,1G,（,First Generation),，表示第一代网络技术，如已经淘汰的模拟移动网；,2G,（,Second Generation,），代表第二代通信技术，其代表为,GSM,技术，即球移动通讯系统（,Global system for Mobile Communications,）；,2.5G,是基于,2G,与,3G,之间的过渡类型。代表为,GPRS,。比,2G,在速度、带宽上有所提高。可使现有,GSM,网络轻易地实现与高速数据分组的简便接入。,3G,（,Third Generation,）表示第三代通信技术，面向高速、宽带数据传输。国际电信联盟（,ITU,）称其为,IMT-2000,（,InternationalMobileTelecom-munication,）。最高可提供,2Mbp/s,的数据传输速率。主流技术为,CDMA,技术，代表有,WCDMA,（欧，日）、,CDMA2000,（美）和,TD,SCDMA,（中）。,其中，,i-Mode,（其中,i,代表,information,）是由日本领先的蜂窝电话营运商,NTT,DoCoMo,，于,1999,年,2,月，推出的移动互联网技术。这种技术使得用户能够通过蜂窝电话使用,Internet,服务，,i-Mode,使用压缩（,Compact,）格式的,HTML,（即,CHTML,）。,CHTML,唯一使用国家是日本。,34,网页设计与制作,13.5.2 CHTML,CHTML,是,HTML 2.0,、,HTML 3.2,和,HTML 4.0,的子集，是设计给小信息量的设备（如：蜂窝电话、,PDA,）使用的。由于,CHTML,是,HTML 4.0,的子集，所以,CHTML,不支持,HTML 4.0,所用的一些网页特征。,CHTML,在有限存储（如：,28-512Kb RAM,和,512K-1Mb ROM,）和低功耗,CPU,（如：,1-10 MIPS,类,CPU,）上实现。支持网络内容在单色小屏幕（如：,50 x30,点阵，,100 x72,点阵或,150 x100,点阵）上阅读。,CHTML,网页的,URL,允许的最大长度是,100bytes,。,i-Mode,支持黑白,2bit GIF,文件，另外，只有,GIF87,、,87a,及,89a,可用，而,GIF,图形最大尺寸是,94x72,点阵。,CHTML,网页的最大允许尺寸不许超过,5KB,，但是对于使用的标记不同，有的网页即使少于,5KB,，也不能正常显示，每页最好少于,2KB,。,CHTML,有四个基本原则：,1.,完全基于目前,HTML W3C,建议。这就是说,CHTML,具有标准,HTML,的灵活性。,2.CHTML,在有限存储和低功耗,CPU,上实现，不支持框图和表格（需大存储量）。,3.,支持网络内容在单色小屏幕上阅读。,4.,用户操作方便，通过结合使用,4,个按钮（向前指针、向后指针、选择、倒退,/,停止），就可以完成一系列基本操作。,35,网页设计与制作,13.5.2 CHTML,CHTML,不支持的主要网络特征有：,JPEG,图像。,表格。,图像地图。,多种字体。,背景颜色。,Image Frame Style,制表。,CHTML,对阅读少量信息设备的要求：,小内存：如,28-512Kb RAM,和,512K-1Mb ROM,；,低功耗,CPU,：如,1-10 MIPS,类,CPU,（用于嵌入式系统）；,小显示器：如,50 x30,点阵，,100 x72,点阵或,150 x100,点阵；,有限颜色：如单色（黑白）；,有限字体：如仅有单一字体；,有限输入方式：如有限控制按钮及数字按钮（,0-9,）,36,网页设计与制作,13.5.3 WAP,WAP,（无线通讯协议）是在数字移动电话、互联网或其他个人数字助理机（,PDA,）、计算机应用乃至未来的信息家电之间进行通讯的全球性开放标准。这一标准的诞生是,WAP,论坛成员努力的结果，,WAP,论坛是在,1997,年,6,月，由诺基亚、爱立信、摩托罗拉和无线星球（,Unwi,redPlanet,）共同组成的。,WAP,能支持,HTHL,和,XML,，但,WML,才是专门为小屏幕和无键盘手持设备服务的语言。,WML,（,Wireless Markup Language,无线标记语言）是以,XML,为基础的标记语言，用在规范窄频设备，如手机、呼叫器等如何显示内容和使用者接口的语言，并可通过,WAP Gateway,直接访问一般的网页。,WAP,也支持,WMLScript,。这种脚本语言类似与,JavaScript,，但对内存和,CPU,的要求更低，因为它基本上没有其他脚本语言所包含的无用功能。,WML,支持文字和图片显示，内容组织上，一个页面为一个,Card,，而一组,Card,则构成一个,Deck,。当使用者向服务器提出浏览要求后，,WML,会将整个,Deck,发送至客户端的浏览器，使用者就可以浏览,Deck,里面所有,Card,的内容，而不需要从网络上单独下载每个,Card,。,通过,WAP,技术，用户可以随时随地利用无线通讯终端来获取互联网上的即时信息或公司网站的资料，真正实现无线上网。它是移动通信与互联网结合的第一阶段性产物。,37,网页设计与制作,13.6,动态网站开发技术,1.ASP,ASP,，英文全称为,Active Server Pages,。是微软早期推出的动态网站开发技术。网站服务器使用,Windows,平台下的,IIS,组件。当一个用户浏览器从,Web,服务器请求一个,ASP,网页时，,Web,服务器会页面文件发送给,ASP,引擎 运算转换成,HTML,代码，然后将所有,HTML,代码发送给用户浏览器。,如下面,ASP,代码,服务器的,ASP,引擎运算后，发送到客户端的,HTML,代码为：,2009-1-25,其中：,2009-1-25,是系统的当前日期。读者请将显示的日期和您的系统时间对照,.,38,网页设计与制作,13.6,动态网站开发技术,2.JSP,JSP(JavaServer,Pages),是由,Sun Microsystems,公司倡导、许多公司参与一起建立的一种动态网页技术标准。由于,Java,语法的开发有很多公司参与，所以,JSP,的服务器产品有多个，如下：,Resin,：,CAUCHO,公司的产品,Tomcat,：免费的、开源的、推荐给初学者使用。,Apache,：免费的、开源的,Web,服务器产品,Weblogic,美国,bea,公司的产品，面向商用。,Websphere,：,IBM,公司开的产品，面向商用。,JBoss,:,免费的，开源的。,39,网页设计与制作,13.6,动态网站开发技术,3.PHP,讲到,PHP,的全名就蛮有趣的，它是一个递归的缩写名称，全称为：,PHP:Hypertext Preprocessor,，全称里面还是缩写。最初称为“,Personal Home Page Tools”,，也称为“,Professional Homepages”,，或者“,Pre-Hypertext Processor”,。,PHP,（,Pre-Hypertext Processor,），是一种开放源代码的脚本编程语言，是一种,HTML,内嵌式的语言,(,类似,IIS,上的,ASP),。而,PHP,独特的语法混合了,C,、,Java,、,Perl,以及,PHP,式的新语法。它可以比,CGI,或者,Perl,更快速的执行动态网页。,PHP,可以用于替代微软的,ASP/VBScript/,JScript,体系、,Sun,微系统公司的,JSP/Java,体系，以及,CGI/,Perl,等。它是一种嵌入,HTML,页面中的脚本语言。,实例代码如下：,Example,40,网页设计与制作,13.6,动态网站开发技术,4.,ASP.net,ASP.net,页面的扩展名为,.,aspx,，开发语言主要使用,C#.NET,、,VB.NET,。,ASP.NET,是微软公司一个跨时代的产品,虽然名称带一个,ASP,但是各方面都是有质的飞跃。,ASP.NET,借鉴了,Java,虚拟机的概念，使用,.NET Framework,构建，运行于实时环境中。它是统一的,Web,开发平台，并提供了数目众多的类库，可以大大加快开发的时间。,其他动态网站开发技术，程序代码和,HTML,代码是混在一个文件中的。,ASP.NET,也能支持将程序代码和,HTML,写在一个文件中，但更推荐的是将程序代码和,HTML,代码分写到不同文件中的做法，极大提高了代码复用性和可维护性。,ASP.NET,的语法在很大程度上与,ASP,兼容，在进行,ASP.NET,开发时，可以同时使用多种不同的程序设计语言，使用多种数据库，比如,MSSQL,、,ACCESS,等，多处理器支持，可以大大提高执行速度。,ASP,和,ASP.NET,可以共用一个,IIS,组件，在未来的,10,年中,ASP.NET,应该会在各种网络开发应用中发挥积极,主要的作用。,41,网页设计与制作,