-
毕业论文（设计）
关于
Dreamweaver
的网页设计<
/p>
———————————————————
—————————————
论文指导教师姓名：
所在系及专业名称：
___
电脑游戏
__________________
班级：
___
1005__
论文提交日期：
2013
年
4
月
1
日论文答辩日期：年月日
答辩委员会主席：
_____________
评阅人：
_____
老师
________
2012
年
4
月
1
日
摘
要
在
Internet
飞速发展的今天，互联
网已成为人们快速获取、发布和传递信息的
重要渠道，正以一种前所未有的冲击力影响着
人类的活动。它在人们政治、经济、生
活等各个方面发挥着重要的作用。因此网站建设在
Internet
应用上的地位显的格外
重要，它已成为政府、企事业单位信息化建设中的重要组成部分。
< br>现今的社会，
人们已经离不开了网络，
网络已经成为人与
人之间交流的一种形式，
它能够把事情的复杂化转为简单化，
摆
脱了时间和空间的限制。
网站为很多人提供了
一个网络生活空间
，通过其网页展示了企业介绍、城市文化、校园文化介绍、招商信
息、加盟程序、留言等
一系列内容的介绍。为了更好的宣传和服务于经济发展，我通
过制作一个网站来介绍宣传
一下我的家乡。
本文比较系统的阐述了有关网站建设方面
的相关
理论知识及该网站开发设计，
充分体现了计算机技术服务于经济建设的重要思
想。
关键词
:
网站建设，
Internet
，城市发展
Abstract
In the
Internet rapid development today, the Internet has
become a people
quickly
get,
release
and
transmit
information,
is
an
important
channel
in
an
unprecedented
wallop
affect
human
activities.
It
in
people
politics,
economy,
life
aspects
played
an
important
role.
Therefore
website
construction
in
the
Internet
application
status
of
especially
important
to
show,
and
it
has
become
the
government,
enterprises,
an
important
part
of
informatization
construction.
Today's
society, people have without the Internet, network
has become
between
a
form
of
communication,
it
can
make
things
complicated
to
simplicity,
get
rid
of
the
time
and
space
restrictions.
Web
site
for
many
people
provides
a
network
life
space,
through
its
web
demonstrate
the
enterprise
introduces,
urban
culture
and
campus
culture
introduction,
investment
promotion
information, join
procedure, introduced a series of content of the
message.
In
order
to
better
propaganda
and
in
the
service
of
the
economic
development,
and I made a
web site to introduce by propagandize the my
hometown. In this
paper expatiates
relevant website construction related theory
knowledge and
the website development
and design, fully embodies the computer technology
to serve economic construction
important thoughts.
Keywords:
目录
第一章前言
......................
.......................................
5
1
．
1<
/p>
课题来源
........................
...............................
5
1
．
2
网站开发项目需求分析
......
...................................
5
第二章网页制作概述
..................
...................................
6
2.1
网页的类型
..............................................
........
6
2.1.1
静态页面
..................................................
6
2.1.2
动态页面
..................................................
6
2.2
网页开发技术
..........
..........................................
7
2.3
网页布局
............
............................................
7
2.3.1
网页布局的基本概念
........................................
8
2.3.2
网页布局方法
............................................ ...
9
2.3.2
网页布局技术
.............................................
10
2.4
网页配色
.........
..............................................
11
2.5
网页设计流程
..........
.........................................
11
第三章涉及软件
......
..................................................
13
3.1 DreamWeaVer
cs3
介绍
...........................................
13
3.2 DreamWeaVer
cs3
操作界面
.......................................
13
第四章建立网页链接
....................................
错误！未定义书签。
4.1
文字链接
............
...........................................
14
4.2
图像链接
............
...........................................
15
4.3
在
HTML
语言中建立网页链接
......................................
15
第五章结论
........
..................................................
..
18
致谢
........
..................................................
........
19
第一章
前言
1
．<
/p>
1
课题来源
随
着二十一世纪新兴科技的飞速发展，
如今的信息产业正在经受着一个巨大的挑
战，
同时也面临着一个重大的机遇。
就目前的科技
发展水平而言，
信息产业的发展已
经不能够满足社会化大生产的
要求，
因此，
各个国家集中人力、
财力
加大对信息技术
产业的投入，
以适应目前需要。
可喜的是在这几十年的发展中我们有了互联网。
互联
网
加大了我们了解世界的眼界，
缩紧了人与人之间的距离，
这就更
容易的使我们走上
信息化的道路。
互
联网拉近了各个领域之间的距离，
如今利用互联网来宣传已经是必不可少的工
具，城市发展也需要互联网的宣传来带动自身的发展。
1.2
网站开发项目需求分析
一个网站项目的确立是建立在各种各样的需求上面的，
这种需求往往网
站建设在
Internet
应用上的地位显的格外重要，它已成
为政府、企事业单位信息化建设中的
重要组成部分来自于客户的实际需求或者是出于自身
发展的需要。在
Internet
飞速
发展的今天，
互联网已成为人们快速获取、
发布和传递信息的重
要渠道，
正以一种前
所未有的冲击力影响着人类的活动。
它在人们政治、
经济、
生活等各个方面发挥着
重
要的作用。因此网站建设在
Internet
应用上的地位显的格外重要，它已成为政府、
企事业单位信息化建设中的重要组
成部分。
第二章
网页制作概述
2.1
网页的类型
网页有多种分类
,
我们笼统意义上的分类是动态和静态的页面
,
原则上讲静
态页面多通过网站设计软件来进行重新设计和更改<
/p>
,
相对的比较滞后，当然现在
有网站管理
系统，也可以生成静态页面
~
我们称这种静态页面为伪静态。动
态页
面通过网页脚本与语言自动处理自动更新的页面。
2.1.1
静态页面
静态页面是网页的代码都在页面中，不需要执行
asp,php,jsp,.
net
等程序
生成客户端网页代码的网页。静态页面不能自主管
理发布更新的页面
,
如果想更
新网页内
容
,
要通过
FTP
软件把文件
DOWN
下来用网页制作软件修改（通过
fso
等技术例外）
。但是静态页面最大的好
处是下载速度快，因为不需要程序运算和
数据库连接。常见的静态页面以
.html
、
.htm
为扩展
名的。并非网站上没有动画
的就是静态页面
[3]
。
2.1.2
动态页面
动态页面是通过执行
asp
、
php
、<
/p>
jsp
、
.net
等程序生成客户端网页代码的网
页。
动态页面通常可以通过网
站后台管理系统对网站的内容进行更新管理。
发布
新闻，发布公
司产品，交流互动，博客，网上调查等，这都是动态网站的一些功
能，
< br>也是我们常见的。
动态网页是需要语言环境支持的，
动态
页面常见的扩展名
有：
.asp
、
.php
、
.jsp
、
.cgi
等。动态页面的“动态”
是网站与客户端用户
互动的意思，而非网页上有动画的就是动态页面
[4]
。
动态网页是最常用的网
站建设的一种表达形式，
其优点在于可以根据先前所
制定好的程
序界面，
根据用户的不同请求返回相应的数据。
可以说是一对多
的关
系。
从而达到资源的最大利用和节省服务器上的物理资源。
如果今后需要改变站
点风格，
只需要重
新制作前台所访问的数据即可。
只要数据库结构不变，
可以很<
/p>
快的进行改版的。
2.2
网页开发技术
动态网页开发技术介绍
——
HTML
、
ASP
、
JSP
、
CGI
、
PHP
。
HTML
（
HyperTextMark-upL
anguage
）
即超文本标记语言，
是
WWW
的描述语言。
严格的来讲，<
/p>
HTML
不能算做一门编程语言，因为它没有自己的数据类型，也
没
有分支、循环等控制结构。它的设计简单，结构灵活，允许在
Web
浏览器及其它
兼容的应用程序中显示文本和图像，
并且文档的某些部分可以成为超链接。
完成
后
把这些文档保存为
*.html
文件，然后用浏览器打开。
HTM
L
是网络的通用语言
,
一种简单、通用
的全置标记语言。它允许网页制
作人建立文本与图片相结合的复杂页面，
这些页面可以被网上任何其他人浏览到，
无论使用的是什么类型的电脑或浏览器
[5]
。
在
早期，
动态网页技术主要采用
CGI
技
术，
即
Common
Gateway
Interface(
公
用网关接口<
/p>
)
。在早期，你可以使用不同的程序编写合适的
< br>CGI
程序，如
Visual
Basic,Delphi
或
C/C++
等。虽然
CGI
技术成熟而且功能强大，但由于编程困难，<
/p>
效率低下，修改复杂等缺陷，所以有逐渐被新技术取代的趋势。
ASP
全名
Active
Server Pages
，是一个
WEB
服务器端的开发环境，利用它
可以产生和运行动态的、交互的、高性能的
WEB
服务应用程序。
ASP
采用脚本语
言
VB
Script
（
Java
script
）作为自己的开发语言。
ASP
更精确的说是一个中
间件，
这个中间件将
Web
上的请求转入到一个解释器中，
在这个解释器
中将所有
的
ASP
的
< br>Script
进行分析，再进行执行，而这时可以在这个中间件中去创建一
个
*.html
文件（静态网页）
。
PHP
是一种跨平台的服务器端的嵌入
式脚本语
言
.
它大量地借用
C,Java
和
Perl
语言的语法
,
并耦合
PHP
自己的特性
,
使
WE
B
开发者能够快速地写出动态生成页面
.
它支持目前绝大多数数据库。还有一点，
PHP
是完全免费的
[6]
。
JSP
是
Sun
公司推出的新一代站点开发语言，他完全解决了目前
ASP,PHP
的一个通病－－脚本级执行（据说
PHP4
也已经在
Zend
的支持下，实现编
译运
行）
。
Sun
公司借助自己在
Java
上的不凡造诣，将
Java
从
Java
应用程序
和
Java Applet
之外，又有新的硕果，就是
Jsp
－－
Java Server
Page
。
Jsp
可以
在
Serverlet
和
J
avaBean
的支持下，完成功能强大的站点程序。
2.3
网页布局
网站主页就好象是宣传栏或者店面——对访问者产生第一印象
，都希望尽量
给人留下好的印象。
一般来说，好的网站应该给人有这样的感觉：
干净整洁；
条理清楚；
专业水准；
引人入胜。
网页应该力求抓住而不是淹没浏览者的注意力，
过多的闪烁、
色彩、
下拉菜
单框、图片等会让访问者无所适从——离开是最好的选择，就象一些商店，播
放震耳欲聋
的发烧音乐，你要做的唯一决定就是离开那里，越快越好。
2.3.1
网页布局的基本概念
<
/p>
最开始，
网页呈现在你面前的时侯，
它就
好像一张白纸，
它需要你任意挥洒
你的设计才思，可以创造出自
己的设计方案。
，虽然你能控制一切你所能控制的
东西，
但假如你知道什么是一种约定俗成的标准或者说大多数访问者的浏览习惯，
那么你可以在此基础上加上自己的东西，
这样你创造出来的网页才能更好的被别
人接受。
（
1
）
页面尺寸
由于页面尺寸和显示器大小
及分辨率有关系，
网页的局限性就在于你无法突
破显示器的范围
，
而且因为浏览器也将占去不少空间，
留下给你的页面范围变得
越来越小。一般分辨率在
800x600
的情况下，页面的显示尺寸为：
780x428
个象
素；分辨率在
640x480
的情况下，页面的
显示尺寸为
:620X311
个象素；分辨率
< br>在
1024X768
的情况下，页面的显示尺寸为：
1007x600
。从以上数据可以看出，
分辨率越高页面尺寸越大。
浏览器的工具栏也是影响页面尺寸
的原因。
一般目前的浏览器的工具栏都可
以取消或者增加，
那么当你显示全部的工具栏时，
和关闭全部工具栏时，
页面的
尺寸是不一样的。
在网页设计过程中，
向下拖动页面是惟一给网页增加更多内容
(
尺寸
)
的方法。
除非你能肯定站点的内容能吸引大家拖动，
否则不要让访问者拖动页面超过三屏。
如果需要在同一页面显示超过三屏的内容，
那么你最好能在上面做上
页面内部连
接，方便访问者浏览。
（
2
）整体造型
造型就是创造出来的物体形象，
这里是指页面的整体形象。
这
种形象应该是
一个整体，
图形与文本的接合应该是层叠有序。<
/p>
虽然，
显示器和浏览器都是矩形，
但对于
页面的造型，
你可以充分运用自然界中的其它形状以及它们的组合：
矩形，
圆形，三角形，菱形等。
对于不同的形状，它们所代表的意义是不同的。比如矩形代表着正式，规则，
你注意到很多
ICP
和政府网页都是以矩形为整
体造型；
圆形带表着柔和，
团
结，温暖
，安全等，许多时尚站点喜欢以圆形为页面整体造型；三角形代表着力
量，权威，牢固，
侵略等，许多大型的商业站点为显示它的权威性常以三角形为
页面整体造型；菱形代表着
平衡，协调，公平，一些交友站点常运用菱形作为页
面整体造型。
虽然不同形状带表着不同意义，
但目前的网页制作多数是接合多个
图形加以设计，在这其中某种图形的构图比例可能占的多一些。
（
3
）页头
页头又可称之为页眉，
页眉的作用是定义页面的主题。
比如一个站点的名字
多数都显示在页眉里。
这样
，
访问者能很快知道这个站点是什么内容。
页头是整
个页面设计的关键，
它将牵涉到下面的更多设计和整个页面的协调性。
页头常放
置站点名字的图片和公司标志以及旗帜广告。
（
4
）文本
文本在页面中出现都数以行或者块
(
段
落
)
出现，
它们的摆放位置决定者整个
页面布局的可视性。
在过去因为页面制作技术的局限，
文本放置的位置的灵活性
非常小，
而随着
DHTML
的兴起，
文本已经可以按照自己的
要求放置到页面的任何
位置。
（
5
）页脚
页脚和页头相呼应。
页头是放置站点主题的地方，
而页脚是放置制作者或者
公司信息的地方。你能看到，许多制作信息都是放置
在页脚的。
（
6
）图片
图片和文本是网页的两大构成元素，
却一不可。
如何处理好图片和文本的位
置成了整个页面布局的关键。而你的布局思维也将体
现在这里。
（
7
）多媒体
除了文本和图片，还有声音，动画，视频等等其它媒体。虽然它们不是经常
能被利用到，但随着动态网页的兴起，它们在网页布局上也将变得更重要。
2.3.2
网页布局方法
网页布局的方法有两种，
第一种为纸上布局；
第二
种为软件布局。
下面分别
加以介绍。
（
1
）纸上布局法
许多网页制作者不喜欢先画出页面布局的草图，
而是直接
在网页设计器里边
设计布局边加内容。
这种不打草稿的方法不能
让你设计出优秀的网页来。
所以在
开始制作网页时，要先在纸上
画出你页面的布局草图来。
首先，
尺
寸的选择。
目前一般
800X600
的
分辨率为约定俗成的浏览模式。
所
以为了照顾大多数访问者，你
页面的尺寸以
800X600
的分辨率为准。
< br>
其次，
造型的选择。
先在白纸
上画出象征浏览器窗口的矩形，
这个矩形就是你布
局的范围了。
选择一个形状作为整个页面的主题造型，
我们选择圆形，
因为它代
表者柔和，
和时尚流行比较相称，<
/p>
然后在矩形框架里随意画出来，
你可以试者在
增加一些圆形或者其它形状。这样画下来，你会发现很乱。其实，如果你一开始
就想
设计出一个完美的布局来是比较困难的，
而你要在这看似很乱的图形中找出
隐藏在其中的特别的造型出来。
还要注意一点，
你不
要担心你设计的布局是否能
够实现。事实上，只要你能想到的布局都能靠现今的
HTML
技术实现。
考虑到左边向左凹的弧线，为了取得平衡我们在页面右边增加了一个矩形，
(
也
可以是一条线段
)
然后，增加页头。一般页头都是位于页面顶部，所以我们增加了一个页头，为了
和左边的
弧线和右边的矩形取得平衡，
我们增加了一个矩形页头并让页头相交与
< br>左边的弧线，
然后，
增加文本
。
页面的空白部分加别加入文本和图形。
因为在页面右边有矩形
作为陪衬，所以文本放置在空白部分不会因为左边的弧线而显得不协调，
最后，
增加图片。
图片是美
化页面和说明内容必须的媒体。
在这里把图片加入到
适当的地方
，
经过以上的几个步骤，
一个时尚页
面的大概布局就出现了。
当然，
它不是最
后的结果，而是你以后制作时的重要参考依据。
（
2
）软件布局法
除了
纸上布局，还可以利用软件来完成这些工作。如利用
Photoshop
。
Photoshop
所具有的对图像的编辑功能用到
设计网页布局上更显得心应手。
利用
Photoshop
可以方便的使用颜色，使用图形，并且可以利用层的功能设计出用纸
张
无法实现的布局意念。
2.3.2
网页布局技术
（
1
）层叠样式表的应用
在新的<
/p>
HTML4.0
标准中，
CSS(
层叠样式表
)
被提出来，它能完全精确的定位
文本和图片。
CSS
有点复杂，但它的
确是一个好的布局方法
。曾经无法实现的
想法利用
CSS
都能实现。
目前在许多站点上，
层叠样式表的运用是一个站点优秀
的体现。比如一些企业网站。
（
2
）表格布局
表格布局被广泛使用，
已经成为一个潜在的标
准。
随便浏览一个站点，
它们一定
是用
表格布局的。
表格布局的优势在于它能对不同对象加以处理，
而
又不用担心
不同对象之间的影响。
而且表格在定位图片和文本上
比起用
CSS
更加方便。
表格
布局唯一的缺点是，当你用了过多表格时，页面下载速度受到影响
[8]
。对于
[7]