收藏 分享(赏)

综合网页设计.ppt

上传人:wo7103235 文档编号:7046469 上传时间:2019-05-04 格式:PPT 页数:38 大小:734KB
下载 相关 举报
综合网页设计.ppt_第1页
第1页 / 共38页
综合网页设计.ppt_第2页
第2页 / 共38页
综合网页设计.ppt_第3页
第3页 / 共38页
综合网页设计.ppt_第4页
第4页 / 共38页
综合网页设计.ppt_第5页
第5页 / 共38页
点击查看更多>>
资源描述

1、毕业论文,题目:综合网页设计姓名:学号:指导老师:,摘要,在Internet飞速发展的今天,互联网成为人们快速获取、发布和传递信息的重要渠道,它在人们政治、经济、生活等各个方面发挥着重要的作用。Internet上发布信息主要是通过网站来实现的,获取信息也是要在Internet“海洋”中按照一定的检索方式将所需要的信息从网站上下载下来。因此网站建设在Internet应用上的地位显而易见,它已成为政府、企事业单位信息化建设中的重要组成部分,从而倍受人们的重视。网页艺术设计是伴随着计算机互联网络的产生而形成的视听设计新课题,是网页设计者以所处时代所能获取的技术和艺术经验为基础,依照设计目的和要求自觉

2、地对网页的构成元素进行艺术规划的创造性思维活动,必然要成为设计艺术的重要组成部分,并随着网络技术的发展而发展。表面上看,它不过是关于网页版式编排的技巧与方法,而实际上,它不仅是一种技能,更是艺术与技术的高度统一。,第一章 前言,ASP技术ASP(Active Server Pages动态网页)是微软公司推出的一种用以取代CGI(Common Gateway Interface通用网关接口)的技术。目前,Internet上的许多基于Windows平台的Web站点已开始应用ASP来替换CGI。简单地讲,ASP是一个位于服务器端的脚本运行环境,通过这种环境,用户可以创建和运行动态的交互式Web服务器

3、应用程序,如交互式动态网页,包括使用HTML表单收集和处理信息,上传与下载等等。通常情况下,用户通过浏览器看到的网页大多是静态的,目前Internet上的许多站点,仍然提供“静态“(static)的主页内容。所谓“静态“,指的就是站点的主页内容是“固定不变“的。当浏览器通过Internet的HTTP(Hypertext Transport Protocol)协议,向站点服务器(Web Server)要求提供主页的内容时,站点服务器收到要求后,就传送原已设计好的静态的HTML的文件数据给浏览器。一个“静态“的站点,若要更新主页的内容,必须手动的来更新其HTML的文件数据。而随着Web应用的发展,

4、用户希望能够看到根据要求而动态生成的主页,例如响应用户查询数据库的要求、生成报表等。当在浏览器上填好表单(form)的输入数据,以提供HTTP要求时,可以在站点服务器中执行的应用程序,而不只是一个HTML文件。站点服务器收到要求执行的应用程序,分析表单(form)的输入数据,将执行的结果以HTML的格式传送给浏览器。根据用户请求生成动态主页的传统方法有CGI、ISAPI等。CGI是根据浏览器端的http请求激活响应进程,每一个请求对应一个进程。当同时有很多请求时,程序挤占系统资源,造成效率低下;ISAPI针对这一缺点进行改进,利用dl l(动态链接库)技术,以线程代替进程,提高了性能和速度,但

5、要考虑线程的同步问题,而且开发步骤烦琐。这两种技术和另一普遍使用的开发动态网页的技术Java都还存在着另外一个问题,那就是开发困难,程序的开发和HTML写作是两个完全不同的过程,需要专门的程序员开发。而较简单的开发技术如java script和IDC(Internet Database Connector)等功能有限,不敷使用。ASP使用的ActiveX技术基于开放设计环境,用户可以自己定义和制作组件加入其中,使自己的动态网页几乎具有无限的扩充能力,这是传统的CGI等程序所远远不及的地方。ASP与常见的在Client端实现动态主页的技术如Java applet、ActiveX Control、

6、VBScript、java script等不同,ASP中的命令和Script语句都是由服务器来解释执行的,执行结果产生动态生成的Web页面并送到浏览器;而Client端技术的Script命令则是由浏览器来解释执行。由于ASP是在服务器端解释执行,开发者可以不必考虑浏览器是否支持ASP;同时由于它在服务器端执行,开发者也不必担心别人下载程序从而窃取编程逻辑。ASP通过后缀名为.asp的ASP文件来实现,一个.asp文件相当于一个可执行文件,因此必须放在Web服务器上有可执行权限的目录下。当用户从浏览器输入了.asp文件的地址后,浏览器就将这个URL请求发给Web Server,如果Web Ser

7、ver上装了ASP,就调用ASP。ASP读出相应.asp文件,解释并执行命令,动态生成一个HTML页面回传Web Server,然后Web Server再把结果发送给浏览器。ASP文件的制作和HTML类似,且和HTML开发集成,可以在同一个过程完成,利用ASP将可以执行的脚本嵌入到HTML文件中(将HTML文件的后缀名改为.asp),这使得HTML文件的编写与脚本的开发融合在一起。通过ASP内置的对象、服务器组件(Server Component)可以完成非常复杂的任务,而且用户还可以自己开发或利用别人开发的服务器组件完成专门的任务。,第二章 理论知识与开发工具介绍 2.1 设计思想,通过网站

8、,全面宣传,展示公司风格、优点与特色,发布公司的业务和动向,及一些web、asp、flash、hank等的最新消息。在Internet上实现完成部分业务,提高办事效率。,2.2开发工具的选用及介绍,ASP的优势: 我选择了ASP结合Front page架构综合网站ASP的优势: Active Server Pages:“动态服务器网页”,一般简称为“ASP”,ASP之所以能受到大家的重视与使用的原因,主要在于所产生的执行结果都是标准的HTML格式,而且这些程序是在网络服务端中执行,使用一般的浏览器(如IE或Netscape)都可以正确地获得ASP的“执行”结果,并且将这ASP执行的结果直接在浏

9、览器中“浏览”,不像VBScript或JavaScript是在客户端(Client)的浏览器上执行,若使用VBScript来设计程序,客户端(Client)在浏览器中可以显示程序执行的结果,可是,客户端(Client)若使用Netscape浏览器就无法显示VBScript的执行结果。,2.2.1 ASP的特点 (1)任何开发工具皆可发展ASP (2)只要使用一般的文书编辑程序,如Windows记事本,就可以编辑。当然,其他网页发展工具,例如,Front Page Express、Front Page等也都可以。 (3)语言相容性高 (4)易于操控数据库 (5)ASP可以轻易地通过DBC(Ope

10、n Database Connectivity)驱动程序连接各种不同的数据库,例如:Access、FoxPro、dBase、Oracle等等,另外,ASP亦可将“文本文件”或是”“ Excel”文件当成数据库用。 2.2.2 ASP的六大内部对象 对象名称功能描述: Request Response Server Session Application Object Context从客户端取得信息将信息送给客户端提供一些Web服务器工具储存在一个Session内的用户信息,该信息仅可被该用户访问在一个ASP-Application中让不同的客户端共享信息可以用来配合Microsoft Tran

11、saction服务器进行分布式事务处理 本系统是基于Web的,所以系统的界面设计也就是系统网页的设计。Photoshop产品对网页设计的强大处理功能,用户通过在页面上仅用拖曳控件的方式就可轻松创建网页。但若要想制作出方便实用的精美网页,必须在开始之前做出详细设计,这样就会大大提高网页质量,进一步改善应用程序的可用性。设计时可以将设计的页面画在纸上,然后考虑哪些控件是所需要的,以及不同元素的重要性、控件之间的联系等。页面的设计和规划不仅影响到它本身外观的艺术性,而且对应用程序的可用性也有很重要的作用。组织页面的工作包括控件的位置、大小、一致性等。这一点我们的设计师做得比较有突出的图片来表现! 图

12、片的处理用到的软件是Adobe Photoshop adobe, adobe Image Ready Photoshop可以说是无所不能的软件,有很多功能。加上Image Ready是制作动画图片的好工具,在这两个软件的组合下,我在网站所做的图片和动画都是非常好的,但也算不上是完美,因前在做此网站之前我还没用得很熟。担在这次设计中,让我更了解Adobe Photoshop adobe, Adobe Image Ready这两个软件。不过也多得老师和同学的指导和帮助。,2.3网页结构布局说明,最开始,网页呈现在你面前的时候,它就好像一张白纸,它需要你任意挥洒你的设计才思。在开始的时候,你需要明白

13、,虽然你能控制一切你所能控制的东西,但假如你知道什么是一种约定俗成的标准或者说大多数访问者的浏览习惯,那么你可以在此基础上加上自己的东西。你当然也可以创造出自己的设计方案,但如果你是初学者,那么最好明白网页布局的基本概念。,2.3.1页面尺寸,由于页面尺寸和显示器大小及分辨率有关系,网页的局限性就在于你无法突破显示器的范围,而且因为浏览器也将占去不少空间,留下给你的页面范围变得越来越小。一般分辨率在800x600的情况下,页面的显示尺寸为:780x428个象素;分辨率在640x480的情况下,页面的显示尺寸为:620X311个象素;分辨率在1024X768的情况下,页面的显示尺寸为:1007x

14、600。从以上数据可以看出,分辨率越高页面尺寸越大。浏览器的工具栏也是影响页面尺寸的原因。一般目前的浏览器的工具栏都可以取消或者增加,那么当你显示全部的工具栏时,和关闭全部工具栏时,页面的尺寸是不一样的。在网页设计过程中,向下拖动页面是惟一给网页增加更多内容(尺寸)的方法。但我想提醒大家除非你能肯定站点的内容能吸引大家拖动,否则不要让访问者拖动页面超过三屏。如果需要在同一页面显示超过三屏的内容,那么你最好能在上面做上页面内部连接,方便访问者浏览。,2.3.2.整体造型,什么是造型,造型就是创造出来的物体形象。这里是指页面的整体形象,这种形象应该是一个整体,图形与文本的接合应该是层叠有序。虽然,

15、显示器和浏览器都是矩形,但对于页面的造型,你可以充分运用自然界中的其它形状以及它们的组合:矩形,圆形,三角形,菱形等。 对于不同的形状,它们所代表的意义是不同的。比如矩形代表着正式,规则,你注意到很多ICP和政府网页都是以矩形为整体造型;圆形带表着柔和,团结,温暖,安全等,许多时尚站点喜欢以圆形为页面整体造型;三角形代表着力量,权威,牢固,侵略等,许多大型的商业站点为显示它的权威性常以三角形为页面整体造型;菱形代表着平衡,协调,公平,一些交友站点常运用菱形作为页面整体造型。虽然不同形状带表着不同意义,但目前的网页制作多数是接合多个图形加以设计,在这其中某种图形的构图比例可能占的多一些。,2.3

16、.3.页头,页头又可称之为页眉,页眉的作用是定义页面的主题。比如一个站点的名字多数都显示在页眉里。这样,访问者能很快知道这个站点是什么内容。页头是整个页面设计的关键,它将牵涉到下面的更多设计和整个页面的协调性。页头常放置站点名字的图片和公司标志以及旗帜广告。,2.3.4.文本,文本在页面中出现都数以行或者块(段落)出现,它们的摆放位置决定者整个页面布局的可视性。在过去因为页面制作技术的局限,文本放置的位置的灵活性非常小。,2.3.5.页脚,页脚和页头相呼应。页头是放置站点主题的地方,而页脚是放置制作者或者公司信息的地方。你能看到,许多制作信息都是放置在页脚的。,2.3.6.图片,图片和文本是网

17、页的两大构成元素,却一不可。如何处理好图片和文本的位置成了整个页面布局的关键。而你的布局思维也将体现在这里。,2.3.7.多媒体,除了文本和图片,还有声音,动画,视频等等其它媒体。虽然它们不是经常能被利用到,但随着动态网页的兴起,它们在网页布局上也将变得更重要。,2.4网页局的技术,2.4.1层叠样式表的应用 在新的HTML4.0标准中,CSS(层叠样式表)被提出来,它能完全精确的定位文本和图片。CSS对于初学者来说显得有点复杂,但它的确是一个好的布局方法。你曾经无法实现的想法利用CSS都能实现。目前在许多站点上,层叠样式表的运用是一个站点优秀的体现。你可以在网上找到许多关于CSS的介绍和使用

18、方法。,2.4.2.表格布局,表格布局好像已经成为一个标准,随便浏览一个站点,它们一定是用表格布局的。表格布局的优势在于它能对不同对象加以处理,而又不用担心不同对象之间的影响。而且表格在定位图片和文本上比起用CSS更加方便。表格布局唯一的缺点是,当你用了过多表格时,页面下载速度受到影响。对于表格布局,你可以随便找一个站点的首页,然后保存为HTML文件,利用网页编辑工具打开它(要所见即所得的软件),你会看到这个页面是如何利用表格的。,2.4.3.框架布局,不知道什么原故,框架结构的页面开始被许多人不喜欢,可能是因为它的兼容性。但从布局上考虑,框架结构不失为一个好的布局方法。它如同表格布局一样,把

19、不同对象放置到不同页面加以处理,因为框架可以取消边框,所以一般来说不影响整体美观 我今天来介绍的布局指南并不是全部的网页布局技术,从某种意义上来说,我想引导你在制作网页的时侯,怎样把图片和文本放置的恰到好处,而且如何拥有一个跳越的设计思维。,2.5ASP的技术特点与静态网页的区别,把信息系统纳入Internet/Intranet的框架之后,首先要解决的问题是通过网页访问后台数据库信息。所有应用程序都被分割为页面的形式,用户的交互操作是以提交表单等方式来实现的,这就要求Web站点具有很强的动态数据发布能力。然而,目前Web的服务,仍以提供“静态”主页内容为主。所谓“静态”,指的就是站点的主页内容

20、是“固定不变”的,无法根据用户的需求和实际情况作出相应的变化。当浏览器通过Internet的HTTP协议向站点的Web服务器申请主页时,站点服务器就会将已设计好的静态的HTML文件传送给浏览器。若要更新主页的内容,只能用非在线的手动方式更新HTML的文件数据。ASP所设计出的是动态主页,可接收用户提交的信息并作出反应,其中的数据可随实际情况而改变,无须人工对网页文件进行更新即可满足应用需要。例如:当在浏览器上填好表单并提交HTTP请求时,可以要求在站点服务器上执行一个表单所设定的应用程序,而不只是一个简单的HTML文件。该应用程序分析表单的输入数据,根据不同的数据内容将相应的执行结果(通常是数

21、据库查寻的结果集)以HTML的格式传送给浏览器。数据库的数据可以随时变化,而服务器上执行的应用程序却不必更改,客户端得到的网页信息会始终保持新鲜的魅力。,第三章网站总体分析 3.1ASP程序设计准备,在开发ASP程序之前,需要做一些相应的准备工作。首先,所有的ASP程序都是在服务器端执行端,比如Win2000下的IIS5;其次为调试开发的ASP程序,一个好的程序编辑软件是必不可少的,在本站的开发中,所有的ASP程序都是用Dream weaver MX编辑的。尽管用记事本完全可以开发ASP程序,但如果想高效地开发web数据库管理系统,可用Dream weaver MX来开发ASP文件。虽然Dre

22、am weaver MX的很多功能都体现在静态网页制作和站点管理上。但用它来编写ASP文件还是十分便捷的。ASP是一种动态生成Web页面技术,它以扩展名为.asp的纯文本形式存在于Web服务器上,可以用任何文本编辑器打开它。在ASP程序中可以包含纯文本、HTML标记以及脚本命令。ASP本身并不是一种脚本语言,它只是提供了一种使嵌入在HTML页面中的脚本程序得以运行的环境。由于ASP运行于服务器端,因此一定要通过WWW方式浏览,即URL应以http:/打头,而不要以本地文件的形式浏览。,3.2 Web Service简介,Web Service是一种构建开放的分布式应用程序的模型,它能在所有支持

23、Internet通信的操作系统上实现。Web service体系结构基于三种角色(服务提供者、服务注册中心和服务请求者)之间的交互。交互涉及发布、查找和绑定操作。这些角色和操作一起作用于Web Service构件:Web Service软件模块及其描述。在典型情况下,服务提供者托管可通过网络访问的软件模块(Web服务的一个实现)。服务提供者定义Web Service的服务描述并把它发布到服务请求者或服务注册中心。服务请求者使用查找操作来从本地或服务注册中心检索服务描述,然后使用服务描述与服务提供者进行绑定并调用Web Service实现或同它交互。图1图示了这些操作、提供这些操作的组件及它们之

24、间的交互。,3.3 网站系统分析,根据前面的设计思想进行分析,按照系统开发的基本观点对网站进行分解,从内容上可对网站作如下划分: (1)网站,包括五个子模块: 一、关系我们 二、我们的关点 三、我们的作品 四、科技新闻 五、公司风格 通过关系我们及我们的团队、工作中等内容来展现; (2)优点与特色通过我们的作品、我们的关点等栏目来展现; (3)发布公司业务与动向通过BBS论坛、技术新闻等栏目来实现; (4)通过发布web、asp、flash等的最新消息来吸引用户的浏览。,3.4 主页设计,网站主页采用静、动相结合的方式,即静态的主画面和动态的图片相结合,体现公司的勃勃生气,静态主页方式介绍公司

25、风格、优点特色、信息发布,BBS论坛就得利用ASP与数据库结合的技术建立数据库,采用交互式的动态的web画面来实现。,3.5 数据库设计,采用的数据库是Microsoft Access ,拟建立JAXEDATA.mdb库文件,BBSPP1.mdb库文件 JAXEDATA.mdb包含如下几个表文件: (1)admin管理员信息表; (2)Article文章信息表; (3)Lunmu文章栏目信息表; (4)BBSPP1.mdb包含如下2个表文件; (5)发言表用户发言信息表; (6)用户表用户登记信息表。,adimin 管理员信息表,Article文章信息表,lunmu 文章栏目信息表,BBSPP

26、1.mdb包含如下2个表文件,发言表用户发言信息表,用户表用户登记信息表,主页界面,技术新闻界面,第四章 详细设计与实现 4.1 网页设计的内容,1)视听元素这里所说的视听元素,主要包括:文本、背景、按钮、图标、图像、表格、颜色、导航工具、背景音乐、动态影像等。无论是文字、图形、动画,还是音频、视频,网页设计者所要考虑的是如何以感人的形式把它们放进页面这个“大画布”里。在本网站中虽然没有用到背影音乐,但安排了一些GIF动画也大大丰富了网页艺术设计的表现力。2)版式设计网页的版式设计同报刊杂志等平面媒体的版式设计有很多共同之处,它在网页的艺术设计中占据着重要的地位。所谓网页的版式设计,是在有限的

27、屏幕空间上将视听多媒体元素进行有机的排列组合,将理性思维个性化的表现出来,是一种具有个人风格和艺术特色的视听传达方式。它在传达信息的同时,也产生感官上的美感和精神上的享受。但网页的排版与书籍杂志的排版又有很多差异。印刷品都有固定的规格尺寸,网页则不然,它的尺寸是由读者来控制的。这使网页设计者不能精确控制页面上每个元素的尺寸和位置。而且,网页的组织结构不像印刷品那样为线性组合,这给网页的版式设计带来了一定的难度。因此在网站先用的色调非常冷,是用黑与浅蓝两种冷淡颜色的交互。但出来的后果今我很满意。再加上一些GIF动画中和了网页的冷淡。,4.2 网页艺术设计的原则,网页作为传播信息的一种载体,同其他

28、出版物如报纸、杂志等在设计上有许多共同之处,也要遵循一些设计的基本原则。但是,由于表现形式、运行方式和社会功能的不同,网页设计又有其自身的特殊规律。网页的艺术设计,是技术与艺术的结合,内容与形式的统一。它要求设计者必须掌握以下三个主要原则。,第五章 系统的运行环境与测试分析 5.1 运行环境,Windows2000sever internet信息服务器(IIS) Microsoft Access 2000 ASP的运行环境: 目前ASP可运行在三种环境下。 1) WINDOWS NT server 4.0运行IIS 3.0(Internet Information Server)以上。 2)

29、WINDOWS NT workstation 4.0运行Peer Web Server 3.0以上。 3) WINDOWS 95/98运行PWS(Personal Web Server)。其中以NT server上的IIS功能最强,提供了对ASP的全面支持,是创建高速、 稳定的ASP主页的最佳选择。,5.2 测试分析 测试用例表5.1,用例测试结果汇总表5.2,第六章 结束语,现代社会的竞争是高科技的竞争,社会的进步发展,离不开科技的飞速发展,因此,毕业设计一定要具有一定的技术含量.用所学的专业知识ASP来设计此网站,如果想建立完整的网站必须花费长时间的设计。本网站还并不完善,但每一个功能都可

30、以运用,并且更人性化。如:输入、修改删除、查询、统计、打印等功能都有,并对非法操作有提示或警告。这样在工作上可大量减少本部门人员的繁忙,从而使手工过渡到电脑化的工作,节省时间性,使公司处理内部事情更有效。通过毕业设计使我认识到要开发一个网站要全面了解公司的运作才能真正的开发一个实用的网站.否则开发的网站出不能真正的得到推广。也不能运用到实际工作中去。在此我要真诚地感谢指导老师对我的指导,在指导老师的关心和帮助下本次毕业设计才能如期完成。,致谢,感谢我的指导导师,他们严谨细致、一丝不苟的作风一直是我工作、学习中的榜样;他们循循善诱的教导和不拘一格的思路给予我无尽的启迪。再次感谢我的指导老师,在这

31、片论文的每个实验细节和每个数据里,都离不开你的细心指导。而你开朗的个性和宽容的态度,帮助我能够很快的融入我们这个新的实验室.在这里我还要感谢广东广播大学教过我的所有老师,在电大这二年的学习期间给予我学习和成长的良好氛围,让我学习到丰富的专业知识和侍人处事的方法,提高了我的自学能力、分析能力和解决问题的能力。在此,我借最后一次机会对这些老师表示衷心的感谢!感谢这养我、育我的学校!在论文即将完成之际,我的心情无法平静,从开始进入课题到论文的顺利完成,有多少可敬的师长、同学、朋友给了我无言的帮助,在这里请接受我诚挚的谢意!,参考文献,1李世杰Active Server Pages(ASP)3.0网页

32、设计手册北京:清华大学出版社1999 2前沿电脑图像工作室巧学巧用Dream weaver、Fireworks、Flash制作网页北京:人民邮电出版社ASP入门与实例演练薄小志编著中国青年出版社 3ASP动态网页设计课程设计指导书 4邓文渊,陈惠贞,陈俊荣ASP与网页数据库设计M.北京:中国铁道出版社,2001作者简介:周庆(1974),男,山东济南人,大连理工大学机械工程学院硕士研究生,主要研究方向:特种加工中心网站建设,Web数据库 5David Wihl 行家看用ASP 上传文件EB/OL Kenny Wood 译http:/www. asp_program/hfg_wzgl_asp/style_two ,2003 6 宣小平、但正刚、张文毅,ASP数据库系统开发实例导航,人民邮电出版社,2003 7 廖信彦,Active Server Pages应用大全-ASP与数据库的整合,清华大学出版社,2003 8 吴兴兴、高保禄,网络数据库应用实例,人民邮电出版社,2003,

展开阅读全文
相关资源
猜你喜欢
相关搜索

当前位置:首页 > 网络科技 > 开发文档

本站链接:文库   一言   我酷   合作


客服QQ:2549714901微博号:道客多多官方知乎号:道客多多

经营许可证编号: 粤ICP备2021046453号世界地图

道客多多©版权所有2020-2025营业执照举报