计算机网站设计毕业论文

网站毕业论文

山西职业技术学院

计算机工程系

毕业设计论文

论文题目：

动漫网站的实现 专 业： 计算机应用技术 班 级： 计应A902

姓 名：

指导教师：

___2011____年 _12__月 _2__日

网站毕业论文

目录

小小动漫的设计与实现 ...................................................................... 3

前言 .................................................................................................... 4

一、Internet 简介 ...................................................................... 5

二、网站与网页 ............................................................................ 6

三、ISP与WEB服务器.................................................................. 7

四、站点 ....................................................................................... 7

五、空间 ...................................................................................... 7

第二部分、网站制作工具介绍 ........................................................... 8

一、 Dreamweaver简介 .............................................................. 8

二、Photoshaop 简介................................................................. 10

三、 Flash 简介 ........................................................................11

第三部分、网站制作过程 .............................................................. 12

一、 网站示意图 ..................................................................... 12

二、设计思想 ............................................................................ 13

三、网站模块简介 .................................................................... 13

四、特效的实现 ........................................................................ 15

第四部分 网站制作的心得 ............................................................ 17

网站毕业论文

摘要

小小动漫的设计与实现

在Internet飞速发展的今天，互联网成为人们快速获取、发布和传递信息的重要渠道，它在人们政治、经济、生活等各个方面发挥着重要的作用。Internet上发布信息主要是通过网站来实现的，获取信息也是要在Internet“海洋”中按照一定的检索方式将所需要的信息从网站上下载下来。因此网站建设在Internet应用上的地位显而易见，它已成为政府、企事业单位信息化建设中的重要组成部分，从而倍受人们的重视。随着网络的出现，网页逐渐融入人们的生活。快速及时的新闻浏览，五彩缤纷的网上信息，网络与人们的生活息息相关，于是世界上又出现了第三媒体——Internet。制作网页是企业和个人的宣传自己的重要手段，同时也是学习者获取学习信息的重要手段，尤其是在教育领域，在素质教育与终身教育成为必然的今天，人们对信息的需求有了更新，更高的要求，而网页由于本身所具有的信息量大，传递快速，没有时空限制等特点恰好满足这种要求。所以网页也逐渐成为一种新兴的教育资源。本论文在介绍网站建设基础知识的基础上，简述了我的动画网站“小小动漫”的设计与实现。

关键字：Internet 网页 网站 Flash 链接 信息 资源 动画

网站毕业论文

图片 代码 数据

前言

伴随着社会的发展和科学的进步，上网成为越来越多人们的选择。随着互联网的飞速发展，有关网络的技术也层出不穷。从静态网页到动态网页的变化也正说明了这一点。掌握动态网页的基本知识，以及动态网页设计原则和设计过程就显得尤为重要，网页逐渐融入人们的生活。在这即将毕业之际，我将用我这一年来所学的网站方面的知识，来简单介绍一下我的动画网站---------小小动漫的设计思想。这是一个以各种动画图片以及Flash为主题的网站。在这里，有我对动画设计的诸多热情，还有对当初学习网页设计的浓浓兴趣爱好，同时也有我对以往学习中的深刻回忆。

网站毕业论文

第一部分、 网站建设相关知识

一、Internet 简介

Internet意为国际互联网络，由遵循TCP/IP(Transmission Control Protocol / Internet Protocol）协议的众多网络互联而成，现已覆盖世界176多个国家和地区，拥有6000万多个网络，联接主机近 500万台，600多个大型图书馆，400多个学术文献库，100多万个信息源，用户已近上亿，其中国内用户已超过15 万，预计到2000年全球用户将达到二亿，成为名副其实的跨越时空和地域的全球最大的计算机网络，又称“环球网”。 Internet计算机存储的信息则汇成了信息资源的大海洋。信息内容无所不包：有学科技术的各种专业信息，也有与大众日常工作与生活息息相关的信息；有严肃主题的信息，也有体育、娱乐、旅游、消遣和奇闻逸事一类的信息；有历史档案信息，也有现实世界的信息；有知识性和教育性的信息，也有消息和新闻的传媒信息；有学术、教育、产业和文化方面的信息，也有经济、金融和商业信息等等。信息的载体涉及几乎所有媒体，如文档、表格、图形、影象、声音以及它们的合成。信息容量小到几行字符，大到一个图书馆。信息分布在世界各地的计算机上，以各种可能的形式存在，如文件、数据库、公告牌、目录文档和超文本文档等。而且这些信息还在不断的更新和变化中。可以说，这里

网站毕业论文

是一个取之不尽用之不竭的大宝库。

Internet的另一种资源是计算机系统资源，包括连接在Internet的各种网络上的计算机的处理能力、存储空间（硬件资源）以及软件工具和软件环境（软件资源）。一般地说，要求使用计算机系统的Internet用户，如科学家、工程师、设计师、教师、学生或每一个普通用户，都可以通过远程登录到达某台目标计算机，只要这台计算机允许你使用并建立了你的登录帐号。你可以象使用自己的计算机一样使用它们！

当你进入Internet后就可以利用其中各个网络和各种计算机上无穷无尽的资源，同世界各地的人们自由通信和交换信息，以及去做通过计算机能做的各种各样的事情，享受Internet为我们提供的各种服务。

二、网站与网页

网站是由网页集合而成的，而大家通过浏览器所看到的画面就是网页，网页说具体了是一个html文件，浏览器是是用来解读这份文件的。也可以这样说：网页是有许多html文件集合而成。至于要多少网页集合在一起才能称作网站，这可就没有规定了，即使只有一个网页也能被称为网站。 而我们想要制作一个网站，就需要单独编辑若干个html文件，然后通过“超链接”把它们连接在一起，这样一个属于自己的网站就制作出来了。 因特网中，如果要从一台计算机访问网上另一台计算机，就必须知道对方的网址。这里所说的网址实际上指两个内涵，即IP地址和域名地址。

网站毕业论文

网页，又分为两类-------静态网页和动态网页：静态网页的内容更新必须由网页制作者不断重复制作页面来完成，这将给网页制作者增加很大的工作量。动态网面具有很多优点，只要更新数据库中的内容就行了，与静态网页相比，动态网页大大节省了维护时间与维护成本。

三、ISP与WEB 服务器

ISP(Internet Service Provider)，互联网服务提供商，即向广大用户综合提供互联网接入业务、信息业务、和增值业务的电信运营商。ISP是联网服务提供商，通常是给你提供网络接入的。准确的说，企业的WEB服务器要接入互联网络，都得由ISP提供接入。如果没有组织。没有自己的服务器，就必须借助于寄存服务器，ISP可以提供网站寄存服务，我们做好的网站就是放在这个ISP提供的寄存器中。

四、站点

站点（site）是指在物理上具有较好的线路连接的能实现较快通信速率的计算机的集合（一般是指一个局域网）；站点之间一般是通过慢速连接来实现信息通信（一般是指广域网）；站点是对网上计算机的实际的物理分布的一种客观反映。

五、空间

网站毕业论文

网站空间英文名：Webhost。简单地讲，就是存放网站内容的空间。网站空间也称为虚拟主机空间，通常做网站都不会自己架服务器，而是选择以虚拟主机空间做为放置网站内容的网站空间。网站空间指能存放网站文件和资料，包括文字、文档、数据库、网站的页面、图片等文件的容量。

第二部分、网站制作工具介绍

网站开发首先是用户提出功能。然后结合用户的功能要求设计布局，出平面网页设计稿，主要是首页，文章，列表，子栏目等代表性页面。需要对 photoshop dreamweaver fireworks flash 这些软件进行熟悉的掌握。

一、 Dreamweaver简介

Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。甚至可以排序或格式化表格群组，Dreamweaver 支援精准定位，利用可轻易转换成表格的图层以拖拉置放的方式进行一些简单的版面配置。所见即所得 Dreamweaver成功整合动态式出版视觉编辑及电子商务功能，提供超强的支援能力给Third-party厂商，包含ASP， Apache，BroadVision， Cold Fusion，iCAT， Tango与自行发展的应用软体。当您正使用

网站毕业论文

Dreamweaver在设计动态网页时，所见即所得的功能，让您不需要透过浏览器就能预览网页。梦幻样版和XML Dreamweaver将内容与设计分开，应用于快速网页更新和团队合作网页编辑。建立网页外观的样版，指定可编辑或不可编辑的部份，内容提供者可直接编辑以样式为主的内容却不会不小心改变既定之样式。您也可以使用样版正确地输入或输出XML内容。 全方位的呈现利用Dreamweaver设计的网页，可以全方位的呈现在任何平台的热门浏览器上。对于cascading

style sheets的动态HTML支援和鼠标换图效果，声音和动画的DHTML效果资料库可在Netscape和Microsoft浏览器上执行。使用网站地图可以快速制作网站雏形、设计、更新和重组网页。改变网页位置或档案名称，Dreamweaver 会自动更新所有连结。使用支援文字、HTML码、HTML属性标签和一般语法的搜寻及置换功能使得复杂的网站更新变得迅速又简单。使用不同浏览器检示功能，Dreamweaver可以告知您在不同浏览器上执行的成效如何。当有新的浏览器上市时，只要从Dreamweaver的网站在下载它的描述档，便可得知详尽的成效报告。

Dreamweaver可以用最快速的方式将Fireworks，FreeHand，Gif或Photoshop等档案移至网页上。使用检色吸管工具选择荧幕上的颜色可设定最接近的网页安全色。对于选单，快捷键与格式控制，都只要一个简单步骤便可完成。Dremweaver能与您喜爱的设计工具，如Playback Flash，Shockwave和外挂模组等搭配，不需离开Dremweaver便可完成，整体运用流程自然顺畅。除此之外，只要单击便可使

网站毕业论文

Dreamweaver自动开启Firework或Photoshop来进行编辑与设定图档的最佳化。

二、Photoshaop 简介

Photoshop主要处理以像素（Pixels）所构成的数字图像。利用其广泛的编修与绘图工具，可以更有效的进行图片编辑工作。独特的历史纪录浮动视窗和可编辑的图层效果功能使用户可以方便的测试效果。对各种滤镜的支持更令使用户能够轻松创造出各种奇幻的效果。目前，Photoshop也正在被更多的用于处理网络图片。Photoshop的几个后续版本中捆绑了一个独立的软件ImageReady，从而加强了Photoshop对网络图像（主要是GIF图像文件）的支持功能。而在软件CS3当中ImageReady被Fireworks所代替。Photoshop CS3允许用户更容易升级到最新的硬件平台，支持苹果的Intel为内核的系统。 Photoshop CS3最大的改变是工具箱，变成可伸缩的，可为长单条和短双条。工具箱上的快速蒙版模式和屏幕切换模式也改变了切换方法。工具箱的选择工具选项中，多了一个组选择模式，可以自己决定选择组或者单独的图层。工具箱多了快速选择工具Quick Selection Tool，应该魔术棒的快捷版本，可以不用任何快捷键进行加选， 按往不放可以像绘画一样选择区域，非常神奇。当然选项栏也有新、加、减三种模式可选，快速选择颜色差异大的图像会非常的直观、快捷。 所有的选择工具都包含重新定义选区边缘(Refine Edge)

网站毕业论文

的选项，比如定义边缘的半径，对比度，羽化程度等等，可以对选区进行收缩和扩充。另外还有多种显示模式可选，比如快速蒙版模式和蒙版模式等，非 常 方便。举例来说，您做了一个简单的羽化，可以直接预览和调整不同羽化值的效果。当然，选择菜单里熟悉 的羽化命令从此退出历史舞台。

三、 Flash 简介

Flash的前身是Future Wave公司的Future Splash，是世界上第一个商用的二维矢量动画软件，用于设计和编辑Flash文档。1996年11月，美国Macromedia公司收购了Future Wave，并将其改名为Flash。在出到Flash 8以后，Macromedia又被Adobe公司收购。最新版本为：Adobe Flash Professional CS5.5。Flash通常也指Macromedia Flash Player(现Adobe Flash Player)，用于播放Flash文件Flash 是一种创作工具，设计人员和开发人员可使用它来创建演示文稿、应用程序和其它允许用户交互的内容。Flash 可以包含简单的动画、视频内容、复杂演示文稿和应用程序以及介于它们之间的任何内容。通常，使用 Flash 创作的各个内容单元称为应用程序，即使它们可能只是很简单的动画。您也可以通过添加图片、声音、视频和特殊效果，构建包含丰富媒体的 Flash 应用程序。

Flash 特别适用于创建通过 Internet 提供的内容，因为它的文件非常小。Flash 是通过广泛使用矢量图形做到这一点的。

网站毕业论文

与位图图形相比，矢量图形需要的内存和存储空间小很多，因为它们是以数学公式而不是大型数据集来表示的。位图图形之所以更大，是因为图像中的每个像素都需要一组单独的数据来表示。 要在 Flash 中构建应用程序，可以使用 Flash 绘图工具创建图形，并将其它媒体元素导入 Flash 文档。接下来，定义如何以及何时使用各个元素来创建设想中的应用程序。

在 Flash 中创作内容时，需要在 Flash 文档文件中工作。Flash 文档的文件扩展名为 .fla (FLA)。Flash 文档有三个主要部分：

⊙时间轴用来通知Flash显示图形和其他项目元素的时间。也可以使用时间轴指定舞台上各种图形的分层顺序。

⊙库面板是Flash显示Flash文档中的媒体元素列表的位置。 ⊙ActionScript代码可以用来想文档中的媒体元素添加交

互式，可以添加代码以便用户在单击按钮时显示一幅新图像，还可以使用ActionScript想应用程序添加逻辑。

第三部分、网站制作过程

一、 网站示意图

网站毕业论文

二、设计思想

在这即将毕业之际，我将用我这两年来学的网站建设方面的知识，来简单介绍一下我的动画网站----小小动漫的设计思路。这是一个以动画为主题的网站。在这里，有我对动画制作的兴趣爱好，还有对以往学习过程中的深深体会与怀念；有我对在学校这两年生活与学习的记忆，还有我当年报专业时对计算机专业的热情和渴望......我的设计和选择是我对动漫方面浓厚兴趣的体现，我会在以后的工作和学习中更加努力专注我身边的每一次经历，用它们来充实我的每一步人生之路。

三、网站模块简介

我的网站主要包括六个模块：网站首页、动画背景、图片预览、人物资料、客户留言、联系我们。通过Dreamweaver软件对网页进行编辑。网页采用插入表格、插入层的方式进行编辑定位。网页的边框是用表格进行的编辑，边框值设置为3，没必要的表格设置的

网站毕业论文

边框值为0。这样既可以达到自己想要的结果，又能实现美化页面的效果。

首页给人的效果直接影响到浏览者是否有兴趣继续浏览其它的页面，因此每个网页制作者都会用心去设计他们的首页，我在首页中加了一些特效和精美的图片以及一些Flash动画，下面是其展示：

图1 首页显示

图2 首页显示

视频的制作是一些简单的流行动画预告片，如下图所示：

网站毕业论文

图3 链接展示

图片浏览、死神预告片展览、钢铁侠动画片展览主要运用的是相同的模块，只是通过可编辑区域对其中的相关内容进行了一些修改。在这三个模块中，层的显示与隐藏以及一些精美的图片和Flash在其中起着非常重要的作用。通过这些东西的实现，来增加网页整体效果的美化，从而吸引访问者对本网站的继续浏览。

而人物资料、联系我们主要是用表格来进行布局的，再加上我的一些个人信息组合而成。

四、特效的实现

（1）局中层代码

<head>

<style type="text/css">

<!--

网站毕业论文

.fatherBox { position: relative; width: 960px;

height:5px; margin:0px auto;}

...

-->

</style>

</head>

<body>

<div class="fatherBox" >

......页面具体内容.........

</div>

</body>

（2）滚动字幕代码

<p><marquee behavior="scroll" direction="rightt"

scrollamount="8">梦想是羽翼，然后飞向天空，热爱动画的你、、、可曾准备好 。。。</marquee></p>

<p><marquee behavior="alternate" direction="right"

scrollamount="8"><img src="图片/6.gif" width="75"

height="125" /><img src="图片/2.gif" width="75"

height="125" /><img src="图片/3.gif" width="75"

height="125" /><img src="图片/4.gif" width="75"

height="125" /><img src="图片/5.gif" width="75"

height="125" /><img src="图片/1.gif" width="75"

网站毕业论文

height="125" /><img src="图片/7.gif" width="75"

height="125" /><img src="图片/8.gif" width="75"

height="125" /><img src="图片/9.gif" width="75"

height="125" /><img src="图片/10.gif" width="75"

height="125" /><img src="图片/11.gif" width="75"

height="125" />

<img src="图片/12.gif" width="75" height="125" /><img src="图片/13.gif" width="75" height="125" /><img src="图片/14.gif" width="75" height="125" /><img src="图片

/15.gif" width="75" height="125" />

<img src="图片/16.gif" width="75" height="125" /><img src="图片/17.gif" width="75" height="125" /><img src="图片/18.gif" width="75" height="125" /><img src="图片

/19.gif" width="75" height="125" /></marquee></p>

（3）Flash透明特效代码

选中所需Flash，单击属性面板中的“参数”按钮，打开参数对话框，设置参数为wmode,值为transparent。

第四部分 网站制作的心得

网站毕业论文

通过这次网站的制作，我觉得要做好一个网站，必须注意一下内容。我就是按照以下思路进行制作的。

对于一个静态网站，应该：

◆想好主题

◆搜集素材（img,mp3,fla,avi）

◆进行网页的规划（表格，层，框架，模板）

◆动手操作（Dreamweaver），其中动画制作（flash）图像处理（ps）是主要的辅助工具。

网站毕业论文

致谢

现在的我，对静态网站的制作还可以，虽然做不出漂亮复杂的、具有交互功能的动态网站，但对于其基本的知识还是有一定的了解。在我学习网站建设以及Flash动画制作的过程中，老师都给了我很大的帮助，我在这里深深地感谢他们曾经无谓的付出，是他们每天辛苦的备课、认真的讲课，才使我学到了这么多宝贵的知识。

在制作论文的过程当中，从开始进入课题到论文的顺利完成，有很多老师和同学都给了我很大的帮助，其中我的指导老师康耀东从开始一直到论文结束都给了我很多的帮助，在学习中,康老师严谨的治学态度、丰富渊博的知识、敏锐的学术思维、精益求精的工作态度以及侮人不倦的师者风范是我终生学习的楷模，导师们的高深精湛的造诣与严谨求实的治学精神，将永远激励着我。这三年中还得到众多老师的关心支持和帮助。在此，谨向老师们致以衷心的感谢和崇高的敬意！

最后，我要向百忙之中抽时间对本文进行审阅，评议和参与本人论文答辩的各位老师表示感谢。

网站毕业论文

参考文献

1、教材 Dreamweaver CS3， Photoshaop CS2, Flash。

2、吴涛主编，网站全程设计技术（修订本），北京：清华大学出版

社；北京交通大学出版社。

3、沈大林主编， 中文Flash 8案例教程，中国铁道出版社。

4、武创、王惠主编, 设计探索之旅 ,电子工业出版社

本文来源：https://www.bwwdw.com/article/g7m4.html