旅游网页设计概述.ppt

1、旅游网页设计基础王红崧，教师：王红崧，学时分配，48 (实践教学实验)实验内容：实训，教材，任意Dreamweaver 8.0教学任意HTML教学，考试安排，成绩构成：机器考试作业提交：建设自己的每次作业练习单独文件夹(如练习1、练习2 ) 然后添加到FTP自己的文件夹中，作业练习按时完成，一次也不授课成绩。 第一章旅游网站设计概要、1.1基本概念1.2旅游网站设计相关软件介绍1.3网站设计相关程序语言、1.1基本概念一、WWW网页二、网站结构三、网页构成四、URL介绍、万维网：简称WWW或3W 使用包含图像、动画、声音等信息的html(hypertextmarkuplanguage )文件格

2、式。 网页和文件可以放置在互联网上的任何地方，可以通过超链接将它们组合在一起，用户可以通过超链接从一页跳到另一页。 客户端需要TCP/IP协议、自己的IP地址、与互联网的连接以及称为浏览器的本地Web界面来访问Web。 在服务器端，网站由TCP/IP协议组成，D NS和浏览器、1、WWW页面和WWW由三个基本内容组成，分别是URL、HTTP和HTML。 1 )统一资源定位符(URL ) :统一资源定位符2 )超文本传输协议(http ) :超文本传输协议3 )超文本管理3) HTML语言加上了ASCII文本文件，第二，网站的工作原理概要3360网站的一般工作原理是Web服务器和客户端浏览器的相

3、互作用的基本原理，简单来说，Web服务器上的文件和数据库最终成为客户能看到的页面实质上该过程是解决(1)站点数据如何以页面数据站点程序的形式解决这三个问题的过程。 (2)根据用户的要求将被指定的数据整体发送给客户端、因特网进行解决的方法。 (3)浏览器解决客户端如何将页面数据显示为页面(页面是图形界面上的文本、图像、图形的集合)。 三、网页的构成，1 .文本网页也需要大量的文字，这需要用网页编辑器的HTML语言标签书写。 也可以利用网页编辑工具的“只看就能得到”功能直接写入文字。 2 .图像不仅包含文字，网页也包含很多图像，因此文字排列的内容变得丰富。 实际上，有时比文字更有说服力，更直观。

4、目前，网页的大部分图形格式为gif或jpeg格式，在互联网上两种格式的图像传输速度快，位图bmp文件空间大，传输速度慢。 3 .动画中描述的页面都是静态页面，就像冻结的风景一样，加上动画，页面会更加丰富生动。 1995年由Sun开发的Java语言，使用户能够制作能够调用图像和声音的多媒体应用程序小程序，在短时间内Java风靡世界。 但是，要创建不熟悉编程语言、易于阅读的动画，可以使用Flash或Fireworks等软件创建，然后将其保存为小而有魅力的*.swf文件，进行网页编辑4 .超链接有美丽的文字、美丽的照片和生动的视频的网页还不能说是网站。 其他人还不能访问。 此时，用一种方式把它们合并

5、成一个有机的整体。 这种方式是超链接，超链接可以说是网站的脉络。 超链接是网站的重要部分，可以超链接网页上的文本、图像、图像的一部分，用户点击时，浏览器会根据指示和地址移动到适当的位置，或者移动到新页面。超链接是连接其他网页的入口，包含该连接点的文字通常用蓝色下划线表示。 一般来说，当用户将鼠标指针移到网页上的某个项目上时，指针变成手形，表示该链接是超链接的超链接分为文本超链接和图像超链接。 5 .在其他组件上描述的文字、图像、动画是网页中最常见的组件，也可以丰富网页的内容，提高网页的生动性的组件，例如JavaScript 四、URL介绍、URL(Universal Resource Loca

6、tor )中文意味着“统一资源定位地址”，用于表示各站点和站点上的网页地址，地址是唯一对应的。 在浏览器中输入URL时，可以访问URL指向的网页，创建网页中的超链接时使用URL。 看以下的例子：可以从附图看到的基本结构是通信协议：/服务器名：通信端口号/文件夹/文件名各部分的含义是(1)通信协议通信协议或者用于连接web页的网络传输协议，例如HTTP是高级别(high transfer )的协议FTP是文件传输，例如，FTP协议文件传输协议主要用于获取服务器上的文件资源。 例如，5/或ftp:/ftp.XXX。 file协议访问本地磁盘文件的服务。 例如：

7、file :/c :/my document/hello.exe，telnets协议注册远程系统服务。 例如： telnets:/news协议网络新闻组协议。 例如，news: mailto协议传输电子邮件协议。 例如，mailto:(2)服务名是指提供服务的主机名或其地址。 冒号后面的数字是通信端口号，不一般。 默认端口为80，即http协议端口。 此端口号告诉服务器使用TCP/IP协议软件打开哪个通信端口。 由于一台计算机始终作为Web、FTP等服务器发挥作用，所以为了区别起见，各服务器必须对应通信端口，(3)文件夹和文件名文件夹用于存储文件，通常，多个同类的文件创建文件目录对于多级别文件

8、目录，必须指定第几级文件夹，直到找到文件位置。 文件是包含文件名和扩展名的全名。 绝对URL是指互联网网址的完整位置。 例如，相对URL是当前页面的上方资源地址，包括从当前到目标页面位置的路径。 news/hello.html等是相对URL，表示位于当前页所在目录下的news子目录中的hello.html文件。 1.2旅游网站设计相关软件介绍，一、Dreamweaver 2、Fireworks 3、Flash，现在网站设计软件中比较流行的是Adobe公司的Dreamweaver、Flash、fireworks 专业的图像处理软件Photoshop (位图处理)和CorelDRAW (制作矢量图

9、)经常用于网页制作，而Dreamweaver、Dreamweaver则是美国著名的软件开发公司Adobe公司Dreamweaver 8的出现使得创建网页变得更加容易。 提供强大的设计工具，无需编写代码即可创建具有动态特性(如动画和分层)的网页。 二、Fireworks、Fireworks是图形/图像处理软件。 这是Adobe公司的网页设计三剑客的火焰，以处理网页的照片为特点，能简单地制作GIF动画。Fireworks是用于设计网页图形的应用程序。 其中包括的创新解决方案解决了图形设计师和网站管理员面临的主要问题。 Fireworks提供了许多用于在单个文件中创建和编辑矢量和位图图形的工具。 三

10、、Flash、Flash也是美国Adobe公司推出的动画制作软件，是世界上使用最广泛、最受广大用户欢迎的平面动画制作软件。 用它制作的动画流畅生动，画面优美，而且文件数据量非常小，下载速度快，软件界面直观，对制作者的要求不太高，非常简单，1.3网站在HTML简档2、XHTML、ASP和ASP.NET、PHP、JSP、JavaScript、CSS、站点设计中，HTML格式的站点通常在这样的网页上显示文本图像等信息您也可以从视觉效果静态的HTML格式的网页，检视GIF格式的动画、FLASH、字幕卷动等各种动态效果。 但是，这些“动态效果”是视觉上的，必须区别动态网页的概念。 动态页面被称为动态页面

11、，因为对于ASP和JSP等数据库页面，可以在这些页面的页面上交换访问者和服务器的数据。 静态Web页制作技术是通过HTML标记语言，以一定的形式统合图像、文字、声音等各种媒体，实现与Web服务器联合的信息网络分发的技术。 常见的静态网页创建工具包括前页、Dreamweaver和Flash。 动态web编程工具动态web页是部署在服务端的一些执行脚本。 Web服务起到连接这些脚本和阅览者的作用。 Web服务器首先接收阅览者的阅览请求和提交的请求信息，基于这些请求，执行相应的动态Web页脚本，完成特定的操作，生成相应的Web页，将这些页发送给阅览者，由此完成Web应用程序操作专业用户在浏览器中接受

12、的是利用Web服务器对服务器侧的脚本进行处理而生成的Web文件，脚本程序代码不会出现在客户端侧。 1、HTML概述，HTML的目的是标记普通文档中的某些字句，并使用标记按期望显示文档。 每个基本网页都对应一个HTML文件。 网页是浏览器解释和显示HTML标签的结果。 HTML的超文本功能或链接功能使您能够在网页之间进行链接。 也称为HTML语言、超文本标记语言，英语的全名为hypertext标记语言。 它是一种由特定符号组成的标识语言，语法简单，并且可以使用标记按预期显示文档。 中的组合图层性质变更选项。 HTML文本包含两个信息：页面本身的文本和表示页面元素、结构、格式和其他超文本链接的HT

13、ML标签。 HTML标签定义HTML文本的逻辑结构并控制其显示格式。 也就是说，设计者可以使用标签定义HTML文本的文档结构，或使用HTML标签设置链接、标题、段落、列表、字符突出显示区域等。 二、随着XHTML、应用Web的扩大，HTML过于简单的弱点也越来越明显：1)链接不能立即更新；2 )需要下载动态内容；3 )搜索时间过长；4)HTML支持跨国文字例如：所有标记都有适当的结束标记并关闭的标记及其属性名称必须用双引号括住小写标记的属性值属性必须有值.Dreamweaver8默认以XHTML标准创建新的网页(数据区域之前定义的区域) 包含DTD文档类型声明并指示XHTML版本的详细dtd

14、URL通过将名称空间添加到html标记来收集元素类型和属性名称。 三、ASP和ASP.NET，1. ASP ASP(Active Server Pages )是服务器端脚本编写环境，是微软(Microsoft )公司的下一代开发动态网页的技术，具有开发简单、功能强等优点。 ASP可以将HTML页面、脚本命令和ActiveX组件组合起来，以创建交互式网页和强大的基于Web的应用程序。 ASP页面和标准HTML页面有区别和联系。 ASP页的文件扩展名为. ASP，标准HTML页的文件扩展名为. htm或. HTML。 标准的HTML页面将被发送到浏览器而不进行处理，并且在处理ASP页面之前运行服务

15、器端脚本，然后生成HTML页面。 从浏览器来看，ASP页面与标准HTML页面大致相同，向Web服务器提出ASP请求时，浏览器会收到标准HTML页面，在ASP中，(1)创建容易，可以在Windows手册等文本编辑器中创建，而且vbss (2)不用编译，直接在服务器端执行。 (3)ASP网页与浏览器无关，只要能够执行HTML就能够执行。(4)具有一定的安全性。 ASP在服务器侧执行，执行结果作为HTML主页返回给用户浏览器，因此ASP源程序不会泄漏，提高了系统的安全性。 2. ASP.NET ASP，(1)界面和代码没有分离。 (2)说明的脚本语言。 ASP.NET克服了上述不足。 开发人员还可以使用Visual Studio.NET集成开发工具开发ASP.NET应用程序，就像Visual Basic程序一样。 另外，ASP.NET通过所谓的隐藏代码技术，彻底实现了接口和代码分离。 4、PHP PHP是跨平台服务端的内置脚本语言。 借用c、Java和Perl语言的大量语法，并结合P