flash网页设计毕业(论文)

第一篇：flash网页设计毕业(论文)

辽宁警察学院毕业设计（论文）

Flash网页设计

系： 高职计算机系 专业： 计算机应用技术 学生： 陶帅帅 指导教师：杨 虹

完成日期：2017年4月3日

辽宁警察学院毕业设计（论文）

Flash网页设计

总计 毕业设计（论文）表格 0表 插图 24幅

页

摘 要

本论文主要论述了本人所做毕业设计课题《Flash网页设计》的技术背景、设计理念、概要设计、详细设计以及最后效果展示等方面内容，详细的介绍了本人对于设计简单Flash网页的一整套设计过程和相关技术难点的解决方法。

Flash设计网页成为越来越多动漫爱好者和非动漫爱好者获得信息和交流的平台，它满足了广大用户随时随地进行交流和沟通的需要，为网上用户提供交流场所，实现高效动态信息交换，而网页恰恰是由一个个小小的网页集结而成，没有网页就没有强大的网页。现在虽然有很多动漫网页，但版面千篇一律，缺乏个性化、前瞻性，页面设计混乱，不利于用户查看，网页的交互性比较差，因此我针对以上问题为动漫网页设计一个个性化的动漫网页。关键词：动漫网页，Flash

I

Abstract This paper mainly discusses the graduation design which I do the Anime Web Design Theme of technical background, design concept design, detailed design, summary and display effect etc, detailed introduces himself to design a simple Flash web design process and related technical difficulties in solving methods.Animation design website become more and more anime fans and the anime fans access to information and communication platform, it can meet the the needs of the masses of users communicate and communication anytime and anywhere, provide communication place for online users, efficient dynamic information exchange, and site is composed of little web pages gathering, no web, no powerful web site.Although there are a lot of DongManWang stand now, but the layout of the same, the lack of personalized, prospective, page design, unfavorable to the user to see, website interactivity is poorer, so I have to solve above problems as DongManWang station design a personalized anime web pages.Key words: Web Design；Flash；Flash web design

II

目录

前 言..............................................................................................................................1 第1章 概述..................................................................................................................2

1.1 Flash软件的介绍.........................................................................................2 1.1.1Flash的历史.......................................................................................4 1.2 Flash软件的特点.........................................................................................4 1.2.1普通网页设计的特点.........................................................................4 1.2.2Flash网页...........................................................................................5 第2章 网页设计的开发工具与开发语言..................................................................7

2.1 网页使用的开发工具.....................................................................................7 2.1.1Macromedia Flash 8.0 Pro..............................................................7 2.1.2Adobe Photoshop CS2........................................................................7 2.2 网页开发语言.................................................................................................7 第3章 Flash网页设计中的各种技术解析................................................................9

3.1 主页界面设计解析.........................................................................................9 3.1.1Flash网页加载时的进度条设计..........................................................9 3.1.2网页LOGO与站点设计...................................................................10 3.1.3网页导航条的设计.............................................................................10 3.1.4进入主页界面前动态效果设计.........................................................12 3.1.5进入主页时的音效设置.....................................................................13 3.2 “赏漫软件”Flash子页面设计......................................................................14 3.2.1“赏漫软件”目录的制作..................................................................14 3.2.2赏漫软件的图片文字介绍部分制作.................................................15 3.3 “精品动漫”Flash子页面设计......................................................................15 3.4 “酷站导航”Flash子页面设计......................................................................17 3.5 “酷炫漫画”Flash子页面设计......................................................................18 3.6 “关于作品”Flash子页面设计......................................................................19 结论..............................................................................................................................20 致谢..............................................................................................................................21 参考文献......................................................................................................................22 III

辽宁警察学院高职计算机毕业设计（论文）

前 言

世界因Internet的出现而在逐步改变，网络经济雏形因此而形成，由于Internet具有信息容量大、方便迅速、形态多样、覆盖全球等特点，直至今日已发展成为信息传播的主要载体，所以几乎全球的各个企业、机构纷纷建立自己的web站点。Internet信息资源庞大、图文互动、高速高效的特点给传统设计媒体带来了巨大的冲击，再加上网络经济对设计行业的影响，由此而产生了一个新的设计领域--网页设计。

Flash产业作为我国发展中的产业，网页设计技术的发展推动了该产业的传播，使得各类Flash网页纷纷崛起，为广大Flash爱好者带来了诸多便利。

本课题设计的是一个以Flash设计为主题的网页设计，以信息发布、分享为主要的。通过发布一些关于Flash的信息、图片和Flash等为有同样喜好的人们提供一个分享的空间。同时访客用户可以在网页中的剧情交流上发表自己的看法以及可供共享的信息，使人们在获取信息的同时，还可以发表自己的感受。在如今网络高速发展的时代，发布信息与分享兴趣已成为大多网页设计的主要目的。

Flash网页设计

第1章 概述

Flash网页设计是指用用Flash软件制作的网页，网页内容多数甚至全部是Flash。全Flash网页基本以图形和Flash为主，所以比较适合做那些文字内容不太多，以平面、Flash效果为主的应用。如：企业品牌推广、特定网上广告、网络游戏、个性网页等。

在因特网飞速发展的今天，多姿多彩的网络页面总是让我们目不暇接，创建富有个性的个人主页更是每一个网络爱好者的梦想。作为一个优秀的多媒体网页设计平台，Flash从众多的网页设计软件中脱颖而出，成为大多数网络爱好者设计网页的首选工具。能够为大多数人所认同的东西总有它的独特之处，Flash正是以其独特的魅力征服了网络发烧友。

首先，Flash的一个很重要的特点是创建的文件体积很小，Flash是完全基于矢量的Flash处理技术，而矢量图形就是用少量的向量数据来描述一个复杂的对象，存储时只占很小的空间，而且图像的质量也很高。想必许多网友们也曾对自己挂在网上的一些Flash作品的体积担心，那么，用Flash来创建网络Flash作品也正是我们的首选。

其次，Flash使用的是插件的工作方式，用户只要安装一次插件，以后就可以快速启动并观看Flash，而不必像Java那样，每次都要花费大量的时间启动虚拟机。

再次，Flash动漫采用的是“流式”的Flash播放技术，用户不必等到Flash下载完全再去欣赏，而是一边下载一边欣赏。

最后，Flash简单易学，尽管它不能像一门高级语言一样进行编程，但功能还是很广泛的。使用内置的ActionScript语句结合JavaScript，也可以制作出互动性很强的主页来

1.1 Flash软件的介绍

Flash是美国Macromedia公司所设计的一种二维矢量动画软件（现Adobe公司产品），用于设计和编辑Flash文档，最新版本为：Animate CC 2015.5。Flash通常也指Macromedia Flash Player（现Adobe Flash Player），用于播放Flash文档。

辽宁警察学院高职计算机毕业设计（论文）

档案格式:

图1-1影片档

“swf ”这是一个完整的影片档，无法被编辑。有时会被念做“swiff”。Swf在发布时可以选择保护功能，如果没有选择，很容易被别人输入到他的原始档中使用。然而保护功能依然阻挡不了为数众多的破解软件，有不少闪客专门以此来学习别人的程序代码和设计方式。

图1-2原始档

“fla ”是Flash的原始档，只能用Macromedia Flash打开编辑或Adobe Flash CS3及更高版本打开编辑

Actionscript是一种程序语言的简单文本文件.FLA档案能够直接包含Actionscript, 但是也可以把它存成AS档做为外部连结档案(如定义ActionScript类则必须在写在as文件里,再通过import加入类)，以方便共同工作和更进阶的程序修改。

Flash 是一种创作工具，设计人员和开发人员可使用它来创建演示文稿、应用程序和其它允许用户交互的内容。Flash 可以包含简单的Flash、视频内容、复杂演示文稿和应用程序以及介于它们之间的任何内容。通常，使用 Flash 创作的各个内容单元称为应用程序，即使它们可能只是很简单的Flash。您也可以通过添加图片、声音、视频和特殊效果，构建包含丰富媒体的 Flash 应用程序。

Flash 特别适用于创建通过 Internet 提供的内容，因为它的文件非常小。Flash 是通过广泛使用矢量图形做到这一点的。与位图图形相比，矢量图形需要的内存和存储空间小很多，因为它们是以数学公式而不是大型数据集来表示的。位图图形之所以更大，是因为图像中的每个像素都需要一组单独的数据来表示。

Flash网页设计

1.1.1Flash的历史

Flash是由macromedia公司推出的交互式矢量图和 Web 动画的标准，由Adobe公司收购。做Flash动画的人被称之为闪客。网页设计者使用 Flash 创作出既漂亮又可改变尺寸的导航界面以及其他奇特的效果。Flash的前身是Future Wave公司的Future Splash，是世界上第一个商用的二维矢量动画软件，用于设计和编辑Flash文档。1996年11月，美国Macromedia公司收购了Future Wave，并将其改名为Flash。后又于2005年12月3日被Adobe公司收购。Flash通常也指Macromedia Flash Player（现Adobe Flash Player）。2012年8月15日，Flash退出Android平台，正式告别移动端。2015年12月1日，Adobe将动画制作软件Flash professional CC2015升级并改名为Animate CC 2015.5。

Flash的过去无疑是异常辉煌的，然而它的现在和将来却饱受非议。在移动互联网和Html5的强烈冲击之下，Flash在网页方面的应用逐渐衰退，如今已经很难再看到纯正的Flash整站了。有人因此断言Flash已经成为一种“过时”的、“应被抛弃”的技术，更有人提出“Flash将死”的预言。然而，换一种客观的眼光来看现实情形，就会发现Flash并未完全衰退，在网页游戏、互动设计、媒体应用、教育课件等领域，仍然能够看到Flash异常活跃的身影。在动画效果的流畅性、互动设计的便捷性、代码开发的简易性、程序应用的广泛性等方面，目前还没有任何一款软件能够与Flash相比拟。因此，也有许多开发者认为Flash还“大有可为”。无论Flash的未来何去何从，在当下，它仍然是一门值得所有人认真学习的技术。特别是对于有志成为网页设计师的学习者而言，Flash更是一门必修课。

1.2 Flash软件的特点

1.2.1普通网页设计的特点

网页设计要注意的两个要点：整体风格和色彩搭配。

1、确定网页的整体风格

网页的整体风格及其创意设计是最难以学习的。难就难在没有一个固定的模式可以参照和模仿。给你一个主题，任何两人都不可能设计出完全一样的网页。

风格(style)是抽象的。是指站点的整体形象给浏览者的综合感受。这个“整体形象”包括站点的CI（标志、色彩、字体、标语）、版面布局、浏览方式、4

辽宁警察学院高职计算机毕业设计（论文）

交互性、文字、语气、内容价值、存在意义、站点荣誉等等诸多因素。举个例子：我们觉得网易是平易近人的，迪斯尼是生动活泼的，IBM是专业严肃的。这些都是网页给人们留下的不同感受。

在这里，我提供给大家一些参考经验：

(1)将你的标志logo，尽可能的放在每个页面上最突出的位置。(2)突出你的标准色彩。

(3)总结一句能反映贵站精髓的宣传标语！

(4)相同类型的图像采用相同效果，比如说标题字都采用阴影效果，那么在网页中出现的所有标题字的阴影效果的设置应该是完全一致的！

2、网页色彩的搭配

无论是平面设计，还是网页设计，色彩永远是最重要的一环。当我们距离显示屏较远的时候，我们看到的不是优美的版式或美丽的图片，而是网页的色彩。

关于色彩的原理有许多，在此我们不可能一一阐述，大家可以看看相关设计书籍，有利于系统地理解。在此我们仅仅想告诉大家一些网页配色时的小技巧。

(1)用一种色彩。这里是指先选定一种色彩，然后调整透明度或者饱和度，这样的页面看起来色彩统一，有层次感。

(2)用两种色彩。先选定一种色彩，然后选择它的对比色。

(3)用一个色系。简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿；或者土黄，土灰，土蓝。

3、在网页配色中，还要切记一些误区：

(1)不要将所有颜色都用到，尽量控制在三至五种色彩以内。

(2)背景和前文的对比尽量要大(绝对不要用花纹繁复的图案作背景)，以便突出主要文字内容。

1.2.2Flash网页

Flash网页具有设计精美，拥有更多声效、Flash、流媒体剪辑、美术效果及兼顾互动性等特征，非常适合公司作在线产品展示。Flash网页基本以图形和Flash为主，所以比较适合做那些文字内容不太多，以平面、Flash效果为主的应用。如：企业品牌推广、特定网上广告、网络游戏、个性网页等。

制作全Flash网页和制作Html网页类似，事先应先在纸上画出结构关系图，包括：网页的主题、要用什么样的元素、哪些元素需要重复使用、元素之间的联系、元素如何运动、用什么风格的音乐、整个网页可以分成几个逻辑块、各个逻辑块间的联系如何、以及你是否打算用Flash建构全站或是只用其做网页的前期

Flash网页设计

部分等等，都应在考虑范围之内。

实现全Flash网页效果多种多样，但基本原理是相同的：将主场景作为一个“舞台”，这个舞台提供标准的长宽比例和整个的版面结构，“演员”就是网页子栏目的具体内容，根据子栏目的内容结构可能会再派生出更多的子栏目。主场景作为“舞台”基础，基本保持自身的内容不变，其它“演员”身份的子类、次子类内容根据需要被导入到主场景内。

辽宁警察学院高职计算机毕业设计（论文）

第2章 网页设计的开发工具与开发语言

2.1 网页使用的开发工具

2.1.1Macromedia Flash 8.0 Pro Macromedia Flash 8.0 Pro相对于Macromedia Flash MX 2004增强了为移动设备开发的功能,方便创建Flash Web增强的网络视频。虽然有更高的版本，但是Macromedia Flash 8.0 Pro仍是现在最主流的Flash制作软件，配合其内置的ActionScript 2.0能够完美实现网站设计中所需要的各种动态效果和交互效果，而我此次所做的Flash网站就是在Macromedia Flash 8.0 Pro的环境下制作。

新版本的Flash 8中引入了几种高级技术:实时渲染滤镜、运行时位图缓冲、FlashType字体渲染引擎、自定义淡入淡出功能、改进的视频播放组件、增强的文本工具、增强的描边属性、高级渐变控制。其中一种非常棒的技术是，Macromedia减轻了Flash Player 8的渲染工作，在Flash文件中使用标签，Flash Player 8现在可以在用户与Flash文件交互时实时渲染滤镜。这意味着Macromedia已经能够合并内建的滤镜效果，象阴影、模糊、内外发光、倒角、渐变倒角、颜色调整，以获得更丰富的用户体验。这些滤镜或可视效果能够被应用到影片剪辑(MovieClips)和文本域，当在网页中运行时，通过播放器渲染并显现出来。2.1.2Adobe Photoshop CS2 作为Adobe公司出品的最出色的图形图像处理软件，Photoshop以其强大的功能向我们证明着它的名至实归。在falsh网页设计时一些图片素材如背景图片、按钮、LOGO等在载入Flash库前有必要用Photoshop做适当的处理.2.2 网页开发语言

Html（Hyper Text Markup Language）即超文本标记语言或超文本链接标示语言，它是一种计算机程序语言，是目前网络上应用最为广泛的语言，也是构成网页文档的主要内容。

Html文件是用ASCLL代码编写成的，可以保存为最简单的TXT文本文件，Flash网页设计

这样用任何一个文字处理软件都可以进行编写，这也是他能够迅速迅速普及，并十分受欢迎的一个原因。

辽宁警察学院高职计算机毕业设计（论文）

第3章 Flash网页设计中的各种技术解析

3.1 主页界面设计解析

3.1.1Flash网页加载时的进度条设计

(1)新建Flash文档index.fla，设置舞台的大小为550*550像素，设置背景的颜色为#786e28。

(2)建立进度条设计主要是帮助观察Flash网页载入的进度，建立进度条设计样式如图3-1，时间轴上各层设计如图3-2。

图3-1进度条

图3-2进度条在时间轴上各层

Actions：帧1代码： total = _root.getBytesTotal();loaded = _root.getBytesLoaded();baifenshu = int((loaded/total)*100);baifenbi = baifenshu+“%”;setProperty(“jindutiao”, _xscale, baifenshu);Actions：帧2代码：

Flash网页设计

if(baifenshu == 100){

gotoAndPlay(4);} else { gotoAndPlay(1);} 3.1.2网页LOGO与站点设计

网页LOGO设计：

(1)新建图形元件“元件42”。

(2)利用矩形工具建立一个白色矩形，在矩形正中建立一稍小些的背景色矩形形成白色矩形框。

(3)利用任意变形工具将白色矩形框变形成为白色平行四边形框。用线条工具进行分割裁剪，旋转变换得到要设计的网页LOGO。（如图3-3）

图3-3 logo展示图

3.1.3网页导航条的设计

(1)新建图形元件“元件22”（如图3-4），作为导航条背景。

图3-4导航条背景

辽宁警察学院高职计算机毕业设计（论文）

(2)建立6个图形元件分别在各元件中设计各导航按钮文字，字体样式雅黑，字号12，颜色黑色，分别载入各影片剪辑做出动态效果，对应每个影片剪辑做一个与影片剪辑等大的按钮，按钮与影片剪辑放于不同层叠加在一起均匀排列与导航条上（如图3-5）。

图3-5导航按钮

(3)给每个按钮附加动作。（如图3-6）

图3-6按钮b1动作目录

代码如下： 图层4：帧1： stop();元件11： on(rollOver){ } on(press){

} 元件11： on(rollOut){

gotoAndPlay(1);

tellTarget(“/”){

}

loadMovieNum(“index101.swf”, 100);

gotoAndPlay(2);11

Flash网页设计

} on(press){

} 图层4：帧9： Stop（）； 元件11： on(rollOut){ } on(press){

} 3.1.4进入主页界面前动态效果设计

(1)新建图形元件“元件29”，创建长条图行，作为三个小窗口推荐酷站、本站作品、站内更新的上框（如图3-7）。建立三个图形元件分别制作各个小窗口的名称（如图3-8）。

图3-7小窗口的上框 图3-8小窗口的名称

tellTarget(“/”){

}

loadMovieNum(“index101.swf”, 100);

gotoAndPlay(1);

tellTarget(“/”){

}

loadMovieNum(“index101.swf”, 100);

(2)新建图像元件，在其上创建与小窗口等大的白色和背景色的矩形色块，在不同图层中各小窗口的上框和窗体依次在时间轴上载入并做形状补间Flash（如图3-9）。

辽宁警察学院高职计算机毕业设计（论文）

图3-9小窗口动态载入效果时间轴设置

(3)导航条、网页头尾的图片条以相同方式在时间轴上依次载入并做形状补间效果（如图3-10），就可以完全载入主页界面获得完整的主页框架界面。

图3-10导航条、网页头尾的图片动态载入效果时间轴设置

3.1.5进入主页时的音效设置

(1)挑选合适的音效载入库中。

(2)选择适当的音效添加到时间轴上的适当位置（如图3-11），使动态效果更具表现力。

图3-11在时间轴上添加声音效果

主页框架界面到现在已经基本上设计完成了，主页框架界面为一个独立的Flash文档，发布之后形成index.swf文件。此外，我们还要针对各个导航卡设计其对应的swf文件，各swf文件之间通过as代码连接形成一个整体，则构成了本Flash网页的主体结构，再通过as代码连接一些必要的网页就构成了一个完整

Flash网页设计

Flash网页。以下几章我将对各个导航卡所对应的.swf文件及它们所链接的网页页面的制作做进一步的详细说明。

3.2 “赏漫软件”Flash子页面设计

3.2.1“赏漫软件”目录的制作

“赏漫软件”子页面载入效果和“迷你游戏”子页面相仿不再赘述。赏漫软件目录的制作大体上与游戏目录相仿，所不同的是不需要转换和滑动，也就比游戏目录要好做多，同时目录中软件按钮的制作也和游戏目录中按钮一样，再此不在赘述目录和按钮的制作方法。我们来看一下做好的目录的大概形状样式（如图3-12），用以上做目录的经验可以轻松做好。

按钮附加动作代码： on(press){

} unloadMovieNum(3);loadMovieNum(“此处最好填所连接swf文件的相对位置”, 2);

图3-12软件目录样式

辽宁警察学院高职计算机毕业设计（论文）

3.2.2赏漫软件的图片文字介绍部分制作

该部分是以一个小的swf文件单独存在的，在点击软件按钮时会载入相应的swf文件在界面的适当位置。

接下来我们来做一下这个小swf文件，就那ACDSee图片浏览软件所对应的swf文件来说明吧。

（1）新建空白fla文件，命名.fla。将通过Photoshop设计好ACDSee软件的图片素材，载入到s2库中。并生成影片剪辑。以影片剪辑动态效果实现是通过逐帧Flash方式完成的（如图3-13至3-14）

图3-13本影片剪辑动态效果的时间轴设置

图3-14本影片剪辑动态效果

3.3 “精品动漫”Flash子页面设计

“精品动漫”Flash子页面是一个与前几个子页面略有不同的子页面，页面的设计风格与前几个页面有些许差异，不规则的背景使得页面整体显得翘起生动。（如图3-15）子页面载入动态效果及显示出动漫按钮前的动态效果在前面都有涉及不在赘述。

Flash网页设计

图3-15“精品动漫”Flash子页面

（1）新建空白fla文件，命名为index003。将通过Photoshop设计好Flash按钮图片素材，大小50*50像素，载入到index003库中。

（2）新建图形元件，将图片载入图形元件中并在图片上面覆盖一层多半透明的与图片等大的色块。（如图3-16）

图3-16图像上覆盖了透明色块的图形元件

（3）将图像元件做成按钮，按钮元件第一帧是将该图形元件透明度略调高一些（如图3-17），在第二三帧恢复正常（如图3-18）。

辽宁警察学院高职计算机毕业设计（论文）

图3-17按钮第一帧

图3-18按钮第二三帧

（4）给每个按钮附加动作代码以连接到要播放的swf文件。代码如下： on(press){

} tellTarget(“/”){ } loadMovieNum(“xinFlash9.swf”, 2);3.4 “酷站导航”Flash子页面设计

目录的制作、按钮的制作、子页面载入动态效果及显示目录时的动态效果等在前面都有涉及不在赘述。这里仅提供该子网页设计好后的最后效果。（如图3-19）

Flash网页设计

图3-19“酷站导航”子网页设计好后的效果

其中各个网页按钮附加动作的代码为： on(press){ } 其中对网页的图片展示和介绍部分同“赏漫软件”子页面中的小swf文件制作方法一致，可仿照其制作不再赘述。loadMovieNum(“需要读取的swf文件的相对url地址”, 2);3.5 “酷炫漫画”Flash子页面设计

绝大部分和“赏漫软件”子页面中的设计保持一致，只是按钮需要重新制作，右侧的图片展示部分也没太多的改变，完全可以仿照其设计制作不再赘述。再次提供该子网页设计好后的最后效果。（如图3-20）

辽宁警察学院高职计算机毕业设计（论文）

图3-20“酷炫漫画”子网页设计好后的效果

3.6 “关于作品”Flash子页面设计

本网页就只有一个文字面板，文字面板的设计和其他页面中目录的设计比较相似，都是先在图形元件中设计好其轮廓和背景，再在时间轴上通过形状、亮度、透明度改变进行形状补间最终获得文字面板（如图3-21）。再次提供该子网页设计好后的最后效果。（如图3-22）

图3-21文字面板设计在时间轴上的设置

图3-22“关于作品”子网页设计好后的效果

Flash网页设计

结论

Flash网页具有设计精美，拥有更多声效、Flash、流媒体剪辑、美术效果及兼顾互动性等特征，非常适合公司作在线产品展示。Flash网页基本以图形和Flash为主，所以比较适合做那些文字内容不太多，以平面、Flash效果为主的应用。如：企业品牌推广、特定网上广告、网络游戏、个性网页等。

制作全Flash网页和制作Html网页类似，事先应先在纸上画出结构关系图，包括：网页的主题、要用什么样的元素、哪些元素需要重复使用、元素之间的联系、元素如何运动、用什么风格的音乐、整个网页可以分成几个逻辑块、各个逻辑块间的联系如何、以及你是否打算用Flash建构全站或是只用其做网页的前期部分等等，都应在考虑范围之内。

因为本人水平有限，虽然已从很多方面进行阐述和讲解，但终究是不能十全十美的，理论与实际永远是有距离的。希望能在今后的学习和工作中能不断完善、进步！

辽宁警察学院高职计算机毕业设计（论文）

致谢

毕业设计完成之际，我由衷地感谢杨虹老师的大力帮助和支持，感谢我的同学和朋友，在我遇到各种各样复杂问题的时候，给予我鼓励和帮助，使我分析问题和解决问题能力有了很大提高

本论文是在杨虹老师的悉心指导下完成的。杨虹老师渊博的专业知识，诲人不倦的高尚师德，严以律己、宽以待人的崇高风范，朴实无华、平易近人的人格魅力对我影响深远。不仅使我树立了远大的学术目标，还使我明白了许多待人接物与为人处世的道理。所有这一切都将成为我受益终生的宝贵财富!本论文从选题到完成，每一步都是在导师的指导下完成的，倾注了导师大量的心血。在此，我向导师表示崇高的敬意和由衷的感谢！我在研究思想方法上得到了启发，并且在工作中采用他们的部分研究成果与资料。尽管与他们为我付出的一切相比，所有的语言都显得苍白无力，但我仍要真诚地说声:谢谢!感谢三年来各位老师和同学对我学习、生活的关心和帮助。在论文即将完成之际，我的心情久久无法平静，从开始进入课题到论文的顺利完成，有多少可敬的师长、同学、朋友给予了我无言的帮助，在这里请接受我诚挚的谢意！

最后感谢我的母校—辽宁警察学院三年来对我的栽培。毕业设计完成之际，我由衷地感谢论文指导老师的大力帮助和支持，感谢热心的同学与朋友，在我遇到种各样复杂问题的时候，给予我鼓励和帮助。

Flash网页设计

参考文献

[1]向玫玫,林强，马杰，薛雅娟,王亚冰，范文南.Flash设计(21世纪全国普通高等院校美术艺术设计专业十二五精品课程规划教材)，辽宁美术出版社，2014.04.[2]李锡泽，王喆.《Flash动画网页设计》，武汉大学出版社,2015年.[3]刘欢.《Flash ActionScript 3.0交互设计200例》，人民邮电出版社，2015.05.[4]刘斌.基于Flash的课件制作与应用[J]，科技广场，2012(7).P102-P103.[5]莫仲心.浅谈Flash动画在网页设计中的应用[J].信息通信.2012(1).P135-P136.22

第二篇：网页设计毕业论文

目录

一、课题来源.....................................................3

（一）设计思想.................................................3

（二）网站主题.................................................3

二、网站需求分析.................................................3

（一）搜集材料.................................................3

（二）需求分析与规划...........................................3 三 软件介绍.....................................................4

（一）Adobe Photoshop..........................................4

（二）Dreamweaver CS6..........................................4(三)软件运行环境..............................................4

四、网站整体设计.................................................5

（一）网页的规划...............................................5

（二）系统框架.................................................6

五、主页介绍与网页截图...........................................6

（一）主页面介绍...............................................6

（二）子页面介绍...............................................7

六、总结与感想...................................................9

（一）本网站实现了形式与内容的统一.............................9

（二）本网站具有良好的互动性..................................10

（三）缺点与不足..............................................10 参考文献........................................................11

/ 11

摘要

在网络高速发展的今天，互联网不仅深深的改变了人们的生活方式，更改变了人们的思维方式，雷军用互联网思维带领小米科技走到了今天，马云借助互联网成就了他的商业帝国，而首届世界互联网大会在浙江乌镇召开更加突出了互联网的重要性。而网站作为互联网的载体，只有优秀的网站才能使互联网更好的为我们服务。基于这一理念，我设计了自己的网站——田园采摘网。我利用所学习的内容自己动手设计本网站，制作过程中所使用的软件是Macromedia 公司的Adobe Dreamweaver CS6 和photoshop。在整个网站的制作过程中，我尽力优化网页的布局和排版，合理选择内容，尽可能做到完美。

关键词： Dreamweaver Photoshop 网站设计 田园采摘

/ 11

一、课题来源

（一）设计思想

用互联网的思维思考问题、做事情，创建优秀网站，精品网站。

（二）网站主题

结合自己的实际情况，选定田园采摘园作为本网站的设计主题，用互联网的思维经营采摘园。

二、网站需求分析

（一）搜集材料

明确了网页的主题以后，就可以围绕主题开始搜集材料了。材料既可以从图书、报纸、光盘、多媒体上得来，也可以从互联网上搜集，然后把搜集的材料去粗取精，去伪存真，作为自己制作网页的素材。

（二）需求分析与规划

一个完整的网页是建立在各种各样的需求上面的，这种需求往往来自于客户的实际需求或者是出于公司自身发展的需要，其中客户的实际需求也就是说这种交易性质的需求占了绝大部分。

面对网页设计拥有不同知识层面的客户，设计的负责人对用户需求的理解程度，在很大程度上决定了此类网页规划的成败。因此如何更好地的了解、分析、明确用户需求，并且能够准确、清晰以文档的形式表达给参与项目开发的每个成员，保证开发过程按照满足用户需求为目的正确项目开发方向进行，是每个网页规划和网页制作管理者需要面对的问题。据我们调查，当今 3 / 11

互联网已经有成千上万的采摘网。所以，这就要求我们的网站中要有突出和新颖的地方去吸引顾客，这样我们才能在众多的采摘园中占有一席之地并获益。网页设计中，运用photoshop等图形图像处理软件，进行大量的图片处理制作，给人以强烈的美感。并添加flash代码等，给浏览者一种现代感。整个网页由dreamweaver完成。

三 软件介绍

（一）Adobe Photoshop Photoshop简称“PS”，是由Adobe Systems开发和发行的图像处理软件。Photoshop主要处理以像素所构成的数字图像。使用其众多的编修与绘图工具，可以有效地进行图片编辑工作。ps有很多功能，在图像、图形、文字、视频、出版等各方面都有涉及。

（二）Dreamweaver CS6 dreamwraver软件由美国著名的网站应用开发工具生产厂商Adobe Macromedia于2005年6月推出并正式投入市场以来，已经发展得相当成熟。关于dreamwraver的技术介绍的相关书籍与网络信息相当丰富。通过大学中软件开发环境课程的学习，对dreamwraver有了比较深刻的认识，并比较轻松的掌握了dreamwraver的操作。因此，软件技术可以完成任务的要求。

(三)软件运行环境

Dreamweaver是一款简体中文软件，可以在Win2003/WinXP/Win7/Win8中安全运行，换句话说，它可以在任何家用微机中运行。

/ 11

图1.Dreamweaver CS6

四、网站整体设计

（一）网页的规划

一个网页设计得成功与否，很大程度上决定于设计者的规划水平，规划网页就像设计师设计大楼一样，图纸设计好了，才能建成一座漂亮的楼房。网页规划包含的内容很多，如网页的结构、栏目的设置、网页的风格、5 / 11

颜色搭配、版面布局、文字图片的运用等，你只有在制作网页之前把这些方面都考虑到了，才能在制作时驾轻就熟，胸有成竹。也只有如此制作出来的网页才能有个性、有特色，具有吸引力。

（二）系统框架

采摘园首页 采摘概况 最新动态 时令水果 活动影集 联系我们 图2.系统模块框架图

五、主页介绍与网页截图

（一）主页面介绍

首先是利用Dreamwear技术制作的网页。上方框架是网站的图片、网站名称，点击相关文字可以进入到相关的页面上，下方包括五大个分类链接。

图3.主页

/ 11

（二）子页面介绍

本网站总共包括五个子网页，分别为：采摘概况、最新动态、时令水果、活动影集、在线联系。

图4.采摘概况

图5.最新动态

/ 11

图6.活动影集

图7.时令水果

/ 11

图8.联系我们

六、总结与感想

（一）本网站实现了形式与内容的统一

要将丰富的意义和多样的形式组织成统一的页面结构，形式语言必须符合页面的内容，体现内容的丰富含义。运用对比与调和、对称与平衡、节奏与韵律以及留白等手段，通过空间、文字、图形之间的相互关系建立整体的均衡状态，产生和谐的美感。如对称原则在页面设计中，它的均衡有时会使页面显得呆板，但如果加入一些富有动感的文字、图案，或采用夸张的手法来表现内容往往会达到比较好的效果。点、线、面作为视觉语言中的基本元素，要使用点、线、面的互相穿插、互相衬托、互相补充构成最佳的页面效果。网页设计中点、线、面的运用并不是孤立的，很多时候都需要将它们结合起来，表达完美的设计意境。

/ 11

（二）本网站具有良好的互动性

对于销售业务页面要求运行的工作环境稳定，易于操作，界面美观大方，对于前台展示界面要求系统便于维护，安全可靠，对于广大客户所要执行的操作简单易懂，远程访问速度较快，界面友好美观，有基本的错误提醒功能，远程操作数据库正确，要求和客户有一定的互动性，在主页上直观的就可以查看浏览者所想要了解的东西。

（三）缺点与不足

就我个人而言，对网页制作还缺少很多的理论与实际操作知识，曾经只是做一些简单的个人主页，仅此而已。对通过此次毕业设计，可以深入的学习，以提高自身的制作水平。下一步我将进一步完善和优化本网站，同时将推出适合移动端应用的网站，这样可以进一步优化采摘网的布局。

/ 11

参考文献

[1]邓文渊.网页制作高手[M].北京：人民邮电大学出版，2007，6 [2]李宪广.网页制作边学边用[M].北京：清华大学出版社，2009，3 [3]网页设计入门[EB/OL].http://www.xiexiebang.com/sale/view.asp?Article ID=288 [4]许凌云，柳勇良.网页设计全方位学习[M].北京：清华大学出版社，2008，11 [5]陈琳.photoshop cs3 入门实战与提高[M].北京：电子工业出版社，2008，11 [6]焦慧.网页制作基础与典型范例[M].北京：电子工业出版社，2008，7 [7]戎马工作室.Dreamweaver 8与asp动态网站开发[M].北京：机械工业出版社，2006，5 [8]戴一波.Dreamweaver CS3网站制作炫例精讲[M].北京：电子工业出版社，2008，1 [9]何秀芳.网页制作与网站建设课堂实录[M].北京：人民邮电出版社.2009，3 [10]孙连三.新编网页制作与网站建设入门与提高[M].北京：人民邮电出版社.2008，9 [11]邓文渊.网页制作高手FLASH 8[M].北京：人民邮电出版社，2007，6 [12]胡崧.超梦幻劲爆网页[M].中国青年出版社.2008，7 [13]Scot Johson etal.using Active Server Page[J].Que 2007 11 / 11

第三篇：网页设计毕业论文

《网页设计毕业论文》简介：

前言随着时代的发展，网站建设越来越接近于一门艺术而不仅仅是一项技术。网页的艺术设计，日益被网站建设者 《网页设计毕业论文》正文开始>> 前言

随着时代的发展，网站建设越来越接近于一门艺术而不仅仅是一项技术。网页的艺术设计，日益被网站建设者所注重。在目前国

内对此领域研究甚少的情况下，作者将网页艺术设计与其他艺术设计形式进行比较，尝试从网页艺术设计的内容、原则和特点等

三个方面，对这个新的艺术设计领域进行初步的归纳总结和理论探讨。作者认为网页艺术设计是艺术与技术的高度统一，指出网

页艺术设计包含视听元素与版式设计两项内容；以主题鲜明、形式与内容相统一、强调整体为设计原则；具有交互性与持续性、多维性、综合性、版式的不可控性、艺术与技术结合的紧密性等五个特点。在明确了网页艺术设计与网站主题的关系的基础上，提出了“美”和“功能”都是为了更好地表达网站主题这一观点。

网页艺术设计是伴随着计算机互联网络的产生而形成的视听设计新课题，是网页设计者以所处时代所能获取的技术和艺术经验为

基础，依照设计目的和要求自觉地对网页的构成元素进行艺术规划的创造性思维活动，必然要成为设计艺术的重要组成部分，并

随着网络技术的发展而发展。表面上看，它不过是关于网页版式编排的技巧与方法，而实际上，它不仅是一种技能，更是艺术与 技术的高度统一。

目录：

一、网页艺术设计的内容~~~~~~~~~~~~~~~~~~~~页 1.视听元素~~~~~~~~~~~~~~~~~~~~页 2.版式设计~~~~~~~~~~~~~~~~~~~~页

二、网页艺术设计的原则 ~~~~~~~~~~~~~~~~~~页 1.主题鲜明 ~~~~~~~~~~~~~~~~~~~~~~~~~~页 2.形式与内容统一~~~~~~~~~~~~~~~~~~~~~页 3.强调整体

三、网页艺术设计的特点~~~~~~~~~~~~~~~~~~~~~

1.交互性与持续性~~~~~~~~~~~~~~~~~~~~~~~ 2.多维性 ~~~~~~~~~~~~~~~~~~~~~~~~~~~ 3.多种媒体的综合性 ~~~~~~~~~~~~~~~~~~~~ 4.版式的不可控性~~~~~~~~~~~~~~~~~~~~~~ 5.技术与艺术结合的紧密性~~~~~~~~~~~~~~~~~

四、结 束 语~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

一、网页艺术设计的内容

设计活动中包含着主观和客观两方面的因素，在确立了网页主题之后，首先要明确和熟悉设计的对象和构成的要素。网页艺术设

计涉及的具体内容很多，可以概括为视听元素和版式设计两个方面。

1.视听元素

这里所说的视听元素，主要包括：文本、背景、按钮、图标、图像、表格、颜色、导航工具、背景音乐、动态影像等。无论是文

字、图形、动画，还是音频、视频，网页设计者所要考虑的是如何以感人的形式把它们放进页面这个“大画布”里。多媒体技术 的运用大大丰富了网页艺术设计的表现力。

以上各视听元素大多数浏览器本身都可以显示或收听，无需任何外部程序或模块支持。比如，大部分浏览器都可以显示GIF、JPE G图形和GIF89a动画。还有些多媒体文件（如MP3音乐）需要先下载到本地硬盘上，然后启动相应的外部程序来播放。另外，在浏

览器使用插件（Plug-in）可以播放更多格式的多媒体文件。微软推出IE浏览器后，提供了基于OLE的ActiveX技术，用来在网页

中播放多媒体。目前ActiveX已经成为热门技术。另一种播放多媒体的技术是JavaApplet。它是用Java语言编写的应用于网页之

中的小应用程序，相比于插件和ActiveX，JavaApplet具有更大的灵活性和良好的跨平台能力，因此具有很好的发展前景。总之，技术的不断发展使多媒体元素在网页艺术设计中的综合运用越来越广泛，使浏览者可以享受到更加完美的视听效果。这些新技 术的出现，也对网页的艺术设计提出了更高的要求。

2.版式设计

网页的版式设计同报刊杂志等平面媒体的版式设计有很多共同之处，它在网页的艺术设计中占据着重要的地位。所谓网页的版式

设计，是在有限的屏幕空间上将视听多媒体元素进行有机的排列组合，将理性思

维个性化的表现出来，是一种具有个人风格和艺

术特色的视听传达方式。它在传达信息的同时，也产生感官上的美感和精神上的享受。

但网页的排版与书籍杂志的排版又有很多差异。印刷品都有固定的规格尺寸，网页则不然，它的尺寸是由读者来控制的。这使网

页设计者不能精确控制页面上每个元素的尺寸和位置。而且，网页的组织结构不像印刷品那样为线性组合，这给网页的版式设计 带来了一定的难度。

二、网页艺术设计的原则

网页作为传播信息的一种载体，同其他出版物如报纸、杂志等在设计上有许多共同之处，也要遵循一些设计的基本原则。但是，由于表现形式、运行方式和社会功能的不同，网页设计又有其自身的特殊规律。网页的艺术设计，是技术与艺术的结合，内容与

形式的统一。它要求设计者必须掌握以下三个主要原则：

1.主题鲜明

视觉设计表达的是一定的意图和要求，有明确的主题，并按照视觉心理规律和形式将主题主动地传达给观赏者。诉求的目的，是使主题在适当的环境里被人们即时地理解和接受，以满足人们的实用和需求，这就要求视觉设计不但要单纯、简练、清晰

和精确，而且在强调艺术性的同时，更应该注重通过独特的风格和强烈的视觉冲击力，来鲜明地突出设计主题。

根据认知心理学的理论，大多数人在短期记忆中只能同时把握４到７条分立的信息，而对多于７条的分立信息或者不分立的信息

容易产生记忆上的模糊或遗忘，概括起来就是：较小而分立的信息要比较长而不分立的信息更为有效和容易浏览。这个规律蕴含

在人们寻找信息和使用信息的实践活动中，它要求视觉设计者的设计活动必须自觉地掌握和遵从。

作为视觉设计范畴一种的网页艺术设计，其最终目的是达到最佳的主题诉求效果。这种效果的取得，一方面通过对网页主题思想

运用逻辑规律进行条理性处理，使之符合浏览者获取信息的心理需求和逻辑方式，让浏览者快速地理解和吸收；另一方面通过对

网页构成元素运用艺术的形式美法则进行条理性处理，更好地营造符合设计目的的视觉环境，突出主题，增强浏览者对网页的注

意力，增进对网页内容的理解。只有两个方面有机地统一，才能实现最佳的主题诉求效果。

优秀的网页设计必然服务于网站的主题，就是说，什么样的网站，应该有什么样的设计。例如，设计类的个人站点与商业站点性

质不同，目的也不同，所以评论的标准也不同。网页艺术设计与网站主题的关系应该是这样：首先，设计是为主题服务的；其次，设计是艺术和技术结合的产物，就是说，即要“美”，又要实现“功能”；最后，“美”和“功能”都是为了更好地表达主题

。当然，有些情况下，“功能”即是“主题”，还有些情况下，“美”即是主题。例如，雅虎作为一个搜索引擎，首先要实现

“搜索”的“功能”。它的主题即是它的“功能”。而一个个人网站，可以只体现作者的设计思想，或者仅仅以设计出“美”的 网页为目的。它的主题只有一个，就是——美。

只注重主题思想的条理性而忽视网页构成元素空间关系的形式美组合，或者只重视网页形式上的条理而淡化主题思想的逻辑，都

将削弱网页主题的最佳诉求效果，难以吸引浏览者的注意力，出现平庸的网页设计或使网页设计以失败而告终。

要使网页从形式上获得良好的诱导力，鲜明地突出诉求主题，具体可以通过对网页的空间层次、主从关系、视觉秩序及彼此间的 逻辑性的把握运用来达到。

2.形式与内容统一

任何设计都有一定的内容和形式。内容是构成设计的一切内在要素的总和，是设计存在的基础，被称为“设计的灵魂”；形式

是构成内容诸要素的内部结构或内容的外部表现方式。设计的内容就是指它的主题、形象、题材等要素的总和，形式就是它的

结构、风格或设计语言等表现方式。内容决定形式，形式反作用于内容。一个优秀的设计必定是形式对内容的完美表现。正如

黑格尔所说：“工艺的美就不在于要求实用品的外部造型、色彩、纹样去摹拟事物，再现现实，而在于使其外部形式传达和表

现出一定的情绪、气氛、格调、风尚、趣味，使物质经由象征变成相似于精神生活的有关环境。”（黑格尔《美学》第三卷）

一方面，网页设计所追求的形式美，必须适合主题的需要，这是网页设计的前提。只讲花哨的表现形式以及过于强调“独特的

设计风格”而脱离内容，或者只求内容而缺乏艺术的表现，网页设计都会变的空洞而无力。设计者只有将二者有机地统一起来，深入领会主题的精髓，再融合自己的思想感情，找到一个完美的表现形式，才能体现出网页设计独具的分量和特有的价值。另

一方面，要确保网页上的每一个元素都有存在的必要性，不要为了炫耀而使用冗余的技术。那样得到的效果可能会适得其反。

只有通过认真设计和充分的考虑来实现全面的功能并体现美感才能实现形式与内容的统一。

据有关资料所做的保守估计，目前在WWW上网页数据传输平均以每秒1.5k的速度到达客户端。假设某个网页为了丰富其艺术性而

追赶时髦地大量使用图像或其它多媒体元素等，虽然达到了其静态形式美的效果，却造成多达几十K甚至更大的网页数据，使浏

览者必须等待很长时间才能看到“庐山真面目”，这样的网页就不是一个优秀的网页，因为它不符合网页传播信息的突出特性之

一——快捷性，使网页内容不能很快地到达访问者，影响了访问效果和质量，损害了访问者的情趣和积极性，这种技术要素影响 了传达信息的效果，因而不是形式与内容的完美统一。

网页具有多屏、分页、嵌套等特性，设计者可以对其进行形式上的适当变化以达到多变性处理效果，丰富整个网页的形式美。这

就要求设计者在注意单个页面形式与内容统一的同时，更不能忽视同一主题下多个分页面组成的整体网页的形式与整体内容的统一。

因此，在网页设计中必须注意形式与内容的高度统一。

3.强调整体

网页的整体性包括内容和形式上的整体性，这里主要讨论设计形式上的整体性。

网页是传播信息的载体，它要表达的是一定的内容、主题和意念，在适当的时间和空间环境里为人们所理解和接受，它以满足

人们的实用和需求为目标。设计时强调其整体性，可以使浏览者更快捷、更准确、更全面地认识它、掌握它，并给人一种内部

有机联系、外部和谐完整的美感。整体性也是体现一个站点独特风格的重要手段之一。

网页的结构形式是由各种视听要素组成的。在设计网页时，强调页面各组成部分的共性因素或者使诸部分共同含有某种形式特

征，是求得整体的常用方法。这主要从版式、色彩、风格等方面入手。例如：在

版式上，将页面中各视觉要素作通盘考虑，以

周密的组织和精确的定位来获得页面的秩序感，即使运用“散”的结构，也是经过深思熟虑之后的决定；一个站点通常只使用

两到三种标准色，并注意色彩搭配的和谐；对于分屏的长页面，不可设计完第一屏再考虑下一屏。同样，整个网页内部的页面，都应统一规划，统一风格，让浏览者体会到设计者完整的设计思想。

从某种意义上讲，强调网页结构形式的视觉整体性必然会牺牲灵活的多变性，“物极必反”就是这个道理。因此，在强调网页

整体性设计的同时必须注意：过于强调整体性可能会使网页呆板、沉闷，以致影响访问者的情趣和继续浏览的欲望。“整体” 是“多变”基础上的整体。

三、网页艺术设计的特点

1.交互性与持续性

网页不同于传统媒体之处，就在于信息的动态更新和即时交互性。即时的交互性是Web成为热点的主要原因，也是网页设计时

必须考虑的问题。传统媒体（如广播、电视节目、报刊杂志等）都以线性方式提供信息，即按照信息提供者的感觉、体验和事

先确定的格式来传播。而在Web环境下，人们不再是一个传统媒体方式的被动接受者，而是以一个主动参与者的身份加入到信息 的加工处理和发布之中。这种持续的交互，使网页艺术设计不像印刷品设计那样，发表之后就意味着设计的结束。网页设计人

员必须根据网站各个阶段的经营目标，配合网站不同时期的经营策略，以及用户的反馈信息，经常地对网页进行调整和修改。

例如，为了保持浏览者对网站的新鲜感，很多大型网站总是定期或不定期的进行改版，这就需要设计者在保持网站视觉形象一 贯性的基础上，不断创作出新的网页设计作品。

2.多维性

多维性源于超级链接，主要体现在网页设计中对导航的设计上。由于超级链接的出现，网页的组织结构更加丰富，浏览者可以

在各种主题之间自由跳转，从而打破了以前人们接收信息的线性方式。例如，可将页面的组织结构分为序列结构、层次结构、网状结构、复合结构等。但页面之间的关系过于复杂，不仅使浏览者检索和查找信息增加了难度，也给设计者带来了更大的困

难。为了让浏览者在网页上迅速找到所需的信息，设计者必须考虑快捷而完善的导航设计。

印刷品中导航问题不是那么突出，如果一个句子在页尾突然终止，读者会很自然地翻到下一页查找剩余部分，为了帮助读者找

到他们要找的信息，出版者提供了目录、索引或脚注。如果文章从期刊中的一页跳到后面的非顺序页时，读者会看到类似于

“续68页”这样的指引语句。然而，作为一名网页设计者，你以前所学的导航技术没有一种完全适合于网页导航。在替浏览者

考虑得很周到的网页中，导航提供了足够的、不同角度的链接，帮助读者在网页的各个部分之间跳转，并告知浏览者现在所在 的位置、当前页面和其他页面之间的关系等。而且，每页都有一个返回主页的按钮或链接，如果页面是按层次结构组织的，通

常还有一个返回上级页面的链接。对于网页设计者来说，面对的不是按顺序排列的印刷页面，而是自由分散的网页，因此必须

考虑更多的问题。如：怎样构建合理的页面组织结构，让浏览者对你提供的巨量信息感到条理？怎样建立包括站点索引、帮助

页面、查询功能在内的导航系统？这一切从哪儿开始，到哪儿结束？

3.多种媒体的综合性

目前网页中使用的多媒体视听元素主要有文字、图像、声音、视频等，随着网络带宽的增加、芯片处理速度的提高以及跨平

台的多媒体文件格式的推广，必将促使设计者综合运用多种媒体元素来设计网页，以满足和丰富浏览者对网络信息传输质量

提出的更高要求。目前国内网页已经出现了模拟三维的操作界面，在数据压缩技术的改进和流（Stream）技术的推动下，Internet网上出现实时的音频和视频服务，典型的有在线音乐、在线广播、网上电影、网上直播等。因此，多种媒体的综合

运用是网页艺术设计的特点之一，是未来的发展方向。

4.版式的不可控性

网页版式设计与传统印刷版式设计有着极大的差异：

(1)印刷品设计者可以指定使用的纸张和油墨，而网页设计者却不能要求浏览者使用什么样的电脑或浏览器；

(2)网络正处于不断发展之中，不象印刷那样基本具备了成熟的印刷标准；

(3)网页设计过程中有关Web的每一件事都可能随时发生变化。

这一切说明，网络应用尚处在发展之中，关于网络应用也很难在各个方面都制订出统一的标准，这必然导致网页版式设 计的不可控制性。其具体表现为：

(1)网页页面会根据当前浏览器窗口大小自动格式化输出；

(2)网页的浏览者可以控制网页页面在浏览器中的显示方式；

(3)不同种类、版本的浏览器观察同一个网页页面，效果会有所不同；

(4)用户的浏览器工作环境不同，显示效果也会有所不同。

把所有这些问题归结为一点，即网页设计者无法控制页面在用户端的最终显示效果，但这也正是网页设计的吸引人之处。

5.技术与艺术结合的紧密性

设计是主观和客观共同作用的结果，是在自由和不自由之间进行的，设计者不能超越自身已有经验和所处环境提供 的客观条件限制，优秀设计者正是在掌握客观规律基础上得到了完全的自由，一种想象和创造的自由。网络技术主

要表现为客观因素，艺术创意主要表现为主观因素，网页设计者应该积极主动地掌握现有的各种网络技术规律，注

重技术和艺术紧密结合，这样才能穷尽技术之长，实现艺术想象，满足浏览者对网页信息的高质量需求。

例如，浏览者欣赏一段音乐或电影，以前必须先将这段音乐或电影下载回本地机器，然后使用相应的程序来播放，由于音频或视频文件都比较大，需要较长的下载时间。流（Stream）技术出现以后，网页设计者充分、巧妙地应

用此技术，让浏览者在下载过程中就可以欣赏这段音乐或电影，实现了实时的网上视频直播服务和在线欣赏音乐

服务，无疑增强了页面传播信息的表现力和感染力。

网络技术与艺术创意的紧密结合，使网页的艺术设计由平面设计扩展到立体设计，由纯粹的视觉艺术扩展到空间

听觉艺术，网页效果不再近似于书籍或报刊杂志等印刷媒体，而更接近于电影或电视的观赏效果。技术发展促进了

技术与艺术的紧密结合，把浏览者带入一个真正现实中的虚拟世界。

四 结 束 语

网页作为一种新的视觉表现形式，它的发展虽然没有多长时间，它兼容了传统平

面设计的特征，又具备其

所没有的优势，成为今后信息交流的一个非常有影响的途径。网页设计是一种综合性的设计，它所涉及的范围非常的广泛，包括消费者心理学、视觉设计美学、人机工程、哲学等诸多方面，当然也离不开一定的科学技术发展。在本文中只从视

觉传达的角度进行了一些阐述与分析。好的网页设计除首先应考虑其内容上的精益求精外，其次就是对内容合理有效的视

觉编排。美是任何网页所必需具备的基本因素，网页信息不仅是为了满足使用者的需求，更重要的是创造一种愉悦的视觉

环境，技术与艺术的紧密结合在网页艺术设计中体现得尤为突出。参 考 文 献

(1)谢依君.电子报的新闻介面分析(D).台北：台湾国立政治大学新闻学系，1999.(2)唐良瑞，蔡安妮，孙景鳌.从认知心理及人机界面谈网页设计(J).工程图学学报，2000，(2)：31-36.(3)徐珂，苗彤，赵晖.网页视觉与设计(M).北京：人民邮电出版社，2001.(4)李砚祖，芦影.视觉传达的历史与美学(M).北京：中国人民大学出版社，2000.(5)何苏六.网络媒体的策划与编辑(M).北京：北京广播学院出版社，2001.

第四篇：计算机网页设计毕业论文（范文）

计算机网页设计毕业论文

计算机网页设计毕业论文

asp技术在交互式网页设计中的运用

一、asp技术简介

asp技术 asp（active server pages动态网页）是微软公司推出的一种用以取代cgi（common gateway interface通用网关接口）的技术。目前，internet上的许多基于windows平台的web站点已开始应用asp来替换cgi。简单地讲，asp是一个位于服务器端的脚本运行环境，通过这种环境，用户可以创建和运行动态的交互式web服务器应用程序，如交互式动态网页，包括使用html表单收集和处理信息，上传与下载等等。通常情况下，用户通过浏览器看到的网页大多是静态的，目前internet 上的许多站点，仍然提供'静态'（static）的主页内容。所谓'静态'，指的就是站点的主页内容是'固定不变'的。当浏览器通过internet 的http(hypertext transport protocol)协议，向站点服务器(web server)要求提供主页的内容时，站点服务器收到要求后，就传送原已设计好的静态的html 的文件数据给浏览器。一个'静态'的站点，若要更新主页的内容，必须手动的来更新其html的文件数据。而随着web应用的发展，用户希望能够看到根据要求而动态生成的主页，例如响应用户查询数据库的要求、生成报表等。当在浏览器上填好表单(form)的输入数据，以提供http要求时，可以在站点服务器中执行的应用程序，而不只是一个html 文件。

站点服务器收到要求执行的应用程序，分析表单(form)的输入数据，将执行的结果以html的格式传送给浏览器。根据用户请求生成动态主页的传统方法有cgi、isapi等。cgi是根据浏览器端的http请求激活响应进程，每一个请求对应一个进程。当同时有很多请求时，程序挤占系统资源，造成效率低下；isapi针对这一缺点进行改进，利用dll（动态链接库）技术，以线程代替进程，提高了性能和速度，但要考虑线程的同步问题，而且开发步骤烦琐。这两种技术和另一普遍使用的开发动态网页的技术java都还存在着另外一个问题，那就是开发困难，程序的开发和html写作是两个完全不同的过程，需要专门的程序员开发。而较简单的开发技术如javascript和idc(internet database connector)等功能有限，不敷使用。

asp使用的activex技术基于开放设计环境，用户可以自己定义和制作组件加入其中，使自己的动态网页几乎具有无限的扩充能力，这是传统的cgi等程序所远远不及的地方。asp与常见的在client端实现动态主页的技术如java applet、activex control、vbscript、javascript等不同，asp中的命令和script语句都是由服务器来解释执行的，执行结果产生动态生成的web页面并送到浏览器；而client端技术的script命令则是由浏览器来解释执行。由于asp是在服务器端解释执行，开发者可以不必考虑浏览器是否支持asp；同时由于它在服务器端执行，开发者也不必担心别人下载程序从而窃取编程逻辑。

asp通过后缀名为.asp的asp文件来实现，一个.asp文件相当于一个可执行文件，因此必须放在web服务器上有可执行权限的目录下。当用户从浏览器输入了.asp文件的地址后，浏览器就将这个url请求发给web server，如果web server上装了asp，就调用asp。asp读出相应.asp文件，解释并执行命令，动态生成一个html页面回传web server，然后web server再把结果发送给浏览器。asp文件的制作和html类似，且和html开发集成，可以在同一个过程完成，利用asp将可以执行的脚本嵌入到html文件中(将html文件的后缀名改为.asp)，这使得html文件的编写与脚本的开发融合在一起。通过asp内置的对象、服务器组件（server component）可以完成非常复杂的任务，而且用户还可以自己开发或利用别人开发的服务器组件完成专门的任务。asp比较网关及服务器扩展模式有着以下优点：

(1)完全与html文件融合在一起；

(2)容易创建，不需要其它编译、链接程序；

(3)面向对象的并通过activex server对象可扩展。

二、电子商务数据访问方式

电子商务是指通过电子方式，并在网络基础上实现物资、人员过程的协调，以便商业交换的活动。在电子商务系统中，web提供了与客户进行通信联络的有效手段，利用web技术，实现web服务器与数据库系统的连接，完成对数据的处理与查询，用户可以通过操作简单易学的浏

览器来查询处理所需要的各种数据。实现web服务器与数据库的连接一般有两种方法：一种是利用中间件技术在两者之间建立连接和通信，如cgi(通用网关接口)和api(应用程序编程接口)。

web服务器通过调用cgi程序实现与web浏览器的交互，即cgi程序接受浏览器发给web服务器的信息，进行处理后，将相应结果再送回给web服务器，通过web服务器将信息传送给浏览器。但cgi程序在响应速度和资源利用等方面有较大局限性，客户端每请求一个cgi程序，服务器端便打开一个进程，当请求的数量较大时容易引起瓶颈现象，开发人员常利用api编程来扩展服务器功能，api程序占系统资源少，运行效率较高，但它的编程较cgi程序更为复杂；另一种是由浏览器中的java小应用程序(java applet)通过浏览器访问web服务器上的数据库，利用了jdbc(java database connectivity)技术，它通过jdbc提供的api实现对web server的访问。由于java applet本身的局限性，目前大多数的应用是基于中间件技术的。asp也是属于中间件的一种模式，但在windows平台上它比较网关及服务器扩展模式有着较大的优点。网关的最大特点是它的平台无关性，但网关程序通常较难编写和改变。网关程序通常是一个独立的程序，并不和html文件融合在一起，它需要用如c、c++、vb、perl等语言来编写独立的应用程序，而asp应用改变了这一点。使用asp不仅可以读取access和 sql server的数据库，而且还可以读取其他odbc（open database connect 开放式数据库互联）兼容的数据库。

在asp中访问数据库是通过ado(activex database object活动数据对象)及事务处理语句来实现的。ado是一种操作microsoft所支持的数据库的方法，是一项容易使用并且可扩展的将数据库访问添加到 web 页的技术。ado对象的使用与dao（数据访问对象）、rdo（远程数据对象）的方式相似。在asp中，ado可以看作是一个服务器组件，更简单点说，是一系列的对象，应用这些功能强大的对象，即可轻松完成对数据库复杂的操作。

三、asp在电子商务中的应用

在电子商务中，对用户而言，进行网上信息查询的目的是寻找自己需要的产品或服务，而对于商品或服务提供者来说，其目的则是向用户推销自己的产品或服务。因此，让用户通过浏览器查询服务器的后端数据库是许多web服务提供者必需有的服务，asp通过内置的adodb组件来实现这一功能。可以使用ado去编写紧凑简明的脚本以便连接到odbc 兼容的数据库和 ole db 兼容的数据源。具体的操作步骤可以归纳为以下几步：

① 创建数据库源名（dsn）adodb通过odbc工作，因此要在odbc中设置dsn（数据源名）。打开windows的'控制面板'，双击'odbc'的图标，然后选择'文件 dsn '的属性页，单击<添加，选择数据库驱动程序，然后单击'下一步'，按照屏幕的指示键入数据源文件的名称，然后单击'下一步'，再单击'完成'创建数据源。

②创建数据库链接 链接用以保持一些关于正在访问的数据的动态信息，以及链接者信息。利用adodb的成员函数open和先前设定的dsn与数据库连接，其语法如下：

setconnect=server.createobject('adodb.connection')’创建了链接对象connect。connect.open('dsn=dsnname；uid=userid；pwd=password')’打开链接。dsnname为数据源名；userid为用户名；password为用户口令。③创建数据对象 ado中的数据对象通常保存的是查询结果。recordset 是ado中最复杂的对象，有许多属性和方法，灵活运用，可以达到许多好的效果。其创建方法如下： set recordset =connect.execute(sqtstr)’创建并打开了对象recordset，sqtstr是一个串，代表一条标准的sql语句。例如： sqlstr='select*from b1' set recordset =connect.execute(sqlstr)这条语句执行后，对象recordset中就保存了b1中的所有记录。

④操作数据库 可利用execute方便地执行数据的插入、修改、删除等操作。如执行插入操作： sqlstr='insert into b1values(1,2)' connect.execute(sqlstr)⑤关闭数据对象和链接 在使用了ado对象之后，一定要关闭数据对象和链接。在asp中通过调用方法close实现关闭。关闭创建的数据对象：record set.close set record set=nothing 关闭创建的链接对象：connect.close set connect=nothing 完整的程序片段：

//产生组件实例

<％

setconnect=server.createobject('adodb.connection')//连接数据库

connect.open('dsn=dsnname;uid=userid;pwd=password')//执行查询

sql=select＊fromtablename setrs=connect.execute(sql)％

//显示结果

<％dowhile not rs.eof％

<％=rs(fieldname)％ <％

rs.movenext

loop ％

上述是用asp访问数据库的全过程，由于应用面向对象思想，所有操作都比较简单，用户需要注意的仅是对数据结构的了解、当前所操作的对象及对象的属性等等，只要对这些有了清晰的认识，再加上asp强大功能，在网络上使用数据库，实现用户与页面间交换信息，就再也不是什么难事了。

第五篇：网页设计毕业论文1

网站的设计与制作

目 录

第一章

前言 第二章

1．1课题来源

1．2 网站开发项目需求分析 1．3 软件 1．4 软件运行环境 第二章 网站制作 2．1做网页的步骤 2.2做网页的要素 2．3 系统各模块功能实现 第三章 网站的设计 3．1 主页的要求 3．2 子页的要求 第四章 结束语 参考文献

11页 第1页

摘 要

汽车网站是一个结合了汽车销售等多功能浏览的汽车网站，我所使用的软件是Macromedia 公司推出的一款用于网页设计的软件——dreamweaver8。在网页的制作与链接中，我学到了很多。

关键词： 超链接 外观 性能

第一章

前言

1．1课题来源

随着二十一世纪新兴科技的飞速发展，如今的电子信息产业正在经受着一个巨大的挑战，同时也面临着一个重大的机遇。就目前的科技发展水平而言，电子信息产业的发展已经不能够满足社会化大生产的要求，因此，各个国家集中人力、财力加大对信息技术产业的投入，以适应目前需要。可喜的是在这几十年的发展中我们有了互联网。互联网加大了我们了解世界的眼界，缩紧了人与人之间的距离，这就更容易的使我们走上信息化的道路。

以往，人们出行都以自行车居多，后来公交事业发展壮大，人们便乘坐公交汽车，现如今，随着人们生活水平的提高，越来越多的家庭已经拥有或者想拥有自己的私家车。

正是因为人们的这些需求，越来越多的汽车网站出现在网络上，使人们可以随时了解自己想知道的汽车方面的新闻，真正的做到足不出户，便知天下事。把汽车销售与网络连接起来，是今

11页 第2页

后汽车销售发展的必然方向之一。1．2 网站开发项目需求分析

一个网站项目的确立是建立在各种各样的需求上面的，这种需求往往来自于客户的实际需求或者是出于公司自身发展的需要，其中客户的实际需求也就是说这种交易性质的需求占了绝大部分。面对对网站开发拥有不同知识层面的客户，项目的负责人对用户需求的理解程度，在很大程度上决定了此类网站开发项目的成败。因此如何更好地的了解、分析、明确用户需求，并且能够准确、清晰以文档的形式表达给参与项目开发的每个成员，保证开发过程按照满足用户需求为目的正确项目开发方向进行，是每个网站开发项目管理者需要面对的问题。据专家预计，2009年我国汽车需求量将超过850万辆。所以，做好汽车网站就是为了使广大的消费者提供及时和有效的信息，为其选择适合自己的产品提供良好的参考。

1．3 使用软件

dreamwraver软件由美国著名的网站应用开发工具生产厂商Adobe Macromedia于2005年6月推出并正式投入市场以来，已经发展得相当成熟。关于dreamwraver的技术介绍的相关书籍与网络信息相当丰富。通过大学中软件开发环境课程的学习，对dreamwraver有了比较深刻的认识，并比较轻松的掌握了

11页 第3页

dreamwraver的操作。因此，软件技术可以完成任务的要求。

1．4 软件运行环境

Dreamweaver是一款简体中文软件，可以在Win2003/WinXP中安全运行

第三章 网站制作

2．1制作网页的步骤

再做网页之前，我确定了做网页的五个步骤。

一、确定网站主题 ：网站主题就是要建立的网站所要包含的主要内容，一个网站必须要有一个明确的主题。

二、搜集材料 ：明确了网站的主题以后，你就要围绕主题开始搜集材料了。材料既可以从图书、报纸、光盘、多媒体上得来，也可以从互联网上搜集，然后把搜集的材料去粗取精，去伪存真，作为自己制作网页的素材。

三、规划网站 ：一个网站设计得成功与否，很大程度上决定于设计者的规划水平，规划网站就像设计师设计大楼一样，图纸设计好了，才能建成一座漂亮的楼房。网站规划包含的内容很多，如网站的结构、栏目的设置、网站的风格、颜色搭配、版面布局、文字图片的运用等，你只有在制作网页之前把这些方面都考虑到了，才能在制作时驾轻就熟，胸有成竹。也只有如此制作出来的11页 第4页

网页才能有个性、有特色，具有吸引力。

四、选择合适的制作工具 ：尽管选择什么样的工具并不会影响你设计网页的好坏，但是一款功能强大、使用简单的软件往往可以起到事半功倍的效果。

五、制作网页 ：材料有了，工具也选好了，下面就需要按照规划一步步地把自己的想法变成现实了，这是一个复杂而细致的过程，一定要按照先大后小、先简单后复杂来进行制作。所谓先大后小，就是说在制作网页时，先把大的结构设计好，然后再逐步完善小的结构设计。所谓先简单后复杂，就是先设计出简单的内容，然后再设计复杂的内容，以便出现问题时好修改。在制作网页时要多灵活运用模板，这样可以大大提高制作效率。

2.2制作网页的要素

1、网页的整体布局设计

网页设计作为一种视觉语言，要讲究编排和布局，虽然主页的设计不等同于平面设计，但它们有许多相近之处，应充分加以利用和借鉴。版式设计通过文字图形的空间组合，表达出和谐与美。一个优秀的网页设计者也应该知道哪一段文字图形该落于何处，才能使整个网页生辉。多页面站点页面的编排设计要求把页面之间的有机联系反映出来，特别要处理好页面之间和页面内的秩序与内容的关系。尤其是我们在利用网页效果体现在线营销的意图时，更要注意为了达到最佳的视觉表现效果，而讲究整体布

11页 第5页

局的合理性，比如一家生产型的企业，它所提供产品的名称、类别、型号、价格、功能介绍应怎样编排才能使浏览者有一个流畅的视觉体验，从而方便他对产品的了解，促成最后的购买。

2、网页设计中色彩的运用

色彩是艺术表现的要素之一，在网页设计中，根据和谐、均衡和重点突出的原则，将不同的色彩进行组合、搭配来构成美丽的页面。根据色彩对人们心理的影响，合理地加以运用，按照色彩的记忆性原则，一般暖色较冷色的记忆性更强一些。色彩还具有联想与象征的特质，如红色象征血、太阳；蓝色象征大海、天空和水面等。所以如果我们在对一家出售冷食的商店进行虚拟店面的页面设计时，应使用淡雅而沉静的颜色，使人心理上感觉凉爽一些，增强人们的购买心理，使得在线营销得到很好的实践效果。另要注意的是网页的颜色应用虽没有限制，但不能毫无节制地运用多种颜色，一般情况下，先根据总体风格的要求定出一至二种主色调，在已经有了完备的CIS（企业形象识别系统）的企业进行网页设计时，更应该按照其中的VI进行色彩运用。在色彩的运用过程中，还应注意的一个问题是：由于国家和种族、宗教和信仰的不同，以及生活的地理位置、文化修养的差异等，不同的人群对色彩的喜恶程度有着很大的差异。如：儿童喜欢对比强烈、个性鲜明的纯颜色；生活在草原上的人喜欢红色；生活在闹市中的人喜欢淡雅的颜色；生活在“沙漠”中的人喜欢绿色。在设计中要考虑众多因素。

11页 第6页

3、网页形式与内容相统一

要将丰富的意义和多样的形式组织成统一的页面结构，形式语言必须符合页面的内容，体现内容的丰富含义。运用对比与调和、对称与平衡、节奏与韵律以及留白等手段，通过空间、文字、图形之间的相互关系建立整体的均衡状态，产生和谐的美感。如对称原则在页面设计中，它的均衡有时会使页面显得呆板，但如果加入一些富有动感的文字、图案，或采用夸张的手法来表现内容往往会达到比较好的效果。点、线、面作为视觉语言中的基本元素，要使用点、线、面的互相穿插、互相衬托、互相补充构成最佳的页面效果。网页设计中点、线、面的运用并不是孤立的，很多时候都需要将它们结合起来，表达完美的设计意境。

2．3 系统各模块功能实现

1.系统登录模块

1）该功能模块可以记录客户的邮箱地址，交易时还可以向客户发送交易信息，到帐确认等等。

2）登陆后系统会调出客户的记录，按照交易量的不同客户享受的折扣也不同，系统主界面

2.车辆展示模块

1）该功能模块主要实现对车辆的展示。

2）该功能模块图片、文字介绍，360度flash对各种车辆的展示。

11页 第7页

3.账号管理模块

1）挂失业务在正常工作中肯定会遇到挂失的业务，确定挂失后，数据库会将该账号挂起，等待客户做进一步操作。

2）冻结业务，客户对账号有冻结的权利，在客户没有输入解冻密码之前，任何人都无法动用帐上的资金。

3）流水查询客户可以查询曾经交易过的记录。

4）客户可以自行对其账号密码进行修改，网站管理人员也可以添加或删除账号。

第三章 网站的设计

3．1 主页的要求

对于销售业务系统要求运行的工作环境稳定，易于操作，界面美观大方，对于前台展示界面要求系统便于维护，安全可靠，对于广大客户所要执行的操作简单易懂，远程访问速度较快，界面友好美观，有基本的错误提醒功能，远程操作数据库正确，要求和客户有一定的互动性，在主页上直观的就可以查看浏览者所想要了解的东西。3．2子页的要求

后面的工作就是子页的选择与链接，子页应该丰富多彩，内容充实，浏览性强，比如说，想要销售一辆汽车，应该有它的全部资料，包括外观、内饰、性能指标、出产地、价格等诸多方面，鉴于以上方面，我开始了子页的选择与链接。

第四章 结束语

11页 第8页

在系统的需求分析过程中，由于不熟悉，产生了很大的困难，通过与指导老师的探讨与沟通，我渐渐地对系统有了一个大体的认识。虽然说在系统需求分析过程中花费了很多时间，但是我认为这是必要的也是必须的。

致 谢

在整个毕业设计过程中，指导教师给了我极大的帮助，并给予我悉心的关怀与指导，在此表示衷心地感谢。老师认真负责的工作态度、严谨的治学风格，使我深受启发。开发的同时，和同组同学们之间的相互探讨也使我获益匪浅，在开发工具的选择上，她给了我不少的指导，在此也表示衷心地感谢。在此同时也给了我不少的指导工作，在此也表示衷心地感谢。

参考文献

〈1〉《信息技术》江苏科学技术出版社 〈2〉《网页制作》人民邮电出版社

<3>《dreamweaver8参考手册》2008年版。

11页 第9页