网页设计入门.ppt

《网页设计入门.ppt》由会员分享，可在线阅读，更多相关《网页设计入门.ppt（31页珍藏版）》请在得力文库 - 分享文档赚钱的网站上搜索。

1、第第1章章 Web基础知识基础知识主讲：本章要点 Web的概念 Web浏览器和Web服务器 Web的工作原理 网页的基本元素 网站及网站开发技术1.1 Web概述概述 n n1.1.1 web的结构概述的结构概述n n1.1.2 web的工作原理的工作原理 n n1.1.3 web的主要特点的主要特点 1.21.3n n1.1.1 Web的结构概述的结构概述 WWWWWW是是是是World Wide WebWorld Wide Web的缩写，的缩写，的缩写，的缩写，又称为又称为又称为又称为3W3W或或或或WebWeb，中文译为中文译为中文译为中文译为“万维网万维网万维网万维网”。它作为它作为它

2、作为它作为InternetInternet上的新一代用户界面，上的新一代用户界面，上的新一代用户界面，上的新一代用户界面，摒弃了以往纯文本方式的信息交互手段，采用摒弃了以往纯文本方式的信息交互手段，采用摒弃了以往纯文本方式的信息交互手段，采用摒弃了以往纯文本方式的信息交互手段，采用超文本（超文本（超文本（超文本（hypertexthypertext）方式。方式。方式。方式。超文本是一种全局性的信息机构，它将文超文本是一种全局性的信息机构，它将文超文本是一种全局性的信息机构，它将文超文本是一种全局性的信息机构，它将文档中的不同部分通过关键字建立链接，使信息档中的不同部分通过关键字建立链接，使信息

3、档中的不同部分通过关键字建立链接，使信息档中的不同部分通过关键字建立链接，使信息得以以交互方式搜索。得以以交互方式搜索。得以以交互方式搜索。得以以交互方式搜索。当超文本与多媒体在信息浏览环境下结合当超文本与多媒体在信息浏览环境下结合时即称为超媒体。时即称为超媒体。Internet采用超文本和超媒体采用超文本和超媒体的组合方式，将信息的链接扩展至整的组合方式，将信息的链接扩展至整个个Internet上。上。Web就是一种超文就是一种超文本信息系统，它使得文本不再固定在本信息系统，它使得文本不再固定在某一个位置，而是可以从一个位置跳某一个位置，而是可以从一个位置跳转到另外的位置，正是这种多链接性，

4、转到另外的位置，正是这种多链接性，才把它称为才把它称为Web。从用户的观点来看，从用户的观点来看，Web是由一是由一个巨大的全球范围的文档或个巨大的全球范围的文档或Web页面集页面集合组成的，合组成的，Web页面通常简称为页面。页面通常简称为页面。每个页面可包含指向全球任何地方的其他每个页面可包含指向全球任何地方的其他页面的链接，通过单击一个链接，用户可页面的链接，通过单击一个链接，用户可以跟随这个链接，到达它所指向的页面，以跟随这个链接，到达它所指向的页面，这个过程可以无限地重复下去。这个过程可以无限地重复下去。在在Internet上上实实现现Web要要使使用用两两个主要构造模块。个主要构造

5、模块。一是一是Web浏览器浏览器二是二是Web服务器服务器n nWeb浏览器浏览器 浏览器（浏览器（Browse）是用于浏览信息是用于浏览信息的应用程序，其作用是显示的应用程序，其作用是显示Web页面和页面和解释脚本。解释脚本。目前常用的有目前常用的有 Internet Explorer(IE)和和Netscape Navigator。浏览器取回所请求的页面后对它上面浏览器取回所请求的页面后对它上面的文本和格式命令进行解释，并在屏幕的文本和格式命令进行解释，并在屏幕上按正确的格式显示出来。上按正确的格式显示出来。使用IE浏览器打开的清华大学网站首页 从本质上来说，浏览器是一个程序，它能够从本质

6、上来说，浏览器是一个程序，它能够从本质上来说，浏览器是一个程序，它能够从本质上来说，浏览器是一个程序，它能够显示显示显示显示WebWeb页面，也能够捕捉住已显示页面上各个页面，也能够捕捉住已显示页面上各个页面，也能够捕捉住已显示页面上各个页面，也能够捕捉住已显示页面上各个项目的鼠标单击事件。当一个项目被选中时，浏项目的鼠标单击事件。当一个项目被选中时，浏项目的鼠标单击事件。当一个项目被选中时，浏项目的鼠标单击事件。当一个项目被选中时，浏览器跟随此超链接并将所选择的页面取回来。览器跟随此超链接并将所选择的页面取回来。览器跟随此超链接并将所选择的页面取回来。览器跟随此超链接并将所选择的页面取回来。

7、网络中的每一个网络中的每一个网络中的每一个网络中的每一个WebWeb页面都有一个惟一的地页面都有一个惟一的地页面都有一个惟一的地页面都有一个惟一的地址，这个地址称为统一资源定位地址。址，这个地址称为统一资源定位地址。址，这个地址称为统一资源定位地址。址，这个地址称为统一资源定位地址。例如，东南大学网站首页的例如，东南大学网站首页的例如，东南大学网站首页的例如，东南大学网站首页的URLURL为为为为http:/:80/index.asphttp:/:80/index.asp n nWeb服务器服务器 Web服务器（服务器（Web Server）的主要的主要任务是接受用户的请求，然后执行相应的任务

8、是接受用户的请求，然后执行相应的应用程序和数据库的连接，通过应用程序和数据库的连接，通过SQL等方等方式向数据库服务器提出数据处理请求，数式向数据库服务器提出数据处理请求，数据库服务器将数据处理的结果提交给据库服务器将数据处理的结果提交给Web服务器，再由服务器传送到客户机。服务器，再由服务器传送到客户机。（1）Web服务器的选择服务器的选择 选择选择Web服务器时，对性能的选择服务器时，对性能的选择应该立足当前，着眼未来，力求投资发应该立足当前，着眼未来，力求投资发挥出最大的效益。大多数挥出最大的效益。大多数Web服务器主服务器主要是针对某一种操作系统进行优化的，要是针对某一种操作系统进行优

9、化的，所以选择所以选择Web服务器还需要考虑操作系服务器还需要考虑操作系统。统。对于对于Web服务器的性能，要考虑以服务器的性能，要考虑以下几方面：下几方面：响应速度。响应速度。与其他服务器的交互能力。与其他服务器的交互能力。管理的难易程度。管理的难易程度。对应用程序开发的支持程度。对应用程序开发的支持程度。稳定、可靠和安全性。稳定、可靠和安全性。(2)常用常用Web服务器软件简介服务器软件简介 IIS Apache iPlanet Web Servern n网站平台的选取网站平台的选取 对于对于PC服务器，常采用服务器，常采用Windows NT/2000+IIS或或Linux+Apache

10、搭搭配方式；配方式；对于小型机服务器，常采用对于小型机服务器，常采用Solaris+iPlanet Web Server 搭配搭配方式。方式。n n1.1.2 Web的工作原理的工作原理 从本质上讲，Web是基于客户端/服务器的一种体系结构。一般来说，用户的计算机称为客户机，用于提供服务的计算机称为服务器。在Web方式下客户端常用浏览器访问服务器。客户机向服务器发送请求，要求执行某项任务，服务器执行此项任务，并向客户机返回响应 Web工作原理示意图n n1.1.3 Web的主要特点的主要特点（1）Web是一种超文本信息系统。是一种超文本信息系统。（2）Web是一种超媒体分布式系统。是一种超媒体

11、分布式系统。（3）Web与平台无关。与平台无关。（4）Web是分布式的。是分布式的。（5）Web是动态的、交互的。是动态的、交互的。1.2 浏览器浏览器/服务器模式服务器模式 Web浏览器结合多种Script语言(VBScript、JavaScript等)和ActiveX技术，实现了原来需要复杂专用软件才能实现的强大功能，在前端实现一部分事务逻辑，在服务器上实现系统功能的核心部分，这样就简化了系统的开发、维护和使用。1.11.3 在B/S模式中，用户通过浏览器向分布在网络上的许多服务器发出请求，服务器对浏览器的请求进行处理，将用户所需信息返回到浏览器，其余的工作如数据请求、加工、结果返回以及动

12、态网页生成、对数据库的访问和应用程序的执行等全部由Web服务器完成。3B/S模式图1.3 网页与网站网页与网站 n n1.3.1 网页的基本元素网页的基本元素 n n1.3.2 网站及网站开发技术网站及网站开发技术 1.11.2n n1.3.1 网页的基本元素网页的基本元素 网页是通过网页是通过WWW发布的包含文本、声发布的包含文本、声音、图像、动画等多媒体信息的页面，它音、图像、动画等多媒体信息的页面，它是互联网最基本的组成单位，众多的网页是互联网最基本的组成单位，众多的网页有机地结合在一起就组成了网站。网页文有机地结合在一起就组成了网站。网页文件通常是用件通常是用HTML标记语言设计的，其

13、扩标记语言设计的，其扩展名通常为展名通常为.htm或或.html。网页的基本元素 n n1.3.2 网站及网站开发技术网站及网站开发技术 WWW服服务务器器上上相相互互链链接接的的一一系系列列网页组成一个网站。网页组成一个网站。从从广广义义上上说说，网网站站由由硬硬件件与与软软件件两两大大部部分分组组成成。硬硬件件主主要要是是指指服服务务器器(计计算算机机)，软软件件则则指指操操作作系系统统、Web服服务务器器软软件件和和应应用用程程序序(包包括括静静态态和和动动态态网网页页文文件件以以及及数数据据库库)等等;从从狭狭义义上上说说，网网站站指指基基于于Web服务器的应用程序。服务器的应用程序。

14、网站的体系结构示意图 n n网站的工作流程网站的工作流程 客户端通过浏览器来显示数据并实现与客户端通过浏览器来显示数据并实现与客户端通过浏览器来显示数据并实现与客户端通过浏览器来显示数据并实现与服务器的交互。服务器的交互。服务器的交互。服务器的交互。在服务器端由在服务器端由在服务器端由在服务器端由WebWeb服务器通过服务器通过服务器通过服务器通过HTTPHTTP协协协协议与客户端的浏览器交互，议与客户端的浏览器交互，议与客户端的浏览器交互，议与客户端的浏览器交互，WebWeb服务器和应服务器和应服务器和应服务器和应用服务器也使用用服务器也使用用服务器也使用用服务器也使用HTTPHTTP作为它

15、们之间的通信作为它们之间的通信作为它们之间的通信作为它们之间的通信协议，而应用服务器与数据库服务器之间采协议，而应用服务器与数据库服务器之间采协议，而应用服务器与数据库服务器之间采协议，而应用服务器与数据库服务器之间采用标准的机制进行通信。用标准的机制进行通信。用标准的机制进行通信。用标准的机制进行通信。通常通常通常通常WebWeb服务器接受客户端的请求，并服务器接受客户端的请求，并服务器接受客户端的请求，并服务器接受客户端的请求，并根据请求的类型要么直接回复根据请求的类型要么直接回复根据请求的类型要么直接回复根据请求的类型要么直接回复HTMLHTML页面给页面给页面给页面给客户端，要么将请求

16、提交应用服务器处理。客户端，要么将请求提交应用服务器处理。客户端，要么将请求提交应用服务器处理。客户端，要么将请求提交应用服务器处理。应用服务器接受由应用服务器接受由应用服务器接受由应用服务器接受由WebWeb服务器传来的处理请服务器传来的处理请服务器传来的处理请服务器传来的处理请求，并根据需要查询或更新数据库，进行应求，并根据需要查询或更新数据库，进行应求，并根据需要查询或更新数据库，进行应求，并根据需要查询或更新数据库，进行应用逻辑的处理，然后将处理结果传回给用逻辑的处理，然后将处理结果传回给用逻辑的处理，然后将处理结果传回给用逻辑的处理，然后将处理结果传回给WebWeb服务器。服务器。服

17、务器。服务器。数据库服务器实现数据的存取功能，负数据库服务器实现数据的存取功能，负数据库服务器实现数据的存取功能，负数据库服务器实现数据的存取功能，负责数据库的组织并向应用逻辑提供接口。责数据库的组织并向应用逻辑提供接口。责数据库的组织并向应用逻辑提供接口。责数据库的组织并向应用逻辑提供接口。n n网站的服务器端技术网站的服务器端技术 在网站设计过程中，最重要的是服在网站设计过程中，最重要的是服务器端应用程序的开发。通俗地说，就务器端应用程序的开发。通俗地说，就是要在是要在Web服务器上构造动态网页。目服务器上构造动态网页。目前流行的服务器端构造动态网页的技术前流行的服务器端构造动态网页的技术

18、有有ASP、JSP和和PHP等。等。n n网站的客户端技术网站的客户端技术 从从从从InternetInternetInternetInternet诞生开始，客户端技术就在不断诞生开始，客户端技术就在不断诞生开始，客户端技术就在不断诞生开始，客户端技术就在不断地发展，从最早的地发展，从最早的地发展，从最早的地发展，从最早的HTMLHTMLHTMLHTML到到到到DHTMLDHTMLDHTMLDHTML，到目前最有发到目前最有发到目前最有发到目前最有发展前途的展前途的展前途的展前途的XMLXMLXMLXML技术。客户端技术用于为最终用户技术。客户端技术用于为最终用户技术。客户端技术用于为最终用户技术。客户端技术用于为最终用户构造一个友好的人机界面。构造一个友好的人机界面。构造一个友好的人机界面。构造一个友好的人机界面。（1）HTML（2）DHTML（3）XML