《网络应用制作技术》PPT课件.ppt

第八章 网络应用制作技术,本章内容简介,WWW服务的基本概念与应用技术 超媒体与网页 HTML语言与JAVA语言基础 网上信息查找与搜索引擎 Web服务器软件的安装 浏览器程序IE的使用与操作方法和技巧,本 章学习目标,通过本章学习，应掌握和理解如下内容： 掌握超文本、超链接、网页与URL等的基本概念 掌握在Internet上进行信息查找的一般方法 理解HTML语言的基础内容 了解JAVA语言及其特点、JAVA Applet的应用 了解Web服务器软件及其安装方法 浏览器程序IE的使用与操作方法和技巧,4.1 WWW的基本概念,环球信息网 Web服务器与浏览器 统一资源定位器,1、 环球信息网（WWW）,1、WWW（WORLD WIDE WEB，环球信息网） 2、超文本 3、超媒体 4、WWW的基本特点 5、 WWW的应用领域,2、 环球信息网（WWW）,浏览器/服务器 WEB服务器 统一资源定位器（URL：Universal Resource Locater） HTTP（Hyper Text Transport Protocol, 超文本传输协议） IE浏览器,3、 WWW的特点,采用C/S结构，双向数据通信和信息收集 采用TCP/IP协议 能理解HTML语言 通过URL进行文档和资源的访问 允许客户机程序访问各种多媒体信息系统：文字、图象、声音 信息资源丰富：电子百科全书 广域性：跨越国界的信息系统； 交互性：输入查询条件查询 分散性：信息分散存放；动态性：可随时修改,4、WWW的连接,全球信息网、万维网、3W、Web World Wide Web (世界范围蜘蛛网),5、 WWW中的文档,超文本和超媒体（Hypertext&Hypermedia) 超文本 ：是指一种基于计算机的文档，各文档之间互相链接，使信息可以交互查询。采用一种非线形阅读方式 超媒体：是超文本与多媒体的简单组合 浏览器/服务器工作模式（Browser/Server）,6、WWW工作原理,浏览器/服务器(Browser/Server)体系结构,Web Server,Browser,链接请求,网页,HTTP,7、 WWW怎样工作？,Web浏览器访问Web服务器,Web Server,Web Browser,Internet,8、Web 浏览器（Browser),指WWW客户软件，指客户端的WWW浏览程序。 作用 发出用户请求 接收、显示网页 WWW的客户端软件 常用的浏览器 Internet Explorer: IE (Windows) Netscape (Unix, Windows) Mosaic (Unix, Windows) HotJava,用户要访问WWW，必须在它的计算机上运行WWW客户软件。 WWW浏览器软件的执行原理是：将WWW上找到的内容在用户计算机上进行解释和显示。 大多数的浏览器具备访问Internet上其它服务器的功能。 如FTP，Gopher,WAIS等。 有的浏览器还可以自动调用其他应用程序，以显示特殊类型的文挡。,9、 WWW 浏览器软件,10、IE浏览器的界面形式,网页 （WebPage) 主页 (HomePage),11、HTML语言的信息描述方式,超文本 (HyperText) 和超媒体 (HyperMediat),12、HTML语言的描述语言,超文本标记语言HTML:(HyperText Markup Language) 描述、建立超文本文档的语言。, 广州大学 课程设置 系科介绍 重点校外教学基地 ,13、WWW使用的通信协议,超文本传输协议（ HTTP： Hypertext Transport Protocol ）： 用于将WWW服务器的文档传送给浏览器的协议。,HTTP,Server 服务器,Browser 浏览器,数据,14、统一资源定位器URL,Http://index.html,协议名,主机名,文件名,,IP地址：,统一资源定位器 （URL：Universal Resource Locator）,统一资源定位器,URL(Uniform Resource Locator) URL完整地描述了Internet上资源的地址,最多可以包含4个部分, 如： /academic/lesson.html 规则 机器名 文件 定位点 描述Internet上超媒体文档的地址，如： news:/china.news,15、网页地址的格式,统一资源定位器 （URL：Universal Resource Locator）,网页地址的一般格式 :/:/ 例 /academic/lesson.html 2:80/,16、 超链接,从一个网页进入另一个网页 （单击 文字、图形、标记等对象）, 系科介绍 ,17、 Web 服务器（Server),作用 管理信息文档 处理和响应用户请求 返回用户请求 Web Server是驻留在服务器上的一个程序 Server和Browser之间通过HTTP协议进行通讯 最常用的Web服务器 Unix上的CERN和NCSA NT上的Interent Information Server Windows 95/98上的Personal Web Server,18、其他,起始页或主页（Home Page） 通过WWW进行浏览时，一个网址的起始信息页。 网页（Web Page） 在WWW中的每个页面（Web Page),4.2 IE浏览器的使用,安装 界面 配置 使用,1、安装,从IE光盘中或从网络中下载 执行：setup.exe 安装Window 9X/ME/2000/XP时 可包含安装IE 所谓的“捆绑销售”,2、启动IE,菜单栏,工具条,URL地址栏,动态图标,浏 览 界 面,状态栏,3、配置,常规 安全 内容 连接 程序 高级,设置首页,4、使用,菜单操作 工具条操作 地址操作 显示区操作,5、浏览新页面,在知道具体URL地址时 方法一：在“Location”处，输入URL地址， 回车。 方法二：用鼠标单击菜单“File”，单击“Open Location”或单击窗口的“Open”按钮，即进入“Location”画面。 方法三：按ctrl+l 激活 “Open Location”。 不知道具体URL地址时，或要查找某些特定的信息和文件时，可通过网络搜索引擎查找。,6、新建浏览窗口,文件菜单-新建-窗口 可同时浏览多个网址 右击链接点-新建-窗口 打开新窗口浏览链接点，原窗口仍保留,7、收藏夹,添加到收藏夹 收藏 菜单-添加收藏到夹 整理收藏夹,8、保存、打印、邮寄页面,保存 页面保存：单击文件 |另存为 图象保存：右健点击图象|Save image as 打印 文件| Page Setup打印纸张设置； 文件| 打印页面。 邮寄 文件|发送|电子邮件页面 。,文件菜单，包括文件存取和打印功能。 编辑菜单，包括对文本的编辑和查找。 查看菜单，包括重传当前页面和查看当前页面源文件。 工具菜单，包括各种设置和工具 收藏菜单，包括添加、整理收藏夹 帮助菜单，包括Netscape公司通过网络提供的各项帮助服 务。,9、菜单栏,4.2 网页与HTML语言简介,网页及其开发 HTML语言简介 HTML语言的结构,1、什么是HTML,HTML语言是超文本标记语言（Hyperlink Text Markup Language)的缩写。它是一种描述文档结构的语言，HTML语言使用描述性的标记符（称为标签）来规定显示的信息的格式或结构。 用HTML语言写的页面是普通的文本文档（ASCII），不含任何与平台和程序相关的信息，它们可以被任何文本编辑器读取。,2、HTML 语言的特点,HTML特点 文件短小，易于传输和显示 独立于平台，多平台兼容 标记大多采用“双边”，成对出现（前面的为头标“Opening Tag”或开始标记，后面的为尾标“Closing Tag”或结束标记，如This is a title 局限性 标识的限制 格式编排不方便 书写工具:HTML编辑器或其它文本编辑器,2、HTML 语言的特点（续）,是一种超文本标记语言； 是一种介于幕前排版（如WORD）和幕后排版（如WPS）语言之间的一种语言； HTML文件是一个纯ASCII（或纯文本）文件。 HTML文件所描述的各种效果（如字体、字号、颜色、格式、插图、声音、动画等信息），虽然可以用字处理软件编辑，但必须在一特定的浏览器软件下才能观看到。,3、 几个常用术语和约定,Web站点：WWW（万维网）是由许多Web站点（网站）组成，每个Web站点其实就是一组精心设计的Web页面，这些页面都围绕同一个主题，有机的连接在一起，形成一个整体。 Web页或网页：若将WWW看成Internet上的大型图书馆，则每个Web站点就是一本书，每个Web页面就是其中的一张书页，是网络文件的组成部分 主页或首页（Homepage）：按上面的说法，主页就是该书（Web站点）的封面和目录或是整个网站文件的起始页。可从主页进入整个网站文件，开始对网站进行浏览。主页又代表整个网站文件的地址。 网络文件：存放在网络服务器上的完整信息的集合体，包含一个或多个网页。,4、HTML语言的基本框架,组成内容： * 文件的实际文字内容（如字母、数字、空格和标点符号等） * 对该文件的格式和特性进行描述的HTML说明（标记） 常用的标记有： * 文件全部内容 ；表示HTML文件开始与结束，无属性。 * ；Web页面头部标记 ，其中内容一般是整个文件的序言，除显示中的内容外，其它内容均不显示。无属性。,5、HTML的标签,HTML文档由标签和文字组成; 标签是一个用尖括号 括起来的命令词, 标签往往成对出现;不同标签之间可以嵌套，但不能交叉； 文件一般以.htm或.html为扩展名； HTML标签规定Web文档的逻辑结构，并且控制文档的显示格式，大部分HTML标签的形式： 标签名相应内容标签名 标签对大小写不敏感。,6、HTML的基本格式,HTML文档结构分为： - 文件头 - 文件体； 文件头包括文档标题； 文件头和文件体都嵌入在标签中。, . . . . . . ,文档标题,文档的主要内容,7、HTML的基本结构,8、HTML语言的基本框架,Web页面名称 ；用来给Web页面命名。浏览时，这一名称显示在浏览器的标题栏内。每一Web页只能有一个。 Web文件体的内容 ；一定要包含在 标记之内。其中可以包含属性，如：BACKGROUND=“背景图文件名”；BGCOLOR=“XXXX（背景颜色码，X为十六进制数）”；TEXT=“XXXX（文本颜色码）”；LINK=“XXXX（链接颜色码）；VLINK=“XXXX（已访问过的超链接颜色码） ；定义文件中各子标题的等级，以区分不同章节，x=16，即共有6级标题。,8、HTML语言的基本框架（续）, ；定义超链接，其中可包含属性，属性可以为：HREF=“被链接的对象”，被链接对象可以是另一Web页、另一Web站点的主页、或自己的电子邮件地址、或进一步将图作为链接点 ；定义表单并可将用户在浏览器端输入的各种数据传送给Server端的CGI（Common Gateway Interface）程序。其中可包含两种属性：METHOD=“GET/POST（选择表单的传输协议）”，以及ACTION=“表单提交时调用的Server端程序” 。,8、HTML语言的基本框架（续）,除了成对出现的标签外，还有一些是单标记的标签，主要有： ；空行标记。加入P标记后，先空出一行，然后再从下一行继续显示其后的文字。属性有：ALIGN=RIGHT/CENTER/LEFT，分别表示向右/中/左看齐。 ；换行标记。 ；设定显示的图形。其属性有：SRC=图形文件名，ALIGN=LEFT/RIGHT/MIDDLE/TOP/BOTTOM（图形与文字的对齐方式），WIDTH=XXX和HEIGHT=XXX（设定图形的宽度和高度）等。 ；用于记录HTML文件的相关信息，这些信息不会显示在浏览器上。必须放在. 之间。,9、 简单HTML文件介绍-概述,基本概念理解 HTML文件存放在Web服务器的某个目录里 通过WWW浏览器下载HTML文件，并对文件中的标记进行解释（即浏览） 基本成分：标题、段落、列表、表格、图象 简单网页形式： 标题 内容段落（列表、表格、图象等） 内容段落（列表、表格、图象等）,10、 简单HTML文件介绍-构成,基本构成 文件的内容部分 HTML的标志部分 标志书写格式： 文件内容 标识名通常写在内 不区分大小写 也有单向标识：,11、 建立简单的HTML文件,简单示例：“示例一” 四个基本标识 标识 标识 标识 标识,12、 标识,HTML文件起始标识 成对出现 包含文件的全部内容 文件的全部内容 ,13、 标识,网页头部的标识 写在之间的内容，如果又写在“title”标识中，表示该网页的名称，并作为浏览器标题栏的名称，显示在此网页窗口的最上方。如果不写在“title”标识中，则成为正文的头部，显示在文本之前。 “head”标识中的文本应当尽量简练 “示例二”,14、 标识,网页名称标识 在浏览器中作为标题栏名称显示在该窗口的上方。 对bookmarks很有用 一个网页应只有一个网页名称 “title”标识应包含在“head”标识之间 “title”标识内应不含任何其他标识 “title”标识宜短小,15、 标识,“body”标识中放置网页的主体内容 成对出现 文件取名规则： -以htm或html为后缀 -文件名中不可有空格和特殊字符 -在UNIX系统中，注意大小写敏感 -取名保存后，可在浏览器中打开,语言字符集信息标记 ,16、语言字符集信息,17、 文件的子标题,子标题是用来区分内容的不同章节的，浏览时会显示不同的大小字型 HTML定义了六个级别的子标题 书写格式为：广州大学简介 n从1到6，字体越来越小 “示例四”,18、 几个常用的HTML标识,-原样显示文本 -段落标识 - 行中断标识,19、 常用标记小结, -原样显示文本 -段落标识 - 行中断标识,20、 建立超链接,链接到file1 ,被连接文件名及其路径,起始标识,结束标识,使用标识连接一个HTML文件（file1.htm),22、A标签为如下形式：,其中HREF属性域指定了待链接文件名及其路径。使用相对路径 时，以链接所在文件为基准，可以包含上层目录名（用）； 也可以使用绝对路径或URL地址。,下面的例子显示一个链接并在IE中的显示,当你在浏览器中用鼠标单击“主菜单”文字时，就会跳 转到名为menu.html的文件。,回到主菜单,创建链接 链接到另一页面 链接到WEB的文件 链接到文档的指定位置,23、 本地超链接,本地连接 所有连接文件都在本地磁盘上，不必连接网络 本地机上要有浏览器和编辑器 同一目录下的本地连接 只需写文件名，不需写路径 不同目录下的本地连接 必须写明连接文件路径名 路径名的写法：相对路径和绝对路径 相对路径：以当前文件所在路径和字目录为起点，进行相对的文件查找。 绝对路径：以绝对路径名进行文件查找，绝对路径中的盘符后用“|”，而不用“：”,表1：相对路径名及其含义 相对路径名 含义 href=“file.html” 本地当前路径下的文件 href=“files/file.html” 本地当前路径下被称为“files” 的子目录下的名为file.html的文件 href=“file/morefiles/file.html” 当前目录下的file子目录下 的“morefiles”子目录下名为file.html的文件 href=“/file.html” 本地当前目录的上一级子目录下名 file.html的文件 href=“/file.html” 当前目录的上两级子目录下名为 file.html的文件,表2：绝对路径名及其含义 绝对路径名 含义 HREF=“/u1/my/file.html” file.html放在u1目录下的 my子目录下 HREF =“d|/files/file.html” file.html放在D盘的files目录 下的html子目录下 说明：1、路径名书写要遵循UNIX操作系统的格式，路径名与目录名要以“/”分隔。 2、相对路径与绝对路径的选择,24、 网络超链接,your home page ,被连接文件名及其路径,起始标识,结束标识,远程文件的连接,25、Base 标识(基点设置）,与联合使用 单向标识 写在标识之间，并带有一个href属性 格式： 其中url只能写绝对地址 当有 标识时，该文件中所有与标识所指url相同的连接可只写文件名,26、Web上的图象和多媒体,Web上的图像 Web上的多媒体,27、WEB上的图象,Web上的图像的格式有：GIF、JPEG、XBM、TIFF、BMP和PICT。 Web页的图像分成两类： 内嵌图像：在Web页中与文本和链接一起显示，并且当一Web页被获取时自动载入。 外部图像：它是和Web页分开存储的，只有在需要时才被载入。,内嵌图像的标签为（图象1）： IMG SRC=“flower.gif” ALT“a picture of flower” SRC 要被包含的图像的位置和文件名。 ALT 在纯文本浏览器中替换图像的文本。 图象和超链接 点击此图象进入广东广播电视大学主页 这是一个图象连接的例子,28、内嵌图像标签,使用外部图像 图像创建一个链接如下： A HREF=“flowers.gif“flowers Web页的图象背景 可以用BODY标签的BACKGROUND属性来创建拼接图像背景。BACKGROUND的值是图像文件名的URL。 ,29、使用外部图像,30、WEB上的多媒体,所谓Web上的多媒体是指在Web页面上具有声音、视频和滚动文本等信息。同图像一样， Web上的多媒体也分为外部和内嵌两类。 在HTML中使用外部媒体 A HREF=“多媒体文件“A media file HTML语言外部媒体文件的扩展名来确定该文件是否能被使用，因此它们的格式不能写错。,下面列出了常用的声音、视频和其它外部媒体文件的格式： 外部声音文件的格式 .au .aiff，.aif、.wav、.mp3等 外部视频文件的格式 .mprg，.mpg、.mov、.avi等 其他外部文件的格式 .doc、.zip、等,内嵌视频 Internet Explorer支持一种能播放AVI文件的性能，即在IMG标签中增加了DYNSRC属性域，DYNSRC的值为AVI文件的路径或URL。如：IMG DYNSRC=“wolf.avi“ SRC=“wolf.gif“ ALT=“Wolf“ 内嵌声音 ,31、在HTML中使用内嵌媒体,一个滚动式文本就是Web页上从一边滚到另一边的一行文本。 Internet Explorer提供MARQUEE标签可创建一个滚动的文本。并可以用MARQUEE标签的属性来改变它的行为和外观。,32、滚动式文本,网络信息的特点及其分类 搜索引擎 多元搜索引擎 搜索引擎的比较及其发展趋势,4.3 网络信息检索工具,4.3.1 网络信息的特点及其分类,1、网络信息资源的特点 Internet上的信息几乎涵盖了人文科学和自然科学的各个领域。主要有以下基本特点： （1）无限性：内容十分广泛。 （2）丰富多彩：不止局限于文本，还包括图形、视频、动画、声音、图表等。 （3）纷繁无序：提供信息的机构数不胜数，信息格式没有统一规范，信息分散无序，变化更新的速度很快。,4.3.1 网络信息的特点及其分类（续）,1、网络信息资源的特点（续） （4）廉价性：目前网络信息大多数是免费提供的。 （5）新颖性：Internet上提供了获取非出版信息的丰富机会，许多是主流出版渠道之外的边缘文献，内容很新。 （6）广泛性：扩大了人际交流范围，提供了更多直接交流的机会。 应当注意，网络信息不是传统信息资源的简单翻版，也不可能取代传统的信息资源，是传统信息资源的有力补充。,4.3.1 网络信息的特点及其分类（续）,2、网络信息的分类 可以从不同的角度对网络信息进行大致的分类： （1）按信息的提供者分：可分为个人提供的和组织（政府和公司）提供的信息两大类。 （2）按访问者的权限来分：可分为开放信息和保密信息两大类。网上信息绝大多数是开放的。 （3）按信息涉及的领域来分：可分为以下5类： 教育类信息；文化类信息；科研类信息；娱乐消遣类信息；政策类信息。,3、网络信息的检索工具 网络信息检索工具是指在Internet上提供信息检索服务的一类计算机系统，其检索对象是Internet上的各种网络信息。Web检索工具主要可分为以下几种类型： （1）目录型检索工具：是按某种主题分类体系编制的一种可供检索的等级结构式目录。用户通过该目录体系的引导，找到有关的信息。如Yahoo！（）、搜狐（）等。,4.3.1 网络信息的特点及其分类（续）,3、网络信息的检索工具 （2）搜索引擎：使用自动索引软件来发现、收集并标记网页，建立数据库。以Web形式提供给用户一个检索界面，供用户输入关键词之类的检索项，代替用户在数据库中查找出与其匹配的记录并返回结果，且按其相关度排序输出。 （3）多元搜索引擎：将多个搜索引擎集成在一块，并提供一个统一的搜索界面，检索时，自动将一个检索提问发给多个搜索引擎同时进行检索。,4.3.1 网络信息的特点及其分类（续）,4.3.2 搜索引擎,搜索引擎（Search Engine）是一种利用网络自动搜索技术，对网络资源进行标记，并为检索者提供检索的工具。 1、搜索引擎的特点 搜索引擎一般由自动索引软件生成索引数据库，具有收录加工信息范围广、速度快，能及时向用户提供Internet中的新增信息，可直接输入关键词或词组进行检索。但由于人工干预少，准确性较差，检索结果中有许多冗余信息。,4.3.2 搜索引擎（续）,2、搜索引擎的工作原理或过程 搜索引擎的工作过程主要包括：信息采集、存储、加工、处理和输出等部分。 （1）信息采集与存储：搜索引擎一般采用自动方式收集和存储信息，利用某些自动跟踪索引软件追寻WWW上的链接向前搜索，找到Web页并将其调出，并自动给该Web页的某些词或全部词作上索引，形成目标摘要格式文件后，填入网络可访问的数据库。,4.3.2 搜索引擎（续）,2、搜索引擎的工作原理或过程（续） （2）加工：信息索引的建立 信息采集和存储后，要建立索引查询系统，其作用是决定索引的时空比、布尔逻辑操作、表达式匹配、词语匹配、相关性排序等。建立信息索引就是创建文档信息的特征记录，使检索者能快速地检索到所需信息。,4.3.2 搜索引擎（续）,2、搜索引擎的工作原理或过程（续） （3）输出：相关性处理并建立索引界面 一般情况下，网上检索的结果十分庞大，使检索者无法逐一浏览。故搜索引擎还要根据文件的相关程度进行排列，将最相关的文件放在最前面。 搜索引擎确定相关性的方法主要有：概率方法;；位置方法；摘要方法；分类或聚类方法。,4.3.2 搜索引擎（续）,3、搜索引擎的检索功能 （1）一般检索功能 这是搜索引擎的最基本的作用。这些功能主要包括：布尔逻辑检索（Boolean)、词组检索（Phrase）、截词检索（Truncation）、字段检索（Fields）等。一般来说，每种搜索引擎并非包含了所有这些检索功能，而且每种搜索引擎对其中某一功能的侧重和表现也不相同。,4.3.2 搜索引擎（续）,3、搜索引擎的检索功能 （2）特殊检索功能 特殊检索功能包括： 自然语言（Natural Language）检索 多语种检索 区分大小写的检索,4.3.2 搜索引擎（续）,4、常用搜索引擎介绍 Yahoo！（ ） Altavista（） Lycos（） Hotbot（） Northen Light（） 谷歌（） 百度（) 雅虎（） 搜狐搜狗（) 新浪爱问（) 天网搜索（),4.3.3 多元搜索引擎,1、什么是多元搜索引擎 多元搜索引擎（Metasearch Engine，Megasearch Engine或Unified Search Engine）又称集成式搜索引擎，是将多个搜索引擎集成在一起，向用户提供一个统一的检索界面。并且将一个检索提问同时发给多个搜索引擎同时检索多个数据库，经过聚合、去除重复部分并输出检索结果。使用多元搜索引擎可让用户省时、省力。,4.3.4 搜索引擎的比较与发展趋势,1、常用搜索引擎的比较（P115） 2、搜索引擎的发展趋势 （1）使用简单化 （2）内容复杂化 （3）功能专业化 （4）索引智能化,Java语言的特点与用途 Java Applet与HTML语言,4.4 Java语言简介,4.4.1 Java语言的特点与用途,1、 Java语言概述 （1）HTML语言的缺陷：只能提供静态的文本或图像，不能实现一种实时的动态交互。 （2）Java语言与硬件体系结构无关 （3）可实现动态交互 （4）是Internet上的一个重要平台，使三维动画、背景音乐、虚拟世界、电视会议、电子商务等在Internet上成为现实。是软件产业的一次革命。,4.4.1 Java语言的特点与用途（续）,2、 Java语言的基本特点 Java是一种面向对象的独立于计算机平台的高级程序设计语言，对Internet产生了深刻的影响，主要特点如下： （1）简单性 （6）安全性 （2）面向对象 （7）健壮性/可靠性 （3）分布式 （8）高性能 （4）可移植性 （9）多线程性 （5）解释性 （10）动态性,4.4.1 Java语言的特点与用途（续）,3、 Java语言的基本用途 Java语言的应用领域十分广泛，但基本的用途主要包括： （1）可编写Applet（小应用程序）：Java的Applet具有良好的跨平台能力。 （2）可编写Servlet（小服务器程序），在服务器端运行，可取代CGI程序，Java的Servlet可用于各种不同的服务器。 （3）可编写JSP（Java Server Page）：Java的另一种应用形式，类似于ASP。 （4）可取代VC+编写各种Windows的应用程序。,4.4.2 Java Applet与HTML,Java Applet是Java语言在Web页中的一种“小应用程序”，是一种动态、安全、跨平台的网络应用程序。 1、对Java Applet的一些限制 将Java Applet与独立的Java