《网站设计与建设》第1章.ppt

1、网站设计与建设主主编 雷学生雷学生 罗国富国富中国水利水电出版社第1 1章 概述1.1 1.1 网站的基本构成网站的基本构成1.1.1 WWW简介介WWW是World Wide Web的缩写，中文译名为“万维网”，它作为Internet上的新一代用户界面，摒弃了以往纯文本方式的信息交互手段，而采用超文本(HyperText）方式。利用该技术为用户提供全球范围的多媒体信息服务，并使用户获取信息的手段有了根本性的改善，与之密切相关的概念就是浏览器（Brower），浏览器实际上就是用于网上浏览的应用程序，程序的主要作用是显示网页和解释脚本。对一般设计者而言，不需要知道有关浏览器实现的程序细节，只要知

2、道如何熟练掌握和使用即可。WWW是附着在Internet上的覆盖全球信息的“蜘蛛网”，是当前Internet上最受欢迎、最为流行、最新的信息检索服务系统。1.1.2 什么是网站什么是网站所谓网站（website）即网络站点，是指连接到互联网上，包含特定内容的网页的有序集合。它拥有域名或地址并提供一定网络服务的主机，其中域名指网站所在的位置，主机指提供存放文件所在的空间，网络指提供访问站点的物理链路，也就是网站的接入，服务指提供网站功能和访问形式。1.1 1.1 网站的基本构成网站的基本构成1.1.3 网网页的概念的概念网页是一种可以在WWW上传输并被浏览器识别、翻译并显示出来的特殊文件。一般我

3、们常见到的网页文件是HTML【Hypertext MarkupLanguage，超文本标记语言】文件。所谓“超文本”就是指页面内除文本外，还可以包含图片、链接、音频甚至视频等非文字的组成部分。1.1 1.1 网站的基本构成网站的基本构成1.1.4 协议协议（Protocol）是关于信息格式及信息交换规则的正式描述。在信息技术中，协议就是一些特殊的规则集合，它被通信的接收方和发送方认可，收发双发均以这种规则对信息加以解释。在网络的各层中存在着许多协议。它是定义通过网络进行通信的规则，接收方和发送方对应层的协议必须一致，否则一方将无法识别另一方发的信息，以这种规则规定双方完成信息在计算机之间的传送

4、过程。在Internet上，它统一了人们在网上的交流方式。HTTP协议【Hypertext Transfer Protocol，超文本传输协议】是用来在Internet上传送超文本的传送协议。它是运行在TCPIP协议族之上的最常用的传输协议。1.1 1.1 网站的基本构成网站的基本构成1.1.5 HTMLHTML即超文本标记语言，是WWW的描述语言。设计HTML语言的目的是为了能把存放在一台电脑中的文本或图形与另一台电脑中的文本或图形方便地联系在一起，形成有机的整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字、图形、动画、声音、表格、链接等。HTML的结构包括头部（

5、Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。1.1 1.1 网站的基本构成网站的基本构成1.1.6 超文本超文本超文本（Hypertext）是把一些信息根据需要连接起来的信息管理技术，人们可以通过 一个文本的链指针打开另一个相关的文本，只要用鼠标点一下文本中通常带下划线的条目，便可获得相关的信息。1.1 1.1 网站的基本构成网站的基本构成1.1.7 超超链接接网页的出色之处在于能够把超链接（Hyperlink）嵌入网页中，这使用户能够从一个网页站点方便地转移到另一个相关的网页站点。它可以指向其他网页文件、多媒体文件、图像甚至程序。超链接

6、是内嵌在文本或图像中的，文本超链接在浏览器中通常是带下划线，而图像超链接是看不到的，但如果用户的鼠标指向它，则鼠标的指针通常会变成手指状（文本超链接也是如此）。1.1 1.1 网站的基本构成网站的基本构成1.1.8 网站的基本构成网站的基本构成1网站前台网站前台是指普通访问者或普通用户访问的网站页面。一般由HTML网站页面与CSS样式构成。2网站后台网站后台是指供管理人员使用的、普通用户一般无法访问的网站页面。可以由Asp或Jsp等其他动态网站设计程序与网站数据库组成。现在的网站系统，一般都是由后台生成前台，可以方便、高效、系统地管理网站中的任何信息和内容。几乎所有网站的应用功能的开发都将使用

7、到后台数据库。因此，网络数据库技术与网页前台设计的完全结合，是一个网站设计成功的前提。1.1 1.1 网站的基本构成网站的基本构成1.1.9 网站与网网站与网页的区的区别1网页是网站的组成部分之一，网站还有系统程序和数据库等组成部分。2网站以动态化管理为基本特征。3更新方式不同。4网站能方便地实现管理功能和信息查询。5网站以数据库为核心。6网站需要服务器驱动。7网站支持邮件服务器。1.1 1.1 网站的基本构成网站的基本构成1.2 1.2 网站的类型网站的类型1.2.1 按开按开办网站的主体以及目的分网站的主体以及目的分类按开办网站的主体以及目的分类可分为：政府网站、企业网站、商业网站、教育科

8、研机构网站、个人网站、其他非盈利机构网站以及其他类型等。1.2.2 按信息流按信息流转和提供的服和提供的服务方式划分方式划分1门户类网站 2资讯类3娱乐游戏类 4电子商务类5交易类 6企业类7政府类 8个人主页类9资源服务类 10远程教育类网站11其他1.2 1.2 网站的类型网站的类型1.3 1.3 建立网站的目的建立网站的目的1.3.1 为什么要建立网站什么要建立网站1竞争的需要。2可以迅速树立政府或企业形象。3可以让更多的人获得所需的商业信息或其他资讯。4可以销售产品并为来访者提供服务同时可得到相应的反馈。5可以吸引公众的注意力，及时发布时间性强的信息，提供图片、声音和视频文件，使公司的

9、宣传达到声情并茂。6可以进入一个高需求的市场，甚至可以开拓国际市场。7可以回答用户经常关心的问题，提供24小时服务，同你的销售人员随时保持联系。8、可以尽可能快地更新信息。9、检验市场服务和产品。10、联系媒介。1.3.2 如何建立成功的网站如何建立成功的网站在建立网站前必需考虑以下几个几个问题：1建网站的目的是什么？2网站规模的大小？3、你希望或者需要独立域名吗？4、网站的主要访问目标是什么人或者群体？、基于什么样的的受众定位，确定网站的设计特色？6、如何推广网站？网上、网下或者两者并举？是否希望网站带来哪类额外收入？、准备如何经营这个网站？、投入的预算是多少？1.3 1.3 建立网站的目的

10、建立网站的目的1.4 1.4 建立网站的流程建立网站的流程建立网站的流程大致可以分成四个主要阶段，如图所示。1.5 1.5 创建网站的几种方法创建网站的几种方法1.5.1 网站网站设计的常用的常用应用用软件件1FrontPageMicrosoft出品的网页制作软件，有典型的微软办公软件界面，简单易学，它是网页制作的入门软件。2PhotoshopAdobe公司出品，是功能强大的专业图形软件，可以制作任何平面效果。它是网页图像处理方面的首选软件。3DreamweaverMacromedia公司出品，是“所见即所得”可视化网页编辑软件。它是高级网页设计者的首选。1.5 1.5 创建网站的几种方法创建

11、网站的几种方法1.5.1 网站网站设计的常用的常用应用用软件件4FireworksMacromedia公司出品，用于制作网站标志、进行平面图像处理，并可以轻松创作GIF动画。5FlashMacromedia公司出品，用于制作动态页面、动画和页面广告，做出的动画声音和动画效果都是其他软件无法比的。它与Dreamweaver和Fireworks一起合称为“网页制作三剑客”。1.5.2 网站网站设计的的编程程语言言与网站设计相关的程序语言有下列几种：1HTML语言它是一种用来撰写网页的程序语言，用来表示Web文档的规范。顾名思义，HTML使用标记符来确定网页显示的格式。虽然HTML原始文件为纯文本文

12、件，没有图片和动画等多媒体组件，但却包含了指向这些多媒体组件的指针。每个Web页对应一个HTML文件，当打开HTML的文件后，便可看到不同文本属性、图片和动画等很多效果。HTML文件的扩展名为.html或.htm。1.5 1.5 创创建网站的几种方法建网站的几种方法1.5.2 网站网站设计的的编程程语言言与网站设计相关的程序语言有下列几种：2XML语言XML语言是Extensible Markup Language的缩写，中文泽为“可扩展标记浯言”，主要的用途是在Internet上传送或处理数据。XML与HTML不是并列的概念，它可以说是HTML的补丁，以便弥补HTML语言中的不足。比如，在H

13、TML语言中不允许用户自定义控制标记符，而在XML语言中则允许用户这样做。XML文件的扩展名为.xml。1.5 1.5 创创建网站的几种方法建网站的几种方法1.5.2 网站网站设计的的编程程语言言与网站设计相关的程序语言有下列几种：3VRML语言VRML语言是Virtual Reality Modeling Language的缩写，中文译为“虚拟实境描述模块语言”，主要的用途是描述物体的三维空间信息，使游览者可以看到三维物体。游览者不仅可以看到物体的正面，还可以将物体加以旋转、拉远、拉近或者是从各个角度来观察物体。1.5 1.5 创创建网站的几种方法建网站的几种方法1.5.2 网站网站设计的的

14、编程程语言言4CSS语言CSS语言是Caseading Style Sheets的缩写，中文译为“层叠样式表”，主要的用途是定义网页数据的编排、格式化、显示及特殊效果等，可以弥补HTML的某些不足。5浏览器端Script脚本语言脚本（Script）是一段嵌在HTML原始代码内的小程序。Netscape公司开发的JavaScript 和Microsoft公司开发的VBScript均可用来撰写浏览器端的脚本，但在使用效果上JavaScript 似乎更胜一筹。1.5 1.5 创创建网站的几种方法建网站的几种方法1.5.2 网站网站设计的的编程程语言言6服务器端的Script脚本语言尽管浏览器端的脚本

15、已经可以完成许多工作，但有些工作还需要在服务器端执行才可以完成。目前常见的服务器端的脚本语言是ASP程序。ASP是Active Serve Pages的缩写，中文译为“动态服务器网页”。ASP程序是在Microsoft IIS或PWS等Web服务器执行的脚本，通常是由VBScript或是JavaScript撰写而成。1.5 1.5 创创建网站的几种方法建网站的几种方法1.5.2 网站网站设计的的编程程语言言7DHTML语言DHTML（Dynamic HTML），即动态HTML，它是一种技术的总称，它使用HTML、VBScript、JavaScript和CSS等语言技术使得网页能够具有动态交互功

16、能。虽然HTML语言可以制作出具有复杂格式的网页，但这样制作出来的网页中只包含静态内容，如果网页上有任何信息需要更新，浏览器就必须从服务器重新下载整个网页，因而造成网络的极大的负荷。1.5 1.5 创创建网站的几种方法建网站的几种方法1.5.3 网站建网站建设常用数据常用数据库技技术1数据库系统数据库系统是指含有以下部分的不同的数据库软件组件和数据库的集合：（1）数据库应用程序（2）前端（即客户端）组件（3）数据库管理系统（4）数据库1.5 1.5 创创建网站的几种方法建网站的几种方法2常用的网站后台数据库ORCALEORCALE公司的大型数据库管理系统SQL SERVERMicrosoft公

17、司的大型数据库SYSBASESYSBASE公司的数据库产品ACCESSOffice组件中的一员，小型数据库产品FOXPRO在我国曾广泛使用的小型数据库产品INFORMIX分布式数据库管理系统MYSQLMYSQL是一种Linux下的高效的数据库DB/2IBM公司的数据库产品1.5 1.5 创创建网站的几种方法建网站的几种方法1.5.4 创建网站的几种方法比建网站的几种方法比较1PHP超文本预处理器（Hypertext Pre-processor）是开放源代码服务器端的脚本语言，在语法上同C语言非常类似。2ASP动态服务页面（Active Server Pages）3.ASP.NET4.JSP结论：可以根据操作系统平台和网站规模来选择开发工具。p Windows操作系统上，适用于小型网站的工具是ASP+ACCESS或ASP.NET+ACCESS，大型网站刚选用ASP+SQL SERVER或ASP.NET+SQL SERVER较合适。p Linux操作系统上，大型网站可以用JSP+ORACLE，而中小p型网站选用PHP+MySql。1.5 1.5 创创建网站的几种方法建网站的几种方法习题一习题一1网站的构成是什么？2网站的设计流程分成几步？3网站的类型有那些？