第一篇：论文：个人网站的设计与实现
个人网站的设计与实现
前 言
随着国际互联网的普及，很多人已经不满足仅仅在Internet上的浏览信息，而是希望更深入的参与其中，拥有自己的Web网站，这似乎已经成为一种潮流。如果说个人建立网站是为了追求时尚，那么企业建立网站就是必然的选择了。
无论是专业的，还是业余的，很多人对网页制作颇感兴趣。事实上制作一个简单的网页并不困难，会使用Word的人都可以胜任。但想做出超凡脱俗的网页就不那么容易了，而Dreamweaver却可以满足你的愿望，它是Macromedia公司开发的集网页制作和网站管理于一身的所见即所得的网页编辑器。
同样出自Macromedia公司的Flash,Fireworks在制作网站的过程中起到了锦上添花的作用，是个人网站实现的好帮手，在制作网站的时候经常会用到这些软件。
本文有五章，我来由浅到深介绍个人网站的设计与实现。
摘 要
在互联网走进我们的生活之前，没有人敢梦想拥有自己的报纸、杂志、电台、电视台。除了政策上的制约外，一个人也根本没有操作一份传播媒体的能力。现在不同了，互联网给我们提供了一个“表达自我”的自由天地,你可以拥有自己的新闻邮件，你可以建立自己的个人网站。只要你办得成功也可以吸引成千上万的订户、读者,并建立自己在众多参与者中的权威地位。建立个人网站的基本过程可以分为以下七个环节 : 1 了解中国网络个人主页研究背景与发展现状 2 系统需求分析与总体设计 3 熟悉网站开发模式、工具及环境 把自己的作品和想要展示的内容制作成网页。5 使用动态网页技术(ASP)，实现动态内容更新。6 认真地选取测试用例，进行交叉测试 7 网站的后期完善、宣传及发展方向
其中 ,网页制作和使用动态网页技术(ASP)实现动态内容更新是网站开发的核心内容。
关键词：网页、制作、访问、链接 Abstract Enters before our life in the Internet, nobody dares to vainly hope for has own newspaper, the magazine, the broadcasting station, the television station.Besides the policy in restriction, a person simply has not also operated dissemination media the ability.Now has been different, Internet has provided to us “the expression” free world,You may have own news mail, you may establish own individual website.So long as you also manage the success to be possible to attract the tens of thousands of subscribers, the reader,And establishes oneself in the multitudinous participant's authoritative status.Establishes individual website the unit process to be possible to divide into following seven links: 1、understands the Chinese network individual main page research background and the development present situation 2 systems demands analysis and system design 3 familiar websites developments pattern, tool and environment 4 and wants own work the content which demonstrated to manufacture the homepage.5 uses dynamic homepages technology(ASP), realization dynamic content renewal.6 earnestly selects measured the test example, carries on the overlapping test 7 websites later periods consummate, the propaganda and the development direction Among them,The homepage manufacture and the use dynamic homepage technology(ASP)realizes the dynamic content renewal is the website development core content.Key word: Homepage, manufacture, visit, link
第一章 预备知识
1.1 什么是Internet Internet的中文名为“国际互联网”，又称“因特网”。
Internet是由众多的计算机网络互联而成的互联网，它覆盖了全世界各地，它是采用开放系统协议的计算机通讯网络。然而，Internet不仅仅是计算机的互联网，它还是全球最大的信息资源宝库，它提供了包括科研、教育、文化娱乐、商业和信息交流等各种各样的服务，使得世界范围内的人与人之间的交流在时间和空间上变的更小了。
要了解Internet，就必须先了解局域网。我们可以将同一地点的许多计算机使用网线连接在一起，构成一个高效率的计算机网络，所有处于网络内的终端机或电脑都能享受网络内所有的资源，比如程序，图文资料等。这种计算机网络因为一般都局限在一定区域中，我们称之为“局域网”（Local Area Network,简称LAN）,它是在日常工作中用得最多的一种小型计算机网络。局域网所覆盖的地理范围比较小，通常不超过几十公里，甚至只在同一座建筑物内或者邻近的几座建筑内。像常见的校园网，一座写字楼内部的网络等都属于局域网。
而Internet则不是指单个区域范围内的网络，而是指将全世界的各中不同类型的计算机网络连接起来的一个全球性的网络。Internet上有取之不尽，用之不竭的信息资源。对于Internet中各种各样的信息，所有的人都可以通过网络的连接来共享和使用。
1.2 Internet有那些功能
Web页浏览：这是目前利用最广泛、最直接的互联网服务，通过浏览WWW（万维网）中的网页，可以了解世界各地的新闻，查看最新的股市行情，最新的娱乐动态、科技发明，找到众多的就业信息„„几乎想找到什么样的信息，就有什么信息。正是有了WWW、Internet才会变得如此丰富多彩，才能走进千家万户。信息发布：通过Internet，不仅可以浏览别人发布在Web页上的信息，也可以将自己要发布的信息制作成Web页，也即网页，然后发布到Internet上，供全世界的人浏览。
电子邮件：不同于传统邮件，电子邮件(E-mail)通过Internet传输，写信，发信，收信都在计算机上完成，一封电子邮件最短在一秒之内就可以发送出去，其效率是传统邮件无法比拟的。而且发送与接收电子邮件几乎是免费的，所以比传统邮件既节省时间又经济的多。
网上聊天：通过聊天软件（如QQ、ICQ等）或不同网站的聊天室，可以和世界各地的网友聊天。网友可能是远在天边的异国朋友，也可能是与你一起工作的饿同事，或者是一起生活的家人，在这里没有年龄、性别、身份、职业、国籍、肤色的限制，完全突破了交友的传统方式，人们可通过Internet互相了解对方，进行各种各样的交流。
电子商务：现在网上交易已经成为现实，网上购物、网上商品销售、网上拍卖、企业级电子商务、网上货币支付等电子商务活动已经搞的有声有色，几乎所有的专家都预测，在未来的几年内，电子商务会飞速发展。在不久的将来，您可以做在电脑前进行各种各样的商务活动。
网络游戏：通过Internet，可以与全世界的玩家一起进行游戏对战，也可以协同作战。网络游戏已经成为信息产业全新的经济增长点，每年都为开发商带来巨额的利润。通过网络游戏，可以充分享受Internet给我们带来的乐趣。
网络电话：网络电话也称IP电话。它采用Internet技术，利用专门的网络电话软件，只需支付非常低廉的话费就可通话。Internet在电信市场上的应用将越来越广泛。
1.3 WWW的简介
WWW的全称为World Wide Web，含义是“环球网”，又称“万维网”、3W、Web。WWW是一个基于超文本（Hypertext）方式的信息检索服务工具。我们上网浏览到的网页就是这样的超文本，也就是HTML(Hypertext Mark-up Language,超文本标记语言)文件，这些网页文件被放置到WWW服务器上，并且都有一定的地址。当我们想浏览某个网站时，首先要在电脑上安装浏览器，如Internet Explorer或Netscape，然后在浏览器中输入网站的地址（网址），就可以进入网站进行浏览。在这些网页中，都有超连接，当将鼠标指针移动到某个地方（如文本或图象）时，鼠标指针就会变成一个小手形形状，单击它就可以连接到另个网页中，从而使得浏览者能在不同的信息之间跳转，我们之所以能在Internet的海洋中穿梭自如，正是超连接的功劳。
WWW 为我们带来的是世界范围的超级文本服务：只须操纵鼠标，就可以通过Internet从世界各地调来你所希望的文本、图像、动画和声音等信息。通过使用WWW，一个不熟悉网络使用的人也可以成为Internet的行家。
1.4网页基本构成元素
要学会制作网页，首先需要了解网页都是由什么元素构成的。
文字：文本是构成网页的基本元素。一个最简单的网页可以只有几行文本。
图片：正是有个各种美丽的图片，网页才变得多姿多彩。
动画：如今，网页上的动画越来越多，最常用的有GIF动画、Flash动画等。
超连接：如上所述，超连接几乎是必不可少的。一个没有超连接的网页，就如同汪洋大海中的一座孤岛，失去了与外界的一切联系。
其它元素：还可以在网页中添加声音、视频等元素。
1.5软件的安装与启动 要使用网站设计软件，自然先要将这些软件安装到自己的电脑中。安装完毕，还需要如何启动，如何创建快捷方式。下面就让我们来详细地看一看具体的操作步骤。
1.5.1软件的安装
安装之前，需要先了解软件对系统的要求。以Windows为例，系统要求如下： Intel Pentium II处理器或等效处理器，主频300MHz或更高。
Windows 98Windows 2000Windows NT(具有Service Pack 3 或更高版本)、Windows Me或Windows XP.Netscape Navigator 4.0版或更高版本或Microsoft Internet Explorer.96MB的可用内存（RAM），建议采用128MB内存。
分辨率可达 800×600像素的256色显示器（建议颜色为百万颜色，分辨率达到1024×768像素）。CD-ROM 驱动器。
检查一下您的计算机，看是否具备了以上条件。如果具备，将“Macromedia Studio MX”程序会自动运行。如果不能自动运行，可以找到光盘放入光驱，安装程序会自动运行。可以找到光盘中的“Install Macromedia Studio MX”程序或“Autorun”程序并双击运行。
Dreamweaver的安装比较容易，几乎可以自动完成。下面简要说明一下安装步骤。
操作步骤：
1、将安装光盘放入光驱，安装程序自动运行，并出现安装界面。如果单击安装界面上的“Macromedia STUDIO MX安装”，那么将会安装其下方所列出的软件。所有的安装会自动完成。
2、单击Dreamweaver MX,开始安装过装过程.先是出现解压缩文件窗口,等待一会儿,便会出现安装向导对话框。单击“下一步”按钮，继续安装过程。
3、出现“选择目的地位置”对话框，默认的盘是C盘，如果想安装到不同的位置，可以单击目的文件夹右边的“浏览”按钮，并在弹出的“选择文件夹”对话框选择不同的文件，如要安装在D盘则可直接将路径中的“C：”改为“D:”。也可以在下面的“目录”中选择其它的文件夹，设置完后，单击“确定”，回到“选择目的地址”对话框，单击“下一步”继续。
4、而后会出现“默认编辑器”的对话框，默认为全选。如果希望让Dreamweaver MX成为下面所列文件类型的默认编辑器，那么可以在这里做选择。选择完毕，单击“下一步”按钮。
5、出现“开始复制文件”对话框，单击“下一步”安装程序开始复制文件，过几分钟后，安装结束，单击“结束”按钮，结束安装。
1.5.2 软件启动
软件安装完毕后，我们就可以使用它了。安装程序已经自动在“开始”菜单中加入了快捷方式。
单击“开始”菜单，将鼠标指针依次指向“程序”|“Macromedia”|“Macromedia MX”,并在上面单击鼠标左键。
1.5.3 创建快捷方式 使用“开始”菜单启动程序的过程比较烦琐。可以在Windows桌面或快速启动栏上创建快捷方式，这样可以快速的启动程序。
具体实现方法是：在“开始”菜单中找到相应程序的快捷方式，不过这是不要用鼠标左键单击，而是用右键按住向桌面拖动，然后松开右键，会出现一个快捷菜单，在其中可以选择不同的命令，比如选择“在当前位置创建快捷方式”或“复制到当前位置”。
这样以后在运行程序时，就方便快捷的多了。
1.6 制作网页前的准备
电脑必备：
电脑速度够快，最好能够上网。操作系统：Windows 98/NT/Me/2000/XP.软件可选：
其它软件：看图软件ACDSee、图像处理软件Photoshop、上传工具CuteFTP、Fireworks、动画软件Flash等。
1.7 Dreamweaver MX的操作环境
我们将工作界面分成了“标题栏”、“菜单栏”、“快捷工具栏”、“属性面板”、“浮动控制面板”5个部分来分别介绍。
1.7.1 标题栏 Dreamweaver MX的“标题栏”中将显示文字“Macromedia Dreamweaver MX”如果打开网页的话，在后面还会显示该网页的一些信息，如网页标题、所在位置及网页名称，右边有三个钮，分别对应Dreamweaver MX的最大化最小化和关闭的操作。
1.7.2 菜单栏
“标题栏”下面就是“菜单栏”，栏中提供了“文件”、“编辑”、“查看”、“插入”、“修改”、“文本”、“站点”、“窗口”、“帮助”10项菜单。单击其中任意一项菜单，随即就会出现一个下拉式指令菜单。有些指令的右边会有键盘的代码，这是该指令的快捷键，熟练使用快捷键将会有助于提高工作效率。有些指令的右边会有一个小黑三角的标记，它代表该指令还包含下一级的指令，鼠标停留片刻即可显示。
1.7.3 快捷工具栏
“快捷工具栏”指的是“菜单栏”下边的3排按钮，选择菜单“查看/工具栏”，勾选里面的“插入”、“文档”和“标准”3项，完整的快捷工具栏就显现出来了。
1.7.4 属性面板
在网页编辑窗口的下面还有一个面板，它是有名的“属性面板”，它在这个软件中起到举足轻重的作用。
属性面板顾名思义，就是显示，调整属性的面板，根据鼠标所选中对象的不同，“属性面板”在界面上也会有所差异，用户可以分别对不同的对象进行调整。
第二章 网站制作实战
2.1 站点
2.1.1 创建站点
要制作一个网站，第一步操作都是一样的，就是要创造一个“站点”，这样可以使整个网站的脉络结构清晰地展现在面前，避免了以后再进行纷杂的管理。
从菜单中选择“站点/管理站点”在弹出的对话框中选择“新建”，之后再选择其中的“站点”，再次弹出一个对话框，在文本框中输入自己已经企化好的网站名称“追梦人”。
填好后，单击“下一步”，进入下一个步骤。由于我要做的是一个静态的网页，所以选择上面的一项“否，我不想使用服务器技术。” 单击“下一步”，进入下一个步骤。
在此选项中有两个选择，选择推荐的“编辑我的计算机上的本地副本，完成后再上传到服务器”。底下的文本框允许在本地磁盘上指定一个文件夹，Dreamweaver将在其中储存站点文件的本地副本。单击该文本框后面的文件夹图标，新建并指定一个空的文件夹“E:/ding”。之后单击“下一步“，进入下一个步骤。
这一步是如何设置连接到远程服务器，弹出式菜单中有6中选择，这里选择“无”。而后“下一步”再“完成”，即可。
2.1.2 创建站点内容
站点创建完成后，就可以创建Web页来填充站点了。在“右侧浮动面板组”中选择“文件/文件”面板，此时整个网站中没有任何内容。用鼠标右击面板中的本地根目录文件夹。在弹出的菜单中选择“新建文件”，新建一个文件后将其命名为“index.htm(或index.html),它就是未来的首页。
由于“追梦人”网站分为“平面设计”、“动画制作”、“网文精品”、“经典回顾”、“个人说明“这五个大栏目，所以继续用鼠标右击右侧，在弹出的菜单中选择第二项“New Folder（新建文件夹）”。执行五次操作，新建五个文件夹，并把它们重命名为graph、anim、books、music、letter，分别对应上面的五个大栏目。存放它们各自的内容。之后再次新建1个文件夹，命名为images,用来存放“所有的图象文件”的内容。
之后在个栏目的文件夹里还要建立想相应的栏目网页。
2.2 首页
2.2.1 设置首页布局
每个网站都会有一个首页，就功能上而言，它代表着一个网站的风格与特色，就网站架构上而言，它代表了网站的第一层架构，至于网站上其他Web页，原则上都必须通过首页来连接散播出去，可见首页是多么的重要。
首页是打开网站后在浏览器中显示的第一个页面。它是起什么名字通常要视Server端的设置，一般的有index.htm,default.htm或home.htm等，目前主要以index.htm的居多。当然，后缀名为html也是正确的。
具体设置方法是：右健单击“文件”浮动面板中的index.htm,在弹出的菜单中选择“设成首页”。
首页的布局有很多方法，在这里我所用到的是表格的“布局模式”。“布局”模式中的表格称为布局表格，单元格称为布局单元格。在绘制布局表格和布局单元格时，必须从“标准”模式切换到“布局”模式。直接单击“布局”按钮即可。操作步骤：
1、在“插入快捷栏”的“布局”分类中，单击“布局表格”按纽。
2、将变成“+”形状的鼠标光标放到编辑中网页上，在要绘制的地方进行拖动就可以进行创建了。（如果绘制的是第一个表格必须从网页的最左上角开始绘制）。
3、在这里要绘制多个表格，可以再次单击“布局表格”按纽进行绘制，也可以按住Ctrl键绘制多个表格。追梦人”网站首页的布局如图所示：
2.2.2设置首页的页面属性
首先双击“文件”浮动面板中的index.htm,进入页面的编辑窗口。右健单击空白区域，在菜单中选择“页面属性”，之后弹出“页面属性”对话框，若选择主菜单“修改/页面属性”项，也可以把打开该对话框。
在“页面属性”对话框中，左侧窗口显示“分类”，其中包括了“外观”、“链接”、“标题”、“标题/编码”、“跟踪图像”5项，右侧区域则显示各类中可以设置的项目。“追梦人”首页设置的属性如下图所示：
2.2.3查看和编辑头内容
一个网页文件结构上实际是由两部分组成，头（head）内容和主体（body）内容主体内容（body）是文档的主要部分，也是包含文本和图像等的可见部分。头内容（head）是除文档标题外的不可见部分，包含有文档类型、语言编码、搜索引擎的关键的关键字和内容指示器以及样式定义等重要信息，这些元器并不是每个页面都需要的，例如，可以仅为主页提供关键字。
下面就以首页为例，说明怎样插入较常用的头（head）内容。
单击“菜单拦”下面“插入快捷”的下拉列表，选择其中的HTML类，此时右侧将会显示该类中可以插入的对象快捷按钮，再次单击第2个按钮“文件头”旁边的下拉箭头，会弹出菜单，该项列出的便是即将插入的头内容。
2.2.4 插入图像
图像是网页中不可或缺的组成成份，恰当地使用图像，可以使网站充满生活生命力与说服力，吸引更多的浏览者，加深他们欣赏你网站的意愿。
另一方面，网页的容量大小是网站成功与否的一大关键因素。由于网络在传输上的限制，导致了下载的速度不可能太快，因此，网页的大小就不能太大，其中关键就在于图像的大小了，否则浏览者会失去等待的耐心，无论你的网站多么精彩也无济于事了。所以，在网面容量大小的问题上一定要重视。下面就来详细介绍对网页图像进行处理的操作步骤，以使得它们在保持图形美丽与网站风格搭配的基础上，图片文件能够变的更小。
1、首先将光标停留在要插入图像的位置，然后单击“菜单栏”下面“插入快健栏”的下拉表，选择其中的“常用”类，则右侧将会显示该类中可以插入的对象快键按钮。左起第5个即为“图像：图像”按钮，单击它右侧的下拉列表，选择第1项“图像”。
2、随即弹出“选择图像源文件”对话框。从计算机磁盘中选择想要插入的图像文件，或在URL编辑框中输入图像的路径和名称。下面的“相对于”下拉表框中，可选择文件URL地址的类型，如果选择“文档”选项，表示图像地址相对于当前文档；如果选择“站点根目录”选项，表示地址相对于根目录。在这里我要插入的是网站标志logo，插入logo图象，如图所示：
最后单击“确定”按钮，即可完成插入图像的操作。2.2.5插入多媒体
在Dreamweaver MX2004中，除了之前讲到的可以插入“图像”外，还可插入动画、声音、视频等媒体元素，如Flash,Shockwave,Applets,ActieX及格Midi声音文件等，并且还可以在Dreamweaver自身内插入Macromedia Flash MX2004按钮和文本对象，以及进行相关的后期处理和添加设计备注等操作。
在Dreamweaver MX 2004文档中，可以插入媒体文件包括Flash Shockwave影片、QuickTime、AVI java、applet Active X控件以及各种格式的音频文件。要在浏览器中播放放Flash 动画，必须在浏览器中集成“Flash 播放器（Flash Player）”。其中，Internet Explorer通过ActiveX控制来实现，Netscape Navigator则是通过相应的插件来实现的。在最新的Netscape Navigator和Internet Explorer浏览器中，均已集成了 Flash动画播放功能。操场作步骤：
步骤1 将光标停留在要插入Flash的位置，然后单击菜单栏下面“插入快捷栏”的下拉列表，选择其中的“常用”分类，右侧将会显示该类中可以插入的对象快捷按钮。左起第6个即为“媒体”按钮，单击它右侧的下拉列表，选择第1项Flash图标。
步骤2 在弹出的对话框中选择扩展名为swf 的Flash文件，即可将其插入到Dreamwe aver的“网页编辑窗口”中，可以看到，在这个窗口中Flash文件的大小。在这里我的主页插入的一个动画，如图所示：
2.2.6插入文本 文字是人类语言最基本的表达方式，在网页中，文本内容也可以说是重要的组成部分，一个网站成功与否，它是最关键的因素。在这最关键的因素。可丰富网站的文字内容，并以最最美观、最整齐的方式放入到网页中。插入文本的两种方式
网页中需要大量的文本，我们或以通过以下两种方式插入它们。
一种是在网页编辑窗口中直接用键盘敲入文本。这可以算是最基本的输入方式了，和一些文本编辑软件（如Microsoft Word）的使用方法一样，选择好习惯的输入法，就可以运指如飞了。
另一种是复制文本的方式。有些读者可能不喜欢使用Dreamweaver MX2004来进行打字的工作，而更习惯在专门的文本编辑软件中快速打字，如Microsoft Word和 Windows自带的记事本等，又或者读者已经准备好了要放入网页的文本的电子版本，那么我们就可以直接使用Dreamweaver的文本复制功能，将大段的文本内容拷贝到网页的编辑窗口来进行排版的工作，具体步骤如下。
打开文本编辑软件（如Microsoft Word），选中要复制的文本，它们将反白显示，执行菜单“编辑/复制”命令或直接用快捷键Ctrl+C，之后切换回Dreamweaver,将光标停留在插入文本的位置，执行主菜单“编辑/粘贴”命令或直接使用快捷键Ctrl+v,即可将大段的文本快速粘贴到网页中。
这在我的“网文精品”中用到很多，全部是在word软件中排好ctrl+c,然后点击要粘贴的位置，crtl+v到Dreamweaver即可。
2.3创建其它网页
还有其它的几个网站与主页的制作相同，一个网页是图象和文字的组合。“平面设计”中的图象插入和前面的介绍相似，并可以在属性拦中调节图象的大小。在Dreamwerver中常常会用到Firework、Flash，它们是相辅相成，在主页中的主体部分就是用Firework,如图所示：
在“个人说明”中也用到这点，首先定好需要尺寸，在属性中设好背景，颜色等等，插入图象，输入文字，也word里的操作雷同。
第三章 建立网页链接
网站实际上是由很多网页组成的，那么网页之间是如何联系的呢？这就是本章要讲的内容----网页的“链接”。
“链接”，又称“超链接"（Hyperlink）,它作为网页的桥梁，起着相当重要的作用。网页中的很多对象都可以加入“链接”属性。在Dreamweaver MX2004中，如果以“链接”的媒介来划分的话，则“链接”可以分为“文字链接”、“图像链接”、“图像地图链接”、“内部链接和外部链接”、“E-mail链接”、“命名锚记链接”、“文件下载链接”和“跳转菜单”，共8种。其中部分内容在之前的章节中可能接触过，这里将对其进行更深入的讲解。
3.1文字链接
“文字链接”即以文字作为媒介的链接，它是网页中最常被使用的链接方式，具有“文件小、制作简单和便于维护”的特点。
接下来结合我的个人网站为实例，来讲解如何为文字建立“链接”。具体操作步骤如下所述。操作步骤
步骤1 准备好已经制作完成的首页的各个栏目页面（假设除了“链接”，其他内容都已经制作完成了），该网站包含6个栏目，这里的5个栏目----“平面设计”、“动画制作”和“网文精品”、“经典回顾”、“个人说明”为例来进行讲解。
步骤2 在Dreamweaver 中打开首页，之后反白选取作为“链接”的文字。实例中要做到单击不同的栏目的网页。因此为第1个栏目“平面设计”设置链接，首先要反白选中“平面设计”4个文字。
步骤3 观察“属性面板”，其中包括一个“链接”文本框。步骤4 接下来需要把链接的地址加入到文本框中，方法有3种。
这里我用到的是直接点击文件夹图标，在文件夹中找到要链接的对象graph.htm。这样就建立了超链接。不过有点很重要，由于大多数服务器都不支持中文文件名，而且对大小写敏感，因此采用英文文件名并统一大小写。如图所示：
步骤5 在“链接”文本框下面还有一个“目标”下拉列表，从中可以选择链接网页显示的窗口方式，共有4种。如图：
实例中没有选择任何选项，保持空白，表示在原窗口中打开链接网页。
步骤6 还可以设置一些“链接”的属性，这是前面讲过的内容。单击“属性面板”中的“页面属性”，选择其中的“链接”分类，可以进行的设置有“链接字体”、“大小”、“链接颜色”、“变换图像链接”颜色、“已访问链接”颜色、“活动链接”颜色及“下划线样式”。
步骤7 至此，第1个栏目的链接就制作完毕了，按下Ctrl+S保存网页，再按下F12预览，测试一下，当鼠标放在“平面设计”这4个文字上时将变成手形，并且浏览器窗口下面的状态栏中会显示链接到的网页的地址，单击文字，页面会立即跳转到第1个栏目中，这表示链接已经制作成功了。
步骤8 同理，按照以上步骤，再为“动画制作”和“网文精品”“经典回顾“等其它栏制作指向对应栏目的链接。
步骤9 通常在栏目页面中还需要有“返回首页”的链接，单击其后可以跳转回首页，因此在各个栏目中还要插入“网站首页”的文字，并且制作指向首页index.html的链接，制作方法不变。
至此，整个“文字链接”的实例就全就全部完成了。通过对这个实例的讲解，读者不仅应该学会如何为文字制作链接，还应用对“链接”有了更加深刻的理解，链接的目的何在？它到底能够在网页的网站中发挥什么样的作用？怎样才能更好地使用它？这些是网页制作者更应该思考的问题。下面继续介绍其他类型的链接。
3.2图像链接
“图像”也是常被使用的链接媒体，它和“文字链接”非常相似。为图像加入链接，首先应该在网页中插入“图像”，有关插入“图像”或“导航条”按钮的内容，接下来以我的网站“追梦人“为例，讲解如何建立“图像链接”。操作步骤
步骤1 首先仍然要准备好已经制作完成的首页和各个栏目的页面（假设除了“链接”，其他内容都已经制作完成了），该网站包含6个栏目，下面我们就动手为这6个栏目分别制作它们的链接。
步骤2 在Dreamweaver中打开网站的首页，之后选取要制作“链接”的图像。实例中先为第3个栏目“动画制作”设置链接，因此选中包含“动画制作”4个字的图像。步骤3 观察“属性面板”，在“链接”文本框中输入链接的文字地址。可以使用之前讲过的“指向文件”和“选择文件”的方法。
步骤4 如果有需要，可以在“目标”下拉列表中选择“链接”网页显示的窗口方式，分别为-blank、-parent、-self或 top。实例中使用了默认出的保留空白选项的方式。
步骤5 另外，读者还可以为图像增加“替代”文本。实例中为第1个栏目增加栏目名称的“替代”文本。
步骤6 至此，第1个栏目的图像链接就制作完毕了，按下Ctrl+S保存网页，再按下F12预览，测试一下，将鼠标放在“动画制作”4个文字上时将变成手形，同时浏览器窗口下面的状态栏中会显示出链接到的网页的地址，并且会显示出“替代”文本“动画制作”，单击文字，页面会立即跳转到第3个栏目中，这表示链接已经制作成功了。步骤7 同理，按照以上步骤，再为其它几幅图像制作指向对应栏目的链接。
步骤8 在栏目页面中制作“返回首页”的链接，使得单击后可以跳转回首页，其制作方法不变。
至此，整个“图像链像”的实例就全部完成了。
3.3E –Mail的链接
E-Mail链接，是指当浏览者单击该链接之后，不是打开一个网页文件，而是启动用户的E-Mail客户端软件（如Outlook Express）,并打开一个空白的新邮件，供浏览者撰写内容来与网站联系人联系，这是一种最方便的互动方式。结合“个人说明”网页，建立E-Mail链接的步骤如下所述。操作步骤 步骤1 将光标停留在页面右下角要插入E-mail链接的位置。
步骤2 选择“插入快捷栏”中的“常用”分类，单击左侧第2个“电子邮件链接”按钮。
步骤3 在弹出的“电子邮件链接”对话框中有两个输入项，分别是“文本”和“E-Mail”。在“文本”项中输入链接的文字，中文、英文均可，在E-Mail项中输入网站联系有的电子邮件地址，如实例中的 ding_zhuimeng123@163.net。
步骤4 单击“确定”按钮，具有“E-Mail链接”属性的文本就ding_zhuimeng123@163.net。插入到光标所在位置了，按下 Ctrl+S保存网页，再按下F12预览查看实际效果。上面的方法只适用于文本的“E-Mail链接”，如果想在其它的对象（如图像）上也加入这种链接，该怎办呢？下面介绍第2种建立“E-Mail链接”的方法。
其实很简单，与前面讲过的图像加入链接的方法基本一样。先在页面中需要的地方插入图像，之后选中图像，并在“属性面板”的“链接”文本框中输入如下语句即可----mailto: ding_zhuimeng123@163.net ?subject=网站的建议与第1种方法不同的是，E-Mail 地址前面增加了mailto:字样。用这种方法就可以给图像等其他对象建立“E-Mail链接”了。
3.4文件下载链接
“文件下载链接”的原理很简单，只要链接文件属于浏览无法识别的关型，便都会使用IE浏览器直接进行下载，并保存到本地计算机中。
浏览器无法识别的文件类型有很多，这里就介绍一个最常用的，以zip或rar为后缀名的压缩格式文件，这种文件可以使用主流的压缩软件（如winzip、winrar）来制作。下面我们就业以实例来说明。在前面“插入多媒体”一章中，我们曾经讲过直接链接文件的方式来插入“视频”，即直接在“链接”文本框中输入“文件名+名后缀名”，如olympus.wmv。单日击这个链接，经过数据下载后，Windows系统将启动自带的媒体播放器Windows Media Player 来播放该视频。操作步骤
步骤1 先将视频文件olympus.wmv通压缩成olympus.rar文件，放入站点的media文件夹下。
步骤2 将文件路径输入至“链接”文本框中。
步骤3 保存网页，按下F12预览，在浏览器中单击“下载精彩广告视频”链接文本，会弹出“文本下载”选择框，单击其中的“保存”按钮。
步骤4 在“另存为”对框中选择保存到本地计算机中的位置，实例中为“经典回顾”文件夹。之后单击“保存”按钮，压缩文件即保存到该位置中。至此，“文件下载链接”便制作完成了。读者可以打开“我的文档”文件夹，解压缩olympus.rar文件，随时欣赏下载影片。
本设计中未用到此链接，在此只作简单介绍。
3.5在HTML语言中建立网页链接
3.5.1文字链接
在HTML语言中用超链接标记指向一个目标。其基本格式为： 举个简单的“文本链接”的实例，该实例相对应的HTML代码如下所示。 a href-“index2.html”target=”-blank”>平面设计
动画制作（原窗口，默认为空）
第二篇：个人网站的设计与实现 毕业设计(论文)
随着国际互联网的普及，很多人已经不满足仅仅在Internet上的浏览信息，而
是希望更深入的参与其中，拥有自己的Web网站，这似乎已经成为一种潮流。如果说个
人建立网站是为了追求时尚，那么企业建立网站就是必然的选择了。
无论是专业的，还是业余的，很多人对网页制作颇感兴趣。事实上制作一个简单的
网页并不困难，会使用Word的人都可以胜任。但想做出超凡脱俗的网页就不那么容易
了，而Dreamweaver却可以满足你的愿望，它是Macromedia公司开发的集网页制作和
网站管理于一身的所见即所得的网页编辑器。
同样出自Macromedia公司的Flash,Fireworks在制作网站的过程中起到了锦上添
花的作用，是个人网站实现的好帮手，在制作网站的时候经常会用到这些软件。
本文有五章，我来由浅到深介绍个人网站的设计与实现。
摘
摘摘
摘
要
要要 要
在互联网走进我们的生活之前，没有人敢梦想拥有自己的报纸、杂志、电台、电
视台。除了政策上的制约外，一个人也根本没有操作一份传播媒体的能力。现在不同了，互联网给我们提供了一个“表达自我”的自由天地,你可以拥有自己的新闻邮件，你可
以建立自己的个人网站。只要你办得成功也可以吸引成千上万的订户、读者,并建立自
己在众多参与者中的权威地位。建立个人网站的基本过程可以分为以下七个环节 : 1 了解中国网络个人主页研究背景与发展现状 系统需求分析与总体设计 熟悉网站开发模式、工具及环境 把自己的作品和想要展示的内容制作成网页。使用动态网页技术(ASP)，实现动态内容更新。认真地选取测试用例，进行交叉测试 网站的后期完善、宣传及发展方向
其中 ,网页制作和使用动态网页技术(ASP)实现动态内容更新是网站开发的核心内容。
关键词：网页、制作、访问、链接
Abstract
目 录
第一章 引言
1.1 什么是Internet
1.2 Internet有哪些功能 1.3 www简介
1.4 网页基本构成元素
1.5 软件的安装与启动
1.5.1 软件的安装
1.5.2 软件的启动
1.5.3 创建快捷方式
1.6 制作网页前的准备
1.7 Dreamweaver的操作环境
1.7.1标题栏
1.7.2菜单栏
1.7.3快捷工具栏
1.7.4属性面板
第二章 网站制作实战
2.1 站点
2.1.1创建站点
2.1.2 创建站点内容
2.2 首页
2.2.1 设置首页布局
2.2.2 设置首页的页面属性 2.2.3 查看和编辑头内容
2.2.4 插入图像
2.2.5 插入多媒体 2.2.6 插入文本
2.3 创建其它网页
第三章 建立网页链接
3.1 文字链接
3.2 图像链接
3.3 E-Mail链接
3.4 文件下载链接
3.5 在HTML语言中建立网页链接
3.5.1 文字链接
3.5.2 图像链接
3.5.3 E-Mail链接
3.6.4 文件下载链接
第四章 结论
致 谢
参考文献
第一章
第一章第一章
第一章
预备知识
预备知识预备知识
预备知识
1.1
InternetInternet
Internet
Internet的中文名为“国际互联网”，又称“因特网”。
Internet是由众多的计算机网络互联而成的互联网，它覆盖了全世界各地，它是采
用开放系统协议的计算机通讯网络。然而，Internet不仅仅是计算机的互联网，它还是
全球最大的信息资源宝库，它提供了包括科研、教育、文化娱乐、商业和信息交流等各
种各样的服务，使得世界范围内的人与人之间的交流在时间和空间上变的更小了。
要了解Internet，就必须先了解局域网。我们可以将同一地点的许多计算机使用网
线连接在一起，构成一个高效率的计算机网络，所有处于网络内的终端机或电脑都能享
受网络内所有的资源，比如程序，图文资料等。这种计算机网络因为一般都局限在一定
区域中，我们称之为“局域网”（Local Area Network,简称LAN）,它是在日常工作中
用得最多的一种小型计算机网络。局域网所覆盖的地理范围比较小，通常不超过几十公
里，甚至只在同一座建筑物内或者邻近的几座建筑内。像常见的校园网，一座写字楼内
部的网络等都属于局域网。
而Internet则不是指单个区域范围内的网络，而是指将全世界的各中不同类型的
计算机网络连接起来的一个全球性的网络。Internet上有取之不尽，用之不竭的信息资
源。对于Internet中各种各样的信息，所有的人都可以通过网络的连接来共享和使用。1.2
1.2 Internet有那些功能
Web页浏览：这是目前利用最广泛、最直接的互联网服务，通过浏览WWW（万维网）
中的网页，可以了解世界各地的新闻，查看最新的股市行情，最新的娱乐动态、科技发
明，找到众多的就业信息„„几乎想找到什么样的信息，就有什么信息。正是有了WWW、Internet才会变得如此丰富多彩，才能走进千家万户。信息发布：通过Internet，不仅可以浏览别人发布在Web页上的信息，也可以将
自己要发布的信息制作成Web页，也即网页，然后发布到Internet上，供全世界的人
浏览。
电子邮件：不同于传统邮件，电子邮件(E-mail)通过Internet传输，写信，发信，收信都在计算机上完成，一封电子邮件最短在一秒之内就可以发送出去，其效率是传统
邮件无法比拟的。而且发送与接收电子邮件几乎是免费的，所以比传统邮件既节省时间
又经济的多。
网上聊天：通过聊天软件（如QQ、ICQ等）或不同网站的聊天室，可以和世界各
地的网友聊天。网友可能是远在天边的异国朋友，也可能是与你一起工作的饿同事，或
者是一起生活的家人，在这里没有年龄、性别、身份、职业、国籍、肤色的限制，完全
突破了交友的传统方式，人们可通过Internet互相了解对方，进行各种各样的交流。
电子商务：现在网上交易已经成为现实，网上购物、网上商品销售、网上拍卖、企业级电子商务、网上货币支付等电子商务活动已经搞的有声有色，几乎所有的专家都
预测，在未来的几年内，电子商务会飞速发展。在不久的将来，您可以做在电脑前进行
各种各样的商务活动。
网络游戏：通过Internet，可以与全世界的玩家一起进行游戏对战，也可以协同
作战。网络游戏已经成为信息产业全新的经济增长点，每年都为开发商带来巨额的利润。
通过网络游戏，可以充分享受Internet给我们带来的乐趣。
网络电话：网络电话也称IP电话。它采用Internet技术，利用专门的网络电话
软件，只需支付非常低廉的话费就可通话。Internet在电信市场上的应用将越来越广泛。
1.3 WWW的简介
WWW的全称为World Wide Web，含义是“环球网”，又称“万维网”、3W、Web。
WWW是一个基于超文本（Hypertext）方式的信息检索服务工具。我们上网浏览到的网页就是这样的超文本，也就是HTML(Hypertext Mark-up Language,超文本标记语言)文件，这些网页文件被放置到WWW服务器上，并且都有一定的地址。当我们想浏览某个网站时，首先要在电脑上安装浏览器，如Internet Explorer或Netscape，然后在浏览器中输
入网站的地址（网址），就可以进入网站进行浏览。在这些网页中，都有超连接，当将
鼠标指针移动到某个地方（如文本或图象）时，鼠标指针就会变成一个小手形形状，单
击它就可以连接到另个网页中，从而使得浏览者能在不同的信息之间跳转，我们之所以
能在Internet的海洋中穿梭自如，正是超连接的功劳。
WWW 为我们带来的是世界范围的超级文本服务：只须操纵鼠标，就可以通过Inter net从世界各地调来你所希望的文本、图像、动画和声音等信息。通过使用WWW，一个
不熟悉网络使用的人也可以成为Internet的行家。
1.4网页基本构成元素
要学会制作网页，首先需要了解网页都是由什么元素构成的。
文字：文本是构成网页的基本元素。一个最简单的网页可以只有几行文本。
图片：正是有个各种美丽的图片，网页才变得多姿多彩。
动画：如今，网页上的动画越来越多，最常用的有GIF动画、Flash动画等。
超连接：如上所述，超连接几乎是必不可少的。一个没有超连接的网页，就如同汪
洋大海中的一座孤岛，失去了与外界的一切联系。
其它元素：还可以在网页中添加声音、视频等元素。
1.5软件的安装与启动
要使用网站设计软件，自然先要将这些软件安装到自己的电脑中。安装完毕，还需
要如何启动，如何创建快捷方式。下面就让我们来详细地看一看具体的操作步骤。
1.5.1软件的安装
安装之前，需要先了解软件对系统的要求。以Windows为例，系统要求如下：
Intel Pentium II处理器或等效处理器，主频300MHz或更高。
Windows 98Windows 2000Windows NT(具有Service Pack 3 或更高版本)、Windo
ws Me或Windows XP.Netscape Navigator 4.0版或更高版本或Microsoft Internet Explorer.96MB的可用内存（RAM），建议采用128MB内存。
分辨率可达 800×600像素的256色显示器（建议颜色为百万颜色，分辨率达到102
4×768像素）。
CD-ROM 驱动器。
检查一下您的计算机，看是否具备了以上条件。如果具备，将“Macromedia Stud
io MX”程序会自动运行。如果不能自动运行，可以找到光盘放入光驱，安装程序会自
动运行。可以找到光盘中的“Install Macromedia Studio MX”程序或“Autorun”程
序并双击运行。
Dreamweaver的安装比较容易，几乎可以自动完成。下面简要说明一下安装步骤。
操作步骤：
1、将安装光盘放入光驱，安装程序自动运行，并出现安装界面。如果单击安装界面
上的“Macromedia STUDIO MX安装”，那么将会安装其下方所列出的软件。所有的安装
会自动完成。
2、单击Dreamweaver MX,开始安装过装过程.先是出现解压缩文件窗口,等待一会儿，便会出现安装向导对话框。单击“下一步”按钮，继续安装过程。
3、出现“选择目的地位置”对话框，默认的盘是C盘，如果想安装到不同的位置，可以单击目的文件夹右边的“浏览”按钮，并在弹出的“选择文件夹”对话框选择不同 的文件，如要安装在D盘则可直接将路径中的“C：”改为“D:”。也可以在下面的“目
录”中选择其它的文件夹，设置完后，单击“确定”，回到“选择目的地址”对话框，单击“下一步”继续。
4、而后会出现“默认编辑器”的对话框，默认为全选。如果希望让Dreamweaver M
X成为下面所列文件类型的默认编辑器，那么可以在这里做选择。选择完毕，单击“下
一步”按钮。
5、出现“开始复制文件”对话框，单击“下一步”安装程序开始复制文件，过几
分钟后，安装结束，单击“结束”按钮，结束安装。
1.5.2 软件启动
软件安装完毕后，我们就可以使用它了。安装程序已经自动在“开始”菜单中加入
了快捷方式。
单击“开始”菜单，将鼠标指针依次指向“程序”|“Macromedia”|“MacromediaMX”,并在上面单击鼠标左键。
1.5.3 创建快捷方式
使用“开始”菜单启动程序的过程比较烦琐。可以在Windows桌面或快速启动栏上
创建快捷方式，这样可以快速的启动程序。
具体实现方法是：在“开始”菜单中找到相应程序的快捷方式，不过这是不要用
鼠标左键单击，而是用右键按住向桌面拖动，然后松开右键，会出现一个快捷菜单，在
其中可以选择不同的命令，比如选择“在当前位置创建快捷方式”或“复制到当前位置”。
这样以后在运行程序时，就方便快捷的多了。
1.6 制作网页前的准备
电脑必备：
电脑速度够快，最好能够上网。
操作系统：Windows XP.软件可选： 其它软件：看图软件美图秀秀 图像处理软件Photoshop、上传工具CuteFTP
1.7 Dreamweaver MX的操作环境
我们将工作界面分成了“标题栏”、“菜单栏”、“快捷工具栏”、“属性面板”、“浮动控制面板”5个部分来分别介绍。
1.7.1 标题栏
Dreamweaver MX的“标题栏”中将显示文字“Macromedia Dreamweaver MX”如果
打开网页的话，在后面还会显示该网页的一些信息，如网页标题、所在位置及网页名称，右边有三个钮，分别对应Dreamweaver MX的最大化最小化和关闭的操作。
1.7.2 菜单栏
“标题栏”下面就是“菜单栏”，栏中提供了“文件”、“编辑”、“查看”、“插
入”、“修改”、“文本”、“站点”、“窗口”、“帮助”10项菜单。单击其中任意
一项菜单，随即就会出现一个下拉式指令菜单。有些指令的右边会有键盘的代码，这是
该指令的快捷键，熟练使用快捷键将会有助于提高工作效率。有些指令的右边会有一个
小黑三角的标记，它代表该指令还包含下一级的指令，鼠标停留片刻即可显示。
1.7.3 快捷工具栏
“快捷工具栏”指的是“菜单栏”下边的3排按钮，选择菜单“查看/工具栏”，勾
选里面的“插入”、“文档”和“标准”3项，完整的快捷工具栏就显现出来了。
1.7.4 属性面板
在网页编辑窗口的下面还有一个面板，它是有名的“属性面板”，它在这个软件中
起到举足轻重的作用。
属性面板顾名思义，就是显示，调整属性的面板，根据鼠标所选中对象的不同，“属性
面板”在界面上也会有所差异，用户可以分别对不同的对象进行调整。
站点
2.1.1
创建站点
创建站点
要制作一个网站，第一步操作都是一样的，就是要创造一个“站点”，这样可以使
整个网站的脉络结构清晰地展现在面前，避免了以后再进行纷杂的管理。
从菜单中选择“站点/管理站点”在弹出的对话框中选择“新建”，之后再选择其
中的“站点”，再次弹出一个对话框，在文本框中输入自己已经企化好的网站名称“追
梦人”。
填好后，单击“下一步”，进入下一个步骤。由于我要做的是一个静态的网页，所以选择上面的一项“否，我不想使用服务器技术。”
单击“下一步”，进入下一个步骤。
在此选项中有两个选择，选择推荐的“编辑我的计算机上的本地副本，完成后再上
传到服务器”。底下的文本框允许在本地磁盘上指定一个文件夹，Dreamweaver将在其 中储存站点文件的本地副本。单击该文本框后面的文件夹图标，新建并指定一个空的文
件夹“E:/ding”。之后单击“下一步“，进入下一个步骤。
这一步是如何设置连接到远程服务器，弹出式菜单中有6中选择，这里选择“无”。
而后“下一步”再“完成”，即可。
2.1.2 创建站点内容
站点创建完成后，就可以创建Web页来填充站点了。在“右侧浮动面板组”中选择
“文件/文件”面板，此时整个网站中没有任何内容。用鼠标右击面板中的本地根目录
文件夹。在弹出的菜单中选择“新建文件”，新建一个文件后将其命名为“index.htm(或i
ndex.html),它就是未来的首页。
由于“追梦人”网站分为“平面设计”、“动画制作”、“网文精品”、“经典回
顾”、“个人说明“这五个大栏目，所以继续用鼠标右击右侧，在弹出的菜单中选择第
二项“New Folder（新建文件夹）”。执行五次操作，新建五个文件夹，并把它们重命
名为graph、anim、books、music、letter，分别对应上面的五个大栏目。存放它们各
自的内容。之后再次新建1个文件夹，命名为images,用来存放“所有的图象文件”的
内容。
之后在个栏目的文件夹里还要建立想相应的栏目网页。
2.2.1 设置首页布局
每个网站都会有一个首页，就功能上而言，它代表着一个网站的风格与特色，就网站
架构上而言，它代表了网站的第一层架构，至于网站上其他Web页，原则上都必须通过
首页来连接散播出去，可见首页是多么的重要。
首页是打开网站后在浏览器中显示的第一个页面。它是起什么名字通常要视Server端 的设置，一般的有index.htm,default.htm或home.htm等，目前主要以index.htm的
居多。当然，后缀名为html也是正确的。
具体设置方法是：右健单击“文件”浮动面板中的index.htm,在弹出的菜单中选择“设
成首页”。
首页的布局有很多方法，在这里我所用到的是表格的“布局模式”。“布局”模式中的表格称为布局表格，单元格称为布局单元格。在绘制布局表格和布局单元格时，必须从
“标准”模式切换到“布局”模式。直接单击“布局”按钮即可。
操作步骤：
1、在“插入快捷栏”的“布局”分类中，单击“布局表格”按纽。
2、将变成“+”形状的鼠标光标放到编辑中网页上，在要绘制的地方进行拖动
就可以进行创建了。（如果绘制的是第一个表格必须从网页的最左上角开始绘制）。
3、在这里要绘制多个表格，可以再次单击“布局表格”按纽进行绘制，也可
以按住Ctrl键绘制多个表格。追梦人”网站首页的布局如图所示：
2.2.2设置首页的页面属性
首先双击“文件”浮动面板中的index.htm,进入页面的编辑窗口。右健单击空白
区域，在菜单中选择“页面属性”，之后弹出“页面属性”对话框，若选择主菜单“修
改/页面属性”项，也可以把打开该对话框。
在“页面属性”对话框中，左侧窗口显示“分类”，其中包括了“外观”、“链
接”、“标题”、“标题/编码”、“跟踪图像”5项，右侧区域则显示各类中可以设置 的项目。“追梦人”首页设置的属性如下图所示：
2.2.3查看和编辑头内容
一个网页文件结构上实际是由两部分组成，头（head）内容和主体（body）内容
主体内容（body）是文档的主要部分，也是包含文本和图像等的可见部分。头内容（he
ad）是除文档标题外的不可见部分，包含有文档类型、语言编码、搜索引擎的关键的关键字和内容指示器以及样式定义等重要信息，这些元器并不是每个页面都需要的，例如，可以仅为主页提供关键字。
下面就以首页为例，说明怎样插入较常用的头（head）内容。
单击“菜单拦”下面“插入快捷”的下拉列表，选择其中的HTML类，此时右侧将
会显示该类中可以插入的对象快捷按钮，再次单击第2个按钮“文件头”旁边的下拉箭
头，会弹出菜单，该项列出的便是即将插入的头内容。
2.2.4 插入图像
图像是网页中不可或缺的组成成份，恰当地使用图像，可以使网站充满生活生命力
与说服力，吸引更多的浏览者，加深他们欣赏你网站的意愿。
另一方面，网页的容量大小是网站成功与否的一大关键因素。由于网络在传输上 的限制，导致了下载的速度不可能太快，因此，网页的大小就不能太大，其中关键就在
于图像的大小了，否则浏览者会失去等待的耐心，无论你的网站多么精彩也无济于事了。所以，在网面容量大小的问题上一定要重视。下面就来详细介绍对网页图像进行处理的
操作步骤，以使得它们在保持图形美丽与网站风格搭配的基础上，图片文件能够变的更
小。
1、首先将光标停留在要插入图像的位置，然后单击“菜单栏”下面“插入快健栏” 的下拉表，选择其中的“常用”类，则右侧将会显示该类中可以插入的对象快键按钮。
左起第5个即为“图像：图像”按钮，单击它右侧的下拉列表，选择第1项“图像”。
2、随即弹出“选择图像源文件”对话框。从计算机磁盘中选择想要插入的图像文件，或在URL编辑框中输入图像的路径和名称。下面的“相对于”下拉表框中，可选择文件
URL地址的类型，如果选择“文档”选项，表示图像地址相对于当前文档；如果选择“站
点根目录”选项，表示地址相对于根目录。在这里我要插入的是网站标志logo，插入l
ogo图象，如图所示：
最后单击“确定”按钮，即可完成插入图像的操作。2.2.5插入多媒体
在Dreamweaver MX2004中，除了之前讲到的可以插入“图像”外，还可插入动画、声音、视频等媒体元素，如Flash,Shockwave,Applets,ActieX及格Midi声音文件等，并且还可以在Dreamweaver自身内插入Macromedia Flash MX2004按钮和文本对象，以
及进行相关的后期处理和添加设计备注等操作。
在Dreamweaver MX 2004文档中，可以插入媒体文件包括Flash Shockwave影片、QuickTime、AVI java、applet Active X控件以及各种格式的音频文件。
要在浏览器中播放放Flash 动画，必须在浏览器中集成“Flash 播放器（Flash Play er）”。其中，Internet Explorer通过ActiveX控制来实现，Netscape Navigator则
是通过相应的插件来实现的。在最新的Netscape Navigator和Internet Explorer浏
览器中，均已集成了 Flash动画播放功能。操场作步骤：
步骤1 将光标停留在要插入Flash的位置，然后单击菜单栏下面“插入快捷栏”的下
拉列表，选择其中的“常用”分类，右侧将会显示该类中可以插入的对象快捷
按钮。左起第6个即为“媒体”按钮，单击它右侧的下拉列表，选择第1项Fl
ash图标。
步骤2 在弹出的对话框中选择扩展名为swf 的Flash文件，即可将其插入到Dreamwe
aver的“网页编辑窗口”中，可以看到，在这个窗口中Flash文件的大小。在
这里我的主页插入的一个动画，如图所示：
2.2.6插入文本
文字是人类语言最基本的表达方式，在网页中，文本内容也可以说是重要的组成
部分，一个网站成功与否，它是最关键的因素。在这最关键的因素。可丰富网站的文字
内容，并以最最美观、最整齐的方式放入到网页中。
插入文本的两种方式
网页中需要大量的文本，我们或以通过以下两种方式插入它们。
一种是在网页编辑窗口中直接用键盘敲入文本。这可以算是最基本的输入方式了，和一些文本编辑软件（如Microsoft Word）的使用方法一样，选择好习惯的输入法，就
可以运指如飞了。
另一种是复制文本的方式。有些读者可能不喜欢使用Dreamweaver MX2004来进行
打字的工作，而更习惯在专门的文本编辑软件中快速打字，如Microsoft Word和 Wind
ows自带的记事本等，又或者读者已经准备好了要放入网页的文本的电子版本，那么我
们就可以直接使用Dreamweaver的文本复制功能，将大段的文本内容拷贝到网页的编辑
窗口来进行排版的工作，具体步骤如下。
打开文本编辑软件（如Microsoft Word），选中要复制的文本，它们将反白显示，执行菜单“编辑/复制”命令或直接用快捷键Ctrl+C，之后切换回Dreamweaver,将光标
停留在插入文本的位置，执行主菜单“编辑/粘贴”命令或直接使用快捷键Ctrl+v,即可
将大段的文本快速粘贴到网页中。
这在我的“网文精品”中用到很多，全部是在word软件中排好ctrl+c,然后点击要
粘贴的位置，crtl+v到Dreamweaver即可。
2.3创建其它网页
还有其它的几个网站与主页的制作相同，一个网页是图象和文字的组合。“平面设计”中的图象插入和前面的介绍相似，并可以在属性拦中调节图象的大小。
在Dreamwerver中常常会用到Firework、Flash，它们是相辅相成，在主页中的主体部
分就是用Firework,如图所示：
在“个人说明”中也用到这点，首先定好需要尺寸，在属性中设好背景，颜色等
等，插入图象，输入文字，也word里的操作雷同。
3.建立网页链接
网站实际上是由很多网页组成的，那么网页之间是如何联系的呢？这就是本章要讲 的内容----网页的“链接”。“链接”，又称“超链接"（Hyperlink）,它作为网页的桥梁，起着相当重要的作用。网页中的很多对象都可以加入“链接”属性。在Dreamweaver MX2004中，如果以“链
接”的媒介来划分的话，则“链接”可以分为“文字链接”、“图像链接”、“图像地图链接”、“内部链接和外部链接”、“E-mail链接”、“命名锚记链接”、“文件下载链接”和“跳转菜单”，共8种。其中部分内容在之前的章节中可能接触过，这里将对其进行更深入的讲解。3.1文字链接
“文字链接”即以文字作为媒介的链接，它是网页中最常被使用的链接方式，具
有“文件小、制作简单和便于维护”的特点。
接下来结合我的个人网站为实例，来讲解如何为文字建立“链接”。
具体操作步骤如下所述。操作步骤
步骤1 准备好已经制作完成的首页的各个栏目页面（假设除了“链接”，其他内容都
已经制作完成了），该网站包含6个栏目，这里的5个栏目----“平面设计”、“动画
制作”和“网文精品”、“经典回顾”、“个人说明”为例来进行讲解。
步骤2 在Dreamweaver 中打开首页，之后反白选取作为“链接”的文字。实例中要做
到单击不同的栏目的网页。因此为第1个栏目“平面设计”设置链接，首先要反白选中
“平面设计”4个文字。
步骤3 观察“属性面板”，其中包括一个“链接”文本框。
步骤4 接下来需要把链接的地址加入到文本框中，方法有3种。
这里我用到的是直接点击文件夹图标，在文件夹中找到要链接的对象graph.htm。这样
就建立了超链接。不过有点很重要，由于大多数服务器都不支持中文文件名，而且对大
小写敏感，因此采用英文文件名并统一大小写。如图所示：
步骤5 在“链接”文本框下面还有一个“目标”下拉列表，从中可以选择链接网页显示 的窗口方式，共有4种。如图：
实例中没有选择任何选项，保持空白，表示在原窗口中打开链接网页。
步骤6 还可以设置一些“链接”的属性，这是前面讲过的内容。单击“属性面板”中的 “页面属性”，选择其中的“链接”分类，可以进行的设置有“链接字体”、“大小”、“链接颜色”、“变换图像链接”颜色、“已访问链接”颜色、“活动链接”颜色及“下
划线样式”。
步骤7 至此，第1个栏目的链接就制作完毕了，按下Ctrl+S保存网页，再按下F12预
览，测试一下，当鼠标放在“平面设计”这4个文字上时将变成手形，并且浏览器窗口下面的状态栏中会显示链接到的网页的地址，单击文字，页面会立即跳转到第1个栏目
中，这表示链接已经制作成功了。
步骤8 同理，按照以上步骤，再为“动画制作”和“网文精品”“经典回顾“等其它栏
制作指向对应栏目的链接。
步骤9 通常在栏目页面中还需要有“返回首页”的链接，单击其后可以跳转回首页，因
此在各个栏目中还要插入“网站首页”的文字，并且制作指向首页index.html的链接，制作方法不变。
至此，整个“文字链接”的实例就全就全部完成了。通过对这个实例的讲解，读者不仅
应该学会如何为文字制作链接，还应用对“链接”有了更加深刻的理解，链接的目的何
在？它到底能够在网页的网站中发挥什么样的作用？怎样才能更好地使用它？这些是
网页制作者更应该思考的问题。
下面继续介绍其他类型的链接。
3.2
3.23.2
3.2图像链接
图像链接图像链接
图像链接
“图像”也是常被使用的链接媒体，它和“文字链接”非常相似。为图像加入链接，首
先应该在网页中插入“图像”，有关插入“图像”或“导航条”按钮的内容，接下来以
我的网站“追梦人“为例，讲解如何建立“图像链接”。
操作步骤
步骤1 首先仍然要准备好已经制作完成的首页和各个栏目的页面（假设除了“链接”，其他内容都已经制作完成了），该网站包含6个栏目，下面我们就动手为这6个栏目分
别制作它们的链接。
步骤2 在Dreamweaver中打开网站的首页，之后选取要制作“链接”的图像。实例中先
为第3个栏目“动画制作”设置链接，因此选中包含“动画制作”4个字的图像。步骤3 观察“属性面板”，在“链接”文本框中输入链接的文字地址。可以使用之前讲
过的“指向文件”和“选择文件”的方法。
步骤4 如果有需要，可以在“目标”下拉列表中选择“链接”网页显示的窗口方式，分
别为-blank、-parent、-self或 top。实例中使用了默认出的保留空白选项的方式。
步骤5 另外，读者还可以为图像增加“替代”文本。实例中为第1个栏目增加栏目名称 的“替代”文本。
步骤6 至此，第1个栏目的图像链接就制作完毕了，按下Ctrl+S保存网页，再按下F1 2预览，测试一下，将鼠标放在“动画制作”4个文字上时将变成手形，同时浏览器窗
口下面的状态栏中会显示出链接到的网页的地址，并且会显示出“替代”文本“动画制
作”，单击文字，页面会立即跳转到第3个栏目中，这表示链接已经制作成功了。
步骤7 同理，按照以上步骤，再为其它几幅图像制作指向对应栏目的链接。
步骤8 在栏目页面中制作“返回首页”的链接，使得单击后可以跳转回首页，其制作方
法不变。
至此，整个“图像链像”的实例就全部完成了。
3.3E
3.3E 3.3E
3.3E –
––
MailMail
Mail的链接 的链接的链接 的链接
E-Mail链接，是指当浏览者单击该链接之后，不是打开一个网页文件，而是启动用户的
E-Mail客户端软件（如Outlook Express）,并打开一个空白的新邮件，供浏览者撰写
内容来与网站联系人联系，这是一种最方便的互动方式。
结合“个人说明”网页，建立E-Mail链接的步骤如下所述。
操作步骤 步骤1 将光标停留在页面右下角要插入E-mail链接的位置。步骤2 选择“插入快捷栏”中的“常用”分类，单击左侧第2个“电子邮件链接”按钮。
步骤3 在弹出的“电子邮件链接”对话框中有两个输入项，分别是“文本”和“E-Mai
l”。在“文本”项中输入链接的文字，中文、英文均可，在E-Mail项中输入网站联
系有的电子邮件地址，如实例中的 ding_zhuimeng123@163.net。
步骤4 单击“确定”按钮，具有“E-Mail链接”属性的文本就ding_zhuimeng123@163.net。插入到光标所在位置了，按下 Ctrl+S保存网页，再按下F12预览查看实际效果。
上面的方法只适用于文本的“E-Mail链接”，如果想在其它的对象（如图像）上也加入
这种链接，该怎办呢？下面介绍第2种建立“E-Mail链接”的方法。
其实很简单，与前面讲过的图像加入链接的方法基本一样。先在页面中需要的地方插入
图像，之后选中图像，并在“属性面板”的“链接”文本框中输入如下语句即可----ma
ilto: ding_zhuimeng123@163.net ?subject=网站的建议与第1种方法不同的是，E-Ma
il 地址前面增加了mailto:字样。用这种方法就可以给图像等其他对象建立“E-Mail
链接”了。
3.4
3.43.4
3.4文件下载链接
文件下载链接文件下载链接
文件下载链接
“文件下载链接”的原理很简单，只要链接文件属于浏览无法识别的关型，便都会使用 IE浏览器直接进行下载，并保存到本地计算机中。
浏览器无法识别的文件类型有很多，这里就介绍一个最常用的，以zip或rar为后缀名 的压缩格式文件，这种文件可以使用主流的压缩软件（如winzip、winrar）来制作。下
面我们就业以实例来说明。在前面“插入多媒体”一章中，我们曾经讲过直接链接文件的方式来插入“视频”，即
直接在“链接”文本框中输入“文件名+名后缀名”，如olympus.wmv。单日击这个链接，经过数据下载后，Windows系统将启动自带的媒体播放器Windows Media Player 来播
放该视频。
操作步骤
步骤1 先将视频文件olympus.wmv通压缩成olympus.rar文件，放入站点的media文件
夹下。
步骤2 将文件路径输入至“链接”文本框中。
步骤3 保存网页，按下F12预览，在浏览器中单击“下载精彩广告视频”链接文本，会
弹出“文本下载”选择框，单击其中的“保存”按钮。
步骤4 在“另存为”对框中选择保存到本地计算机中的位置，实例中为“经典回顾”文
件夹。之后单击“保存”按钮，压缩文件即保存到该位置中。至此，“文件下载链接”
便制作完成了。读者可以打开“我的文档”文件夹，解压缩olympus.rar文件，随时欣
赏下载影片。
本设计中未用到此链接，在此只作简单介绍。
3.5
3.53.5
3.5在在在
在HTML
HTMLHTML
HTML语言中建立网页链接
语言中建立网页链接语言中建立网页链接
语言中建立网页链接
3.5.1
3.5.13.5.1
3.5.1文字链接
文字链接文字链接
文字链接
在HTML语言中用超链接标记指向一个目标。其基本格式为： 举个简单的“文本链接”的实例，该实例相对应的HTML代码如下所示。
a href-“index2.html”target=”-blank”>平面设计（新开窗口，-blank)< /p>
动画制作（原窗口，默认为空）
第三篇：毕业设计(论文)个人网站的设计与实现
题目：个人网站实现技术
个人网站实现技术
个人网站的设计与实现
前 言
随着国际互联网的普及，很多人已经不满足仅仅在Internet上的浏览信息，而是希望更深入的参与其中，拥有自己的Web网站，这似乎已经成为一种潮流。如果说个人建立网站是为了追求时尚，那么企业建立网站就是必然的选择了。
无论是专业的，还是业余的，很多人对网页制作颇感兴趣。事实上制作一个简单的网页并不困难，会使用Word的人都可以胜任。但想做出超凡脱俗的网页就不那么容易了，而Dreamweaver却可以满足你的愿望，它是Macromedia公司开发的集网页制作和网站管理于一身的所见即所得的网页编辑器。
同样出自Macromedia公司的Flash,Fireworks在制作网站的过程中起到了锦上添花的作用，是个人网站实现的好帮手，在制作网站的时候经常会用到这些软件。
本文有五章，我来由浅到深介绍个人网站的设计与实现。
摘 要
在互联网走进我们的生活之前，没有人敢梦想拥有自己的报纸、杂志、电台、电视台。除了政策上的制约外，一个人也根本没有操作一份传播媒体的能力。现在不同了，互联网给我们提供了一个“表达自我”的自由天地,你可以拥有自己的新闻邮件，你可以建立自己的个人网站。只要你办得成功也可以吸引成千上万的订户、读者,并建立自己在众多参与者中的权威地位。建立个人网站的基本过程可以分为以下七个环节 : 1 了解中国网络个人主页研究背景与发展现状 2 系统需求分析与总体设计 3 熟悉网站开发模式、工具及环境 把自己的作品和想要展示的内容制作成网页。5 使用动态网页技术(ASP)，实现动态内容更新。6 认真地选取测试用例，进行交叉测试 7 网站的后期完善、宣传及发展方向
其中 ,网页制作和使用动态网页技术(ASP)实现动态内容更新是网站开发的核心内容。
关键词：网页、制作、访问、链接 Abstract Enters before our life in the Internet, nobody dares to vainly hope for has own newspaper, the magazine, the broadcasting station, the television station.Besides the policy in restriction, a person simply has not also operated dissemination media the ability.Now has been different, Internet has provided to us “the expression” free world,You may have own news mail, you may establish own individual website.So long as you also manage the success to be possible to attract the tens of thousands of subscribers, the reader,And establishes oneself in the multitudinous participant's authoritative status.Establishes individual website the unit process to be possible to divide into following seven links: 1、understands the Chinese network individual main page research background and the development present situation 2 systems demands analysis and system design 3 familiar websites developments pattern, tool and environment 4 and wants own work the content which demonstrated to manufacture the homepage.5 uses dynamic homepages technology(ASP), realization dynamic content renewal.6 earnestly selects measured the test example, carries on the overlapping test 7 websites later periods consummate, the propaganda and the development direction Among them,The homepage manufacture and the use dynamic homepage technology(ASP)realizes the dynamic content renewal is the website development core content.Key word: Homepage, manufacture, visit, link
目 录 第一章 引言 1.1 什么是Internet 1.2 Internet有哪些功能 1.3 www简介
1.4 网页基本构成元素 1.5 软件的安装与启动 1.5.1 软件的安装 1.5.2 软件的启动 1.5.3 创建快捷方式 1.6 制作网页前的准备 1.7 Dreamweaver的操作环境 1.7.1标题栏 1.7.2菜单栏 1.7.3快捷工具栏 1.7.4属性面板 第二章 网站制作实战 2.1 站点 2.1.1创建站点 2.1.2 创建站点内容 2.2 首页
2.2.1 设置首页布局 2.2.2 设置首页的页面属性 2.2.3 查看和编辑头内容 2.2.4 插入图像 2.2.5 插入多媒体 2.2.6 插入文本 2.3 创建其它网页 第三章 建立网页链接 3.1 文字链接 3.2 图像链接 3.3 E-Mail链接 3.4 文件下载链接
3.5 在HTML语言中建立网页链接 3.5.1 文字链接 3.5.2 图像链接 3.5.3 E-Mail链接 3.6.4 文件下载链接 第四章 结论 致 谢 参考文献
第一章 预备知识
1.1 什么是Internet Internet的中文名为“国际互联网”，又称“因特网”。
Internet是由众多的计算机网络互联而成的互联网，它覆盖了全世界各地，它是采用开放系统协议的计算机通讯网络。然而，Internet不仅仅是计算机的互联网，它还是全球最大的信息资源宝库，它提供了包括科研、教育、文化娱乐、商业和信息交流等各种各样的服务，使得世界范围内的人与人之间的交流在时间和空间上变的更小了。
要了解Internet，就必须先了解局域网。我们可以将同一地点的许多计算机使用网线连接在一起，构成一个高效率的计算机网络，所有处于网络内的终端机或电脑都能享受网络内所有的资源，比如程序，图文资料等。这种计算机网络因为一般都局限在一定区域中，我们称之为“局域网”（Local Area Network,简称LAN）,它是在日常工作中用得最多的一种小型计算机网络。局域网所覆盖的地理范围比较小，通常不超过几十公里，甚至只在同一座建筑物内或者邻近的几座建筑内。像常见的校园网，一座写字楼内部的网络等都属于局域网。
而Internet则不是指单个区域范围内的网络，而是指将全世界的各中不同类型的计算机网络连接起来的一个全球性的网络。Internet上有取之不尽，用之不竭的信息资源。对于Internet中各种各样的信息，所有的人都可以通过网络的连接来共享和使用。
1.2 Internet有那些功能
Web页浏览：这是目前利用最广泛、最直接的互联网服务，通过浏览WWW（万维网）中的网页，可以了解世界各地的新闻，查看最新的股市行情，最新的娱乐动态、科技发明，找到众多的就业信息„„几乎想找到什么样的信息，就有什么信息。正是有了WWW、Internet才会变得如此丰富多彩，才能走进千家万户。信息发布：通过Internet，不仅可以浏览别人发布在Web页上的信息，也可以将自己要发布的信息制作成Web页，也即网页，然后发布到Internet上，供全世界的人浏览。
电子邮件：不同于传统邮件，电子邮件(E-mail)通过Internet传输，写信，发信，收信都在计算机上完成，一封电子邮件最短在一秒之内就可以发送出去，其效率是传统邮件无法比拟的。而且发送与接收电子邮件几乎是免费的，所以比传统邮件既节省时间又经济的多。
网上聊天：通过聊天软件（如QQ、ICQ等）或不同网站的聊天室，可以和世界各地的网友聊天。网友可能是远在天边的异国朋友，也可能是与你一起工作的饿同事，或者是一起生活的家人，在这里没有年龄、性别、身份、职业、国籍、肤色的限制，完全突破了交友的传统方式，人们可通过Internet互相了解对方，进行各种各样的交流。
电子商务：现在网上交易已经成为现实，网上购物、网上商品销售、网上拍卖、企业级电子商务、网上货币支付等电子商务活动已经搞的有声有色，几乎所有的专家都预测，在未来的几年内，电子商务会飞速发展。在不久的将来，您可以做在电脑前进行各种各样的商务活动。
网络游戏：通过Internet，可以与全世界的玩家一起进行游戏对战，也可以协同作战。网络游戏已经成为信息产业全新的经济增长点，每年都为开发商带来巨额的利润。通过网络游戏，可以充分享受Internet给我们带来的乐趣。
网络电话：网络电话也称IP电话。它采用Internet技术，利用专门的网络电话软件，只需支付非常低廉的话费就可通话。Internet在电信市场上的应用将越来越广泛。
1.3 WWW的简介
WWW的全称为World Wide Web，含义是“环球网”，又称“万维网”、3W、Web。WWW是一个基于超文本（Hypertext）方式的信息检索服务工具。我们上网浏览到的网页就是这样的超文本，也就是HTML(Hypertext Mark-up Language,超文本标记语言)文件，这些网页文件被放置到WWW服务器上，并且都有一定的地址。当我们想浏览某个网站时，首先要在电脑上安装浏览器，如Internet Explorer或Netscape，然后在浏览器中输入网站的地址（网址），就可以进入网站进行浏览。在这些网页中，都有超连接，当将鼠标指针移动到某个地方（如文本或图象）时，鼠标指针就会变成一个小手形形状，单击它就可以连接到另个网页中，从而使得浏览者能在不同的信息之间跳转，我们之所以能在Internet的海洋中穿梭自如，正是超连接的功劳。
WWW 为我们带来的是世界范围的超级文本服务：只须操纵鼠标，就可以通过Internet从世界各地调来你所希望的文本、图像、动画和声音等信息。通过使用WWW，一个不熟悉网络使用的人也可以成为Internet的行家。
1.4网页基本构成元素
要学会制作网页，首先需要了解网页都是由什么元素构成的。
文字：文本是构成网页的基本元素。一个最简单的网页可以只有几行文本。
图片：正是有个各种美丽的图片，网页才变得多姿多彩。
动画：如今，网页上的动画越来越多，最常用的有GIF动画、Flash动画等。
超连接：如上所述，超连接几乎是必不可少的。一个没有超连接的网页，就如同汪洋大海中的一座孤岛，失去了与外界的一切联系。
其它元素：还可以在网页中添加声音、视频等元素。
1.5软件的安装与启动 要使用网站设计软件，自然先要将这些软件安装到自己的电脑中。安装完毕，还需要如何启动，如何创建快捷方式。下面就让我们来详细地看一看具体的操作步骤。
1.5.1软件的安装
安装之前，需要先了解软件对系统的要求。以Windows为例，系统要求如下： Intel Pentium II处理器或等效处理器，主频300MHz或更高。
Windows 98Windows 2000Windows NT(具有Service Pack 3 或更高版本)、Windows Me或Windows XP.Netscape Navigator 4.0版或更高版本或Microsoft Internet Explorer.96MB的可用内存（RAM），建议采用128MB内存。
分辨率可达 800×600像素的256色显示器（建议颜色为百万颜色，分辨率达到1024×768像素）。CD-ROM 驱动器。
检查一下您的计算机，看是否具备了以上条件。如果具备，将“Macromedia Studio MX”程序会自动运行。如果不能自动运行，可以找到光盘放入光驱，安装程序会自动运行。可以找到光盘中的“Install Macromedia Studio MX”程序或“Autorun”程序并双击运行。
Dreamweaver的安装比较容易，几乎可以自动完成。下面简要说明一下安装步骤。
操作步骤：
1、将安装光盘放入光驱，安装程序自动运行，并出现安装界面。如果单击安装界面上的“Macromedia STUDIO MX安装”，那么将会安装其下方所列出的软件。所有的安装会自动完成。
2、单击Dreamweaver MX,开始安装过装过程.先是出现解压缩文件窗口,等待一会儿,便会出现安装向导对话框。单击“下一步”按钮，继续安装过程。
3、出现“选择目的地位置”对话框，默认的盘是C盘，如果想安装到不同的位置，可以单击目的文件夹右边的“浏览”按钮，并在弹出的“选择文件夹”对话框选择不同的文件，如要安装在D盘则可直接将路径中的“C：”改为“D:”。也可以在下面的“目录”中选择其它的文件夹，设置完后，单击“确定”，回到“选择目的地址”对话框，单击“下一步”继续。
4、而后会出现“默认编辑器”的对话框，默认为全选。如果希望让Dreamweaver MX成为下面所列文件类型的默认编辑器，那么可以在这里做选择。选择完毕，单击“下一步”按钮。
5、出现“开始复制文件”对话框，单击“下一步”安装程序开始复制文件，过几分钟后，安装结束，单击“结束”按钮，结束安装。
1.5.2 软件启动
软件安装完毕后，我们就可以使用它了。安装程序已经自动在“开始”菜单中加入了快捷方式。
单击“开始”菜单，将鼠标指针依次指向“程序”|“Macromedia”|“Macromedia MX”,并在上面单击鼠标左键。
1.5.3 创建快捷方式 使用“开始”菜单启动程序的过程比较烦琐。可以在Windows桌面或快速启动栏上创建快捷方式，这样可以快速的启动程序。
具体实现方法是：在“开始”菜单中找到相应程序的快捷方式，不过这是不要用鼠标左键单击，而是用右键按住向桌面拖动，然后松开右键，会出现一个快捷菜单，在其中可以选择不同的命令，比如选择“在当前位置创建快捷方式”或“复制到当前位置”。
这样以后在运行程序时，就方便快捷的多了。
1.6 制作网页前的准备
电脑必备：
电脑速度够快，最好能够上网。操作系统：Windows 98/NT/Me/2000/XP.软件可选：
其它软件：看图软件ACDSee、图像处理软件Photoshop、上传工具CuteFTP、Fireworks、动画软件Flash等。
1.7 Dreamweaver MX的操作环境
我们将工作界面分成了“标题栏”、“菜单栏”、“快捷工具栏”、“属性面板”、“浮动控制面板”5个部分来分别介绍。
1.7.1 标题栏 Dreamweaver MX的“标题栏”中将显示文字“Macromedia Dreamweaver MX”如果打开网页的话，在后面还会显示该网页的一些信息，如网页标题、所在位置及网页名称，右边有三个钮，分别对应Dreamweaver MX的最大化最小化和关闭的操作。
1.7.2 菜单栏
“标题栏”下面就是“菜单栏”，栏中提供了“文件”、“编辑”、“查看”、“插入”、“修改”、“文本”、“站点”、“窗口”、“帮助”10项菜单。单击其中任意一项菜单，随即就会出现一个下拉式指令菜单。有些指令的右边会有键盘的代码，这是该指令的快捷键，熟练使用快捷键将会有助于提高工作效率。有些指令的右边会有一个小黑三角的标记，它代表该指令还包含下一级的指令，鼠标停留片刻即可显示。
1.7.3 快捷工具栏
“快捷工具栏”指的是“菜单栏”下边的3排按钮，选择菜单“查看/工具栏”，勾选里面的“插入”、“文档”和“标准”3项，完整的快捷工具栏就显现出来了。
1.7.4 属性面板
在网页编辑窗口的下面还有一个面板，它是有名的“属性面板”，它在这个软件中起到举足轻重的作用。
属性面板顾名思义，就是显示，调整属性的面板，根据鼠标所选中对象的不同，“属性面板”在界面上也会有所差异，用户可以分别对不同的对象进行调整。
第二章 网站制作实战
2.1 站点
2.1.1 创建站点
要制作一个网站，第一步操作都是一样的，就是要创造一个“站点”，这样可以使整个网站的脉络结构清晰地展现在面前，避免了以后再进行纷杂的管理。
从菜单中选择“站点/管理站点”在弹出的对话框中选择“新建”，之后再选择其中的“站点”，再次弹出一个对话框，在文本框中输入自己已经企化好的网站名称“追梦人”。
填好后，单击“下一步”，进入下一个步骤。由于我要做的是一个静态的网页，所以选择上面的一项“否，我不想使用服务器技术。” 单击“下一步”，进入下一个步骤。
在此选项中有两个选择，选择推荐的“编辑我的计算机上的本地副本，完成后再上传到服务器”。底下的文本框允许在本地磁盘上指定一个文件夹，Dreamweaver将在其中储存站点文件的本地副本。单击该文本框后面的文件夹图标，新建并指定一个空的文件夹“E:/ding”。之后单击“下一步“，进入下一个步骤。
这一步是如何设置连接到远程服务器，弹出式菜单中有6中选择，这里选择“无”。而后“下一步”再“完成”，即可。
2.1.2 创建站点内容
站点创建完成后，就可以创建Web页来填充站点了。在“右侧浮动面板组”中选择“文件/文件”面板，此时整个网站中没有任何内容。用鼠标右击面板中的本地根目录文件夹。在弹出的菜单中选择“新建文件”，新建一个文件后将其命名为“index.htm(或index.html),它就是未来的首页。
由于“追梦人”网站分为“平面设计”、“动画制作”、“网文精品”、“经典回顾”、“个人说明“这五个大栏目，所以继续用鼠标右击右侧，在弹出的菜单中选择第二项“New Folder（新建文件夹）”。执行五次操作，新建五个文件夹，并把它们重命名为graph、anim、books、music、letter，分别对应上面的五个大栏目。存放它们各自的内容。之后再次新建1个文件夹，命名为images,用来存放“所有的图象文件”的内容。
之后在个栏目的文件夹里还要建立想相应的栏目网页。
2.2 首页
2.2.1 设置首页布局
每个网站都会有一个首页，就功能上而言，它代表着一个网站的风格与特色，就网站架构上而言，它代表了网站的第一层架构，至于网站上其他Web页，原则上都必须通过首页来连接散播出去，可见首页是多么的重要。
首页是打开网站后在浏览器中显示的第一个页面。它是起什么名字通常要视Server端的设置，一般的有index.htm,default.htm或home.htm等，目前主要以index.htm的居多。当然，后缀名为html也是正确的。
具体设置方法是：右健单击“文件”浮动面板中的index.htm,在弹出的菜单中选择“设成首页”。
首页的布局有很多方法，在这里我所用到的是表格的“布局模式”。“布局”模式中的表格称为布局表格，单元格称为布局单元格。在绘制布局表格和布局单元格时，必须从“标准”模式切换到“布局”模式。直接单击“布局”按钮即可。操作步骤：
1、在“插入快捷栏”的“布局”分类中，单击“布局表格”按纽。
2、将变成“+”形状的鼠标光标放到编辑中网页上，在要绘制的地方进行拖动就可以进行创建了。（如果绘制的是第一个表格必须从网页的最左上角开始绘制）。
3、在这里要绘制多个表格，可以再次单击“布局表格”按纽进行绘制，也可以按住Ctrl键绘制多个表格。追梦人”网站首页的布局如图所示：
2.2.2设置首页的页面属性
首先双击“文件”浮动面板中的index.htm,进入页面的编辑窗口。右健单击空白区域，在菜单中选择“页面属性”，之后弹出“页面属性”对话框，若选择主菜单“修改/页面属性”项，也可以把打开该对话框。
在“页面属性”对话框中，左侧窗口显示“分类”，其中包括了“外观”、“链接”、“标题”、“标题/编码”、“跟踪图像”5项，右侧区域则显示各类中可以设置的项目。“追梦人”首页设置的属性如下图所示：
2.2.3查看和编辑头内容
一个网页文件结构上实际是由两部分组成，头（head）内容和主体（body）内容主体内容（body）是文档的主要部分，也是包含文本和图像等的可见部分。头内容（head）是除文档标题外的不可见部分，包含有文档类型、语言编码、搜索引擎的关键的关键字和内容指示器以及样式定义等重要信息，这些元器并不是每个页面都需要的，例如，可以仅为主页提供关键字。
下面就以首页为例，说明怎样插入较常用的头（head）内容。
单击“菜单拦”下面“插入快捷”的下拉列表，选择其中的HTML类，此时右侧将会显示该类中可以插入的对象快捷按钮，再次单击第2个按钮“文件头”旁边的下拉箭头，会弹出菜单，该项列出的便是即将插入的头内容。
2.2.4 插入图像
图像是网页中不可或缺的组成成份，恰当地使用图像，可以使网站充满生活生命力与说服力，吸引更多的浏览者，加深他们欣赏你网站的意愿。
另一方面，网页的容量大小是网站成功与否的一大关键因素。由于网络在传输上的限制，导致了下载的速度不可能太快，因此，网页的大小就不能太大，其中关键就在于图像的大小了，否则浏览者会失去等待的耐心，无论你的网站多么精彩也无济于事了。所以，在网面容量大小的问题上一定要重视。下面就来详细介绍对网页图像进行处理的操作步骤，以使得它们在保持图形美丽与网站风格搭配的基础上，图片文件能够变的更小。
1、首先将光标停留在要插入图像的位置，然后单击“菜单栏”下面“插入快健栏”的下拉表，选择其中的“常用”类，则右侧将会显示该类中可以插入的对象快键按钮。左起第5个即为“图像：图像”按钮，单击它右侧的下拉列表，选择第1项“图像”。
2、随即弹出“选择图像源文件”对话框。从计算机磁盘中选择想要插入的图像文件，或在URL编辑框中输入图像的路径和名称。下面的“相对于”下拉表框中，可选择文件URL地址的类型，如果选择“文档”选项，表示图像地址相对于当前文档；如果选择“站点根目录”选项，表示地址相对于根目录。在这里我要插入的是网站标志logo，插入logo图象，如图所示：
最后单击“确定”按钮，即可完成插入图像的操作。2.2.5插入多媒体
在Dreamweaver MX2004中，除了之前讲到的可以插入“图像”外，还可插入动画、声音、视频等媒体元素，如Flash,Shockwave,Applets,ActieX及格Midi声音文件等，并且还可以在Dreamweaver自身内插入Macromedia Flash MX2004按钮和文本对象，以及进行相关的后期处理和添加设计备注等操作。
在Dreamweaver MX 2004文档中，可以插入媒体文件包括Flash Shockwave影片、QuickTime、AVI java、applet Active X控件以及各种格式的音频文件。要在浏览器中播放放Flash 动画，必须在浏览器中集成“Flash 播放器（Flash Player）”。其中，Internet Explorer通过ActiveX控制来实现，Netscape Navigator则是通过相应的插件来实现的。在最新的Netscape Navigator和Internet Explorer浏览器中，均已集成了 Flash动画播放功能。操场作步骤：
步骤1 将光标停留在要插入Flash的位置，然后单击菜单栏下面“插入快捷栏”的下拉列表，选择其中的“常用”分类，右侧将会显示该类中可以插入的对象快捷按钮。左起第6个即为“媒体”按钮，单击它右侧的下拉列表，选择第1项Flash图标。
步骤2 在弹出的对话框中选择扩展名为swf 的Flash文件，即可将其插入到Dreamwe aver的“网页编辑窗口”中，可以看到，在这个窗口中Flash文件的大小。在这里我的主页插入的一个动画，如图所示：
2.2.6插入文本 文字是人类语言最基本的表达方式，在网页中，文本内容也可以说是重要的组成部分，一个网站成功与否，它是最关键的因素。在这最关键的因素。可丰富网站的文字内容，并以最最美观、最整齐的方式放入到网页中。插入文本的两种方式
网页中需要大量的文本，我们或以通过以下两种方式插入它们。
一种是在网页编辑窗口中直接用键盘敲入文本。这可以算是最基本的输入方式了，和一些文本编辑软件（如Microsoft Word）的使用方法一样，选择好习惯的输入法，就可以运指如飞了。
另一种是复制文本的方式。有些读者可能不喜欢使用Dreamweaver MX2004来进行打字的工作，而更习惯在专门的文本编辑软件中快速打字，如Microsoft Word和 Windows自带的记事本等，又或者读者已经准备好了要放入网页的文本的电子版本，那么我们就可以直接使用Dreamweaver的文本复制功能，将大段的文本内容拷贝到网页的编辑窗口来进行排版的工作，具体步骤如下。
打开文本编辑软件（如Microsoft Word），选中要复制的文本，它们将反白显示，执行菜单“编辑/复制”命令或直接用快捷键Ctrl+C，之后切换回Dreamweaver,将光标停留在插入文本的位置，执行主菜单“编辑/粘贴”命令或直接使用快捷键Ctrl+v,即可将大段的文本快速粘贴到网页中。
这在我的“网文精品”中用到很多，全部是在word软件中排好ctrl+c,然后点击要粘贴的位置，crtl+v到Dreamweaver即可。
2.3创建其它网页
还有其它的几个网站与主页的制作相同，一个网页是图象和文字的组合。“平面设计”中的图象插入和前面的介绍相似，并可以在属性拦中调节图象的大小。在Dreamwerver中常常会用到Firework、Flash，它们是相辅相成，在主页中的主体部分就是用Firework,如图所示：
在“个人说明”中也用到这点，首先定好需要尺寸，在属性中设好背景，颜色等等，插入图象，输入文字，也word里的操作雷同。
第三章 建立网页链接
网站实际上是由很多网页组成的，那么网页之间是如何联系的呢？这就是本章要讲的内容----网页的“链接”。
“链接”，又称“超链接"（Hyperlink）,它作为网页的桥梁，起着相当重要的作用。网页中的很多对象都可以加入“链接”属性。在Dreamweaver MX2004中，如果以“链接”的媒介来划分的话，则“链接”可以分为“文字链接”、“图像链接”、“图像地图链接”、“内部链接和外部链接”、“E-mail链接”、“命名锚记链接”、“文件下载链接”和“跳转菜单”，共8种。其中部分内容在之前的章节中可能接触过，这里将对其进行更深入的讲解。
3.1文字链接
“文字链接”即以文字作为媒介的链接，它是网页中最常被使用的链接方式，具有“文件小、制作简单和便于维护”的特点。
接下来结合我的个人网站为实例，来讲解如何为文字建立“链接”。具体操作步骤如下所述。操作步骤
步骤1 准备好已经制作完成的首页的各个栏目页面（假设除了“链接”，其他内容都已经制作完成了），该网站包含6个栏目，这里的5个栏目----“平面设计”、“动画制作”和“网文精品”、“经典回顾”、“个人说明”为例来进行讲解。
步骤2 在Dreamweaver 中打开首页，之后反白选取作为“链接”的文字。实例中要做到单击不同的栏目的网页。因此为第1个栏目“平面设计”设置链接，首先要反白选中“平面设计”4个文字。
步骤3 观察“属性面板”，其中包括一个“链接”文本框。步骤4 接下来需要把链接的地址加入到文本框中，方法有3种。
这里我用到的是直接点击文件夹图标，在文件夹中找到要链接的对象graph.htm。这样就建立了超链接。不过有点很重要，由于大多数服务器都不支持中文文件名，而且对大小写敏感，因此采用英文文件名并统一大小写。如图所示：
步骤5 在“链接”文本框下面还有一个“目标”下拉列表，从中可以选择链接网页显示的窗口方式，共有4种。如图：
实例中没有选择任何选项，保持空白，表示在原窗口中打开链接网页。
步骤6 还可以设置一些“链接”的属性，这是前面讲过的内容。单击“属性面板”中的“页面属性”，选择其中的“链接”分类，可以进行的设置有“链接字体”、“大小”、“链接颜色”、“变换图像链接”颜色、“已访问链接”颜色、“活动链接”颜色及“下划线样式”。
步骤7 至此，第1个栏目的链接就制作完毕了，按下Ctrl+S保存网页，再按下F12预览，测试一下，当鼠标放在“平面设计”这4个文字上时将变成手形，并且浏览器窗口下面的状态栏中会显示链接到的网页的地址，单击文字，页面会立即跳转到第1个栏目中，这表示链接已经制作成功了。
步骤8 同理，按照以上步骤，再为“动画制作”和“网文精品”“经典回顾“等其它栏制作指向对应栏目的链接。
步骤9 通常在栏目页面中还需要有“返回首页”的链接，单击其后可以跳转回首页，因此在各个栏目中还要插入“网站首页”的文字，并且制作指向首页index.html的链接，制作方法不变。
至此，整个“文字链接”的实例就全就全部完成了。通过对这个实例的讲解，读者不仅应该学会如何为文字制作链接，还应用对“链接”有了更加深刻的理解，链接的目的何在？它到底能够在网页的网站中发挥什么样的作用？怎样才能更好地使用它？这些是网页制作者更应该思考的问题。下面继续介绍其他类型的链接。
3.2图像链接
“图像”也是常被使用的链接媒体，它和“文字链接”非常相似。为图像加入链接，首先应该在网页中插入“图像”，有关插入“图像”或“导航条”按钮的内容，接下来以我的网站“追梦人“为例，讲解如何建立“图像链接”。操作步骤
步骤1 首先仍然要准备好已经制作完成的首页和各个栏目的页面（假设除了“链接”，其他内容都已经制作完成了），该网站包含6个栏目，下面我们就动手为这6个栏目分别制作它们的链接。
步骤2 在Dreamweaver中打开网站的首页，之后选取要制作“链接”的图像。实例中先为第3个栏目“动画制作”设置链接，因此选中包含“动画制作”4个字的图像。步骤3 观察“属性面板”，在“链接”文本框中输入链接的文字地址。可以使用之前讲过的“指向文件”和“选择文件”的方法。
步骤4 如果有需要，可以在“目标”下拉列表中选择“链接”网页显示的窗口方式，分别为-blank、-parent、-self或 top。实例中使用了默认出的保留空白选项的方式。
步骤5 另外，读者还可以为图像增加“替代”文本。实例中为第1个栏目增加栏目名称的“替代”文本。
步骤6 至此，第1个栏目的图像链接就制作完毕了，按下Ctrl+S保存网页，再按下F12预览，测试一下，将鼠标放在“动画制作”4个文字上时将变成手形，同时浏览器窗口下面的状态栏中会显示出链接到的网页的地址，并且会显示出“替代”文本“动画制作”，单击文字，页面会立即跳转到第3个栏目中，这表示链接已经制作成功了。步骤7 同理，按照以上步骤，再为其它几幅图像制作指向对应栏目的链接。
步骤8 在栏目页面中制作“返回首页”的链接，使得单击后可以跳转回首页，其制作方法不变。
至此，整个“图像链像”的实例就全部完成了。
3.3E –Mail的链接
E-Mail链接，是指当浏览者单击该链接之后，不是打开一个网页文件，而是启动用户的E-Mail客户端软件（如Outlook Express）,并打开一个空白的新邮件，供浏览者撰写内容来与网站联系人联系，这是一种最方便的互动方式。结合“个人说明”网页，建立E-Mail链接的步骤如下所述。操作步骤 步骤1 将光标停留在页面右下角要插入E-mail链接的位置。
步骤2 选择“插入快捷栏”中的“常用”分类，单击左侧第2个“电子邮件链接”按钮。
步骤3 在弹出的“电子邮件链接”对话框中有两个输入项，分别是“文本”和“E-Mail”。在“文本”项中输入链接的文字，中文、英文均可，在E-Mail项中输入网站联系有的电子邮件地址，如实例中的 ding_zhuimeng123@163.net。
步骤4 单击“确定”按钮，具有“E-Mail链接”属性的文本就ding_zhuimeng123@163.net。插入到光标所在位置了，按下 Ctrl+S保存网页，再按下F12预览查看实际效果。上面的方法只适用于文本的“E-Mail链接”，如果想在其它的对象（如图像）上也加入这种链接，该怎办呢？下面介绍第2种建立“E-Mail链接”的方法。
其实很简单，与前面讲过的图像加入链接的方法基本一样。先在页面中需要的地方插入图像，之后选中图像，并在“属性面板”的“链接”文本框中输入如下语句即可----mailto: ding_zhuimeng123@163.net ?subject=网站的建议与第1种方法不同的是，E-Mail 地址前面增加了mailto:字样。用这种方法就可以给图像等其他对象建立“E-Mail链接”了。
3.4文件下载链接
“文件下载链接”的原理很简单，只要链接文件属于浏览无法识别的关型，便都会使用IE浏览器直接进行下载，并保存到本地计算机中。
浏览器无法识别的文件类型有很多，这里就介绍一个最常用的，以zip或rar为后缀名的压缩格式文件，这种文件可以使用主流的压缩软件（如winzip、winrar）来制作。下面我们就业以实例来说明。在前面“插入多媒体”一章中，我们曾经讲过直接链接文件的方式来插入“视频”，即直接在“链接”文本框中输入“文件名+名后缀名”，如olympus.wmv。单日击这个链接，经过数据下载后，Windows系统将启动自带的媒体播放器Windows Media Player 来播放该视频。操作步骤
步骤1 先将视频文件olympus.wmv通压缩成olympus.rar文件，放入站点的media文件夹下。
步骤2 将文件路径输入至“链接”文本框中。
步骤3 保存网页，按下F12预览，在浏览器中单击“下载精彩广告视频”链接文本，会弹出“文本下载”选择框，单击其中的“保存”按钮。
步骤4 在“另存为”对框中选择保存到本地计算机中的位置，实例中为“经典回顾”文件夹。之后单击“保存”按钮，压缩文件即保存到该位置中。至此，“文件下载链接”便制作完成了。读者可以打开“我的文档”文件夹，解压缩olympus.rar文件，随时欣赏下载影片。
本设计中未用到此链接，在此只作简单介绍。
3.5在HTML语言中建立网页链接
3.5.1文字链接
在HTML语言中用超链接标记指向一个目标。其基本格式为： 举个简单的“文本链接”的实例，该实例相对应的HTML代码如下所示。 a href-“index2.html”target=”-blank”>平面设计
动画制作（原窗口，默认为空）
第四篇：个人网站的设计与实现
二○○七届学生毕业论文（设计）
毕业设计(论文)论文题目
个人网站的设计与实现
英文 Personal Webside Design and accomplish 个人网站的设计与实现
摘 要
在互联网走进我们的生活之前，没有人敢梦想拥有自己的报纸、杂志、电台、电视台。除了政策上的制约外，一个人也根本没有操作一份传播媒体的能力。现在不同了，互联网给我们提供了一个“表达自我”的自由天地,你可以拥有自己的新闻邮件，你可以建立自己的个人网站。只要你办得成功也可以吸引成千上万的订户、读者,并建立自己在众多参与者中的权威地位。建立个人网站的基本过程可以分为以下七个环节：
1.了解中国网络个人主页研究背景与发展现状 2.系统需求分析与总体设计
3.熟悉网站开发模式、工具及环境
4.把自己的作品和想要展示的内容制作成网页 5.使用动态网页技术(ASP)，实现动态内容更新 6.认真地选取测试用例，进行交叉测试 7.网站的后期完善、宣传及发展方向
其中 ,网页制作和使用动态网页技术(ASP)实现动态内容更新是网站开发的核心内容。
关键词：网页、制作、访问、链接
Abstract Enters before our life in the Internet, nobody dares to vainly hope for has own newspaper, the magazine, the broadcasting station, the television station.Besides the policy in restriction, a person simply has not also operated dissemination media the ability.Now has been different, Internet has provided to us “the expression” free world,You may have own news mail, you may establish own individual website.So long as you also manage the success to be possible to attract the tens of thousands of subscribers, the reader,And establishes oneself in the multitudinous participant's authoritative status.Establishes individual website the unit process to be possible to divide into following seven links： 1.understands the Chinese network individual main page research background and the development present situation 2.systems demands analysis and system design 3.familiar websites developments pattern, tool and environment 4.and wants own work the content which demonstrated to manufacture the homepage 5.uses dynamic homepages technology(ASP), realization dynamic content renewal 6.earnestly selects measured the test example, carries on the overlapping test 7.websites later periods consummate, the propaganda and the development direction Among them,The homepage manufacture and the use dynamic homepage technology(ASP)realizes the dynamic content renewal is the website development core content.Key word: Homepage, manufacture, visit, link
前 言
随着国际互联网的普及，很多人已经不满足仅仅在Internet上的浏览信息，而是希望更深入的参与其中，拥有自己的Web网站，这似乎已经成为一种潮流。如果说个人建立网站是为了追求时尚，那么企业建立网站就是必然的选择了。
无论是专业的，还是业余的，很多人对网页制作颇感兴趣。事实上制作一个简单的网页并不困难，会使用Word的人都可以胜任。但想做出超凡脱俗的网页就不那么容易了，而Dreamweaver却可以满足你的愿望，它是Macromedia公司开发的集网页制作和网站管理于一身的所见即所得的网页编辑器。
同样出自Macromedia公司的Flash,Fireworks在制作网站的过程中起到了锦上添花的作用，是个人网站实现的好帮手，在制作网站的时候经常会用到这些软件。
目 录
摘要----------------1 前言----------------1 第一章：绪论--3 1.1 我国网络发展现状---------------------3 1.2 个人网站的目的------------------------3 第二章：个人网站的开发环境--------4 2.1 Dreamweaver简述----------------------4 2.2 Dreamweaver的操作环境-------------4 2.3 ASP技术--5 第三章：需求分析--------------------------7 3.1 概述-------7 第四章：网站制作---------------------------9
4.1站点-----------9 4.2首页-----------9 4.3创建其它网页-----------------------------11 3.2个人网站的问题定义与可行性分析-7 3.3 个人网站整体要求----------------------8 第五章：网页链接的建立-----------------12 5.1 链接的概念12 5.2 创立连接---12 5.3文字链接-----15 5.4影像链--------16 5.5 Email链接---18 5.6文件下载链接------------------------------21 5.7在HTML语言中建立网页链接-------22 第六章：总 结--25 致谢------------------26 参考文献----------27
第一章 绪论
1.1 我国网络发展现状
2010年1月15日，中国互联网络信息中心（CNNIC）发布了《第25次中国互联网络发展状况统计报告》（以下简称《报告》）。《报告》数据显示，截至2009年12月，我国网民规模已达3.84亿，互联网普及率进一步提升，达到28.9%。随着我国互联网普及率的逐年提高，互联网正在走进人们的工作与生活。CNNIC《报告》调查显示，在家和单位上网的网民比例在2009年有了明显的提高，有83.2%的网民选择在家上网，另有30.2%的网民选择在单位上网，互联网作为人们日常工具的价值正在日益提升。
1.2 个人网站的目的
个人网站最开始的动机可能是出于兴趣或一种爱好，但时间一长，这些兴趣或爱好便为自己积累了许多资源，比如数量可观的访问量。当这些资源积累到一定程度的时候，商业意识比较敏感的个人网站站长便开始寻求开展电子商务，将自己手中的资源进行商业操作，从而，个人网站开始赚钱。当然，目前比较流行的个人网站赚钱方式可能更多的还是依赖于广告，但从目前个人网站的广告收入来看，它已经陷入了一个低谷。所以，如果个人网站想要得到长足的发展，或者希望自己的
网站能够赚钱，那么必须主动出击！事在人为，作为一个个人网站，我们可以拥有自己的产品，并把它们卖掉，依靠自己来赚钱！
一、个人网站自主经营的可行性 网民正在不断地快速增长。另有调查表明，网民的平均收入水平提高了，也就是说网民的消费水平也提高了。我们个人网站为什么要依靠做广告来赚钱？我们难道不可以转变一下思路吗？打个比方，你的网站日访问量有1000左右(也就是说每天有1000个人左右进入你的“商店”)，做广告相当于代理别人的产品，就算卖出去了也只能返回给你一部分的利润。但是如果你的“商店”卖自己的产品，那么大部分利润就掌握在自己手中。广告赚钱只是做网站的“副产品”，真正的产品是你自己的网站。记住：你的网站是一座金矿，可能你只是开采了“浏览量”这一层矿产，更深层次的矿产你可能还尚未开发出来！你完全可以将你自己网站的产品进行出售，比如将你网站的精品内容印成一本书，然后在网上卖你自己的书。还有更多的经营方法，关键是你要去不断探索！下面我就结合我对互联网的观察与自己的实践经验告诉大家如何经营自己的产品。对于网络经商，起初一定要抱平和的心态！因为中国的网民毕竟不是很多，大家不要过分期望网络经商会给你带来很大的效益。要把网络经商作为一种锻炼，说句现实的话：“现在赚小钱，以后赚大钱”。这是我对
网络经商的一种“长期作战”的战略观点。第二章 个人网站的开发环境
2.1 Dreamweaver简述
Dreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器，它是第一套针对专业网页设计师特别发展的视觉化网页开发工具，利用 它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。
Dreamweaver是在网页设计与制作领域中用户最多、应用最广、功能最强大的软件，随着Dreamweaver 8的发布，更坚定Dreamweaver在该领域的地位。它集网页设计、网站开发和站点管理功能于一身，具有可视化、支持多平台和跨浏览器的特性，是目前网站设计、开发、制作的首选工具。Dreamweaver8.0的特点如下。
1、灵活的编写方式
Dreamweaver具有灵活编写网页的特点，不但将世界一流水平的“设计”和“代码”编辑器合二为一，而且在设计窗口中还精化了源代码，能帮助用户按工作需要定制自己的用户界面。
2、可视化编辑界面
Dreamweaver是一种所见即所得的HTML编辑器，可实现页面元素的插入和生成。或视化编辑环境大量减少了代码的编写，同时亦保证了其专业性和兼容性，并且可以对内部的HTML编辑器和任何第三方的HTML编辑器进行实时的访问。无论用户习惯手工输入HTML源代码还是使用可视化的编辑界面，Dreamweaver都能提供便捷的方式使用户设计网页和管理网站变得更容易。
3、功能更多的CSS支持——CSS可视化设计、CSS检查工具
4、动态跨浏览器验证
当保存时系统自动检查当前文档的跨浏览器有效性，可以指定何种浏览器为测试用浏览器，同时系统自动检验以确定页面有没有目标浏览器不支持的tags或CSS结构。动态跨浏览器有效性检查功能可以自动核对tags和CSS规则是否适应目前的主浏览器。
5、强大的WEB站点管理功能
6、内建的图形编辑引擎
7、Dreamweaver的集成特性
Dreamweaver 8继承了Fireworks、Flash和Shockwave的集成特性，可以在这些Web创作工具之间自由地切换，轻松地创建美观实用的网页。
8、丰富的媒体支持能力
可以方便地加入Java、Flash、Shockwave、ActiveX以及其他媒体。Dreamweaver具有强大的多媒体处理功能，在设计DHTML和CSS方面表现得极为出色，它利用JavaScript和DHTML语言代码轻松地实现网页元素的动作和交互操作。Dreamweaver还提供行为和时间线两种控件来产生交互式响应和进行动画处理。
2.2 Dreamweaver的操作环境
我们将工作界面分成了“标题栏”、“菜单栏”、“快捷工具栏”、“属性面板”、“浮动控制面板”5个部分来分别介绍。
2.2.1 标题栏
Dreamweaver MX的“标题栏”中将显示文字“Macromedia Dreamweaver MX”如果打开网页的话，在后面还会显示该网页的一些信息，如网页标题、所在位置及网页名称，右边有三个钮，分别对应Dreamweaver MX的最大化最小化和关闭的操作。
2.2.2菜单栏
“标题栏”下面就是“菜单栏”，栏中提供了“文件”、“编辑”、“查看”、“插入”、“修改”、“文本”、“站点”、“窗口”、“帮助”10项菜单。单击其中任意一项菜单，随即就会出现一个下拉式指令菜单。有些指令的右边会有键盘的代码，这是该指令的快捷键，熟练使用快捷键将会有助于提高工作效率。有些指令的右边会有一个小黑三角的标记，它代表该指令还包含下一级的指令，鼠标停留片刻即可显示。
2.2.3快捷工具栏
“快捷工具栏”指的是“菜单栏”下边的3排按钮，选择菜单“查看/工具栏”，勾选里面的“插入”、“文档”和“标准”3项，完整的快捷工具栏就显现出来了。
2.2.4属性面板
在网页编辑窗口的下面还有一个面板，它是有名的“属性面板”，它在这个软件中起到举足轻重的作用。
属性面板顾名思义，就是显示，调整属性的面板，根据鼠标所选中对象的不同，“属性面板”在界面上也会有所差异，用户可以分别对不同的对象进行调整。
2.3 ASP技术
Active Server Pages：“动态服务器网页”，一般简称为“ASP”，ASP之所以能受到大家的重视与使用的原因，主要在于所产生的执行结果都是标准的HTML格式，而且这些程序是在网络服务端中执行，使用一般的浏览器（如IE 或Netscape）都可以正确地获得ASP的“执行”结果，并且将这ASP执行的结果直接在浏览器中“浏览”，不像VBScript或 JavaScript是在客户端（Client）的浏览器上执行，若使用VBScript来设计程序，客户端（Client）在ＩＥ浏览器中可以显示程序执行的结果，可是，客户端（Client）若使用Netscape浏览器就无法显示VBScript的执行结果。ASP的特点如下：
1、任何开发工具皆可发展ASP 只要使用一般的文书编辑程序，如Windows记事本，就可以编辑。当然，其他网页发展工具，例如，FrontPage Express、FrontPage等也都可以；不过还是建议你用记事本来写，既省钱又方便，若是使用那些所见即所得的网页编辑来写ＡＳＰ，可能会发生一些意想不到的离奇状态。
通过各家浏览由于ASP程序是在网络服务器端中执行，执行结果所产生的HTML文件适用于不同的浏览器。
2、语言相容性高
ASP与所有的ActiveX Script语言都相容，除了可结合HTML，VBScript、Java script Active X服务器组件来设计外，并可经由plug-In（外挂组件模组）的方式，使用其他厂商（Third Party）所提供的语言。
3、隐密安全性高
如果我们在浏览器中直接查看网页的原始代码，就只能看到ＨＴＭＬ文件，原始的ASP程序代码是看不到的！这是因杰ＡＳＰ程序先于网站服务（Web Server）端执行后，将结果转换成标准HTML文件，再传送到客户端（Client）的浏览器上，因此，我们所辛苦撰写的ASP程序并不会轻易地被看见进而被盗用。
4、易于操控数据库
ASP可以轻易地通过ODBC(Open Database Connectivity)驱动程序连接各种不同的数据库，例如：Access fox pro、dBase、Oracle等等，另外，ＡＳＰ亦可将“文本文件”或是“Excel” 文件当成数据库用。
5、面向对象学习容易
ＡＳＰ具备有面向对象（object-Oriented）功能，学习容易，ＡＳＰ提供了五种方便能力强大的内建对象：Request、Response、Sever、Application以及Session，同时，若使用ＡＳＰ内建的“Application”对象或“Session”对象所撰写出来的ＡＳＰ程序可以在多个网页之间暂时保存必要的信息。
6、ASP的六大内部对象 对象名称 功能描述
Request Response Server Session Application Object Context 从客户端取得信息将信息送给客户端提供一些Web服务器工具储存在一个
Session内的用户信息，该信息仅可被该用户访问在一个 ASP-Application中让不同的客户端共享信息可以用来配合 Microsoft Transaction 服务器进行分布式事务处理 所以我选择了ASP结合Dreamweaver架构个人站点。
第三章 需求分析
3.1 概述
需求分析最根本的任务是确定“为了满足客户的需要，系统必须做什么”。具体的说，应该确定系统必须具有的功能和性能，系统要求的运行环境，并且预测系统发展的前景。必须仔细分析系统中的资料，既要分析系统中的数据流，又要分析长期使用的资料储存。该阶段不是确定系统怎样完成它的工作，而仅仅是确定系统必须完成哪些工作，也就是对目标系统提出完整、准确、清晰、具体的要求。
3.2个人网站的问题定义与可行性分析
一、明确架设网站的目的及客户要求
通常情况下，架设个人网站主要是为了通过互联网表达个人在商业、科技、交际、生活等方面的信息需求或者进行信息的交流，具有较强的目的性，我的个人网站一般体现在：为了展示自己的风采，让大家和我一起分享我的心得与经验，让和我有共同爱好的朋友有一个倾诉的地方。
二、我的个人网站概貌 因为是个人网站，所以只是选择了自己擅长和喜爱的内容，在突出自己的风格和特点的同时，还应用了现在流行的网站设计技术和数据库技术。因此将网站设计分为前台页面展示平台和后台在线管理平台。
三、功能划分
网站设计有新闻更新，浏览者可以在首页浏览自己喜欢的新闻，并且可以在留言板和大家交流，在后台管理页面中，通过身份认证，管理员——我，可以对网站信息进行管理。站内的其它页面均是我自己的精心收藏，与大家一起分享
3.2.1 功能定义
（1）管理员权限：修改所有页面内容、增删改文章、管理评论、修改公告、修改管理员自身信息、编辑各页面栏目、添加删除图片、添加删除音乐、修改版权信息等。
（2）浏览者权限：阅读所有页面内容、添加评论、添加留言、浏览文章、浏览图片、浏览音乐等。3.2.2 可行性分析
系统可行性分析主要从经济可行性、技术可行性和操作可行性三方面去分析。（1）经济可行性分析
从系统的开发和效益关系上讲，采用asp这个可以开发出交互、高性能Web数据库应用的技术进行开发，效率较高。该系统的开发不需要花费太多的经费，只需在域名和服务器空间租用上有开销，因为个人网站不涉及超大容量的文件存储和庞大的访问量，因此对于服务器来讲，要求不会太高，开销不会很大。因此，从经济性分析是可行的。
（2）技术可行性分析
根据现有的技术设备条件，在技术上实现也是可行的。在设备方面，前期系统开发在本地端制作完成，只需通过ftp软件上传至服务器端即可，而软件开发所需条件相对较低，对于系统开发及运行环境均不造成任何困难。对于系统开发人员基本具备了计算机专业知识，有一定的编程基础，熟悉和掌握数据库及网络相关知识，具备开发条件。
（3）操作可行性
该系统操作上非常简单，对于用户来说，只要具备IE浏览器5.5版本以上即可通过域名搜索即可登录本站。
3.3 个人网站整体要求
3.3.1 功能要求
（1）页面风格简洁明快，给人以较好的视觉印象。（2）用户浏览、操作均便捷，迅速。（3）用户权限、功能的设置要准确无误。3.3.2 系统性能要求
在目前硬件设备条件下，要求处理程序的速度相对较快。因此，在程序设计阶段，优化代码，降低处理时间是需要考虑的问题。3.3.3关于未来需求
由于系统开发时间较短，可能不是很完善，在运行过程中还会遇到一些问题，所以应在系统设计过程中对未来可能需要的扩充和修改做好准备，以便及时变更
第四章 网站制作
4.1 站点
4.1.1 创建站点
要制作一个网站，第一步操作都是一样的，就是要创造一个“站点”，这样可以使整个网站的脉络结构清晰地展现在面前，避免了以后再进行纷杂的管理。从菜单中选择“站点/管理站点”在弹出的对话框中选择“新建”，之后再选择其中的“站点”，再次弹出一个对话框，在文本框中输入自己已经企化好的网站名称“追梦人”。填好后，单击“下一步”，进入下一个步骤。由于我要做的是一个静态的网页，所以选择上面的一项“否，我不想使用服务器技术。” 单击“下一步”，进入下一个步骤。
在此选项中有两个选择，选择推荐的“编辑我的计算机上的本地副本，完成后再上传到服务器”。底下的文本框允许在本地磁盘上指定一个文件夹，Dreamweaver将在其中储存站点文件的本地副本。单击该文本框后面的文件夹图标，新建并指定一个空的文件夹“E:/ding”。之后单击“下一步“，进入下一个步骤。
这一步是如何设置连接到远程服务器，弹出式菜单中有6中选择，这里选择“无”。而后“下一步”再“完成”，即可。
4.1.2 创建站点内容
站点创建完成后，就可以创建Web页来填充站点了。在“右侧浮动面板组”中选择“文件/文件”面板，此时整个网站中没有任何内容。用鼠标右击面板中的本地根目录文件夹。在弹出的菜单中选择“新建文件”，新建一个文件后将其命名为“index.htm(或index.html),它就是未来的首页。网站分为“平面设计”、“动画制作”、“网文精品”、“经典回顾”、“个人说明“这五个大栏目，所以继续用鼠标右击右侧，在弹出的菜单中选择第二项“New Folder（新建文件夹）”。执行五次操作，新建五个文件夹，并把它们重命名为graph、anim、books、music、letter，分别对应上面的五个大栏目。存放它们各自的内容。之后再次新建1个文件夹，命名为images,用来存放“所有的图象文件”的内容。
之后在个栏目的文件夹里还要建立想相应的栏目网页。
4.2首页
4.2.1 设置首页布局
首页是打开网站后在浏览器中显示的第一个页面。它是起什么名字通常要视Server端的设置，一般的有index.htm,default.htm或home.htm等，目前主要以index.htm的居多。当然，后缀名为html也是正确的。
具体设置方法是：右健单击“文件”浮动面板中的index.htm,在弹出的菜单中选择“设成首页”。
首页的布局有很多方法，在这里我所用到的是表格的“布局模式”。“布局”模式中的表格称为布局表格，单元格称为布局单元格。在绘制布局表格和布局单元格时，必须从“标准”模式切换到“布局”模式。直接单击“布局”按钮即可。操作步骤：
1、在“插入快捷栏”的“布局”分类中，单击“布局表格”按纽。
2、将变成“+”形状的鼠标光标放到编辑中网页上，在要绘制的地方进行拖动就可以进行创建了。（如果绘制的是第一个表格必须从网页的最左上角开始绘制）。
3、在这里要绘制多个表格，可以再次单击“布局表格”按纽进行绘制，也可以按住Ctrl键绘制多个表格。
4.2.2设置首页的页面属性
首先双击“文件”浮动面板中的index.htm,进入页面的编辑窗口。右健单击空白区域，在菜单中选择“页面属性”，之后弹出“页面属性”对话框，若选择主菜单“修改/页面属性”项，也可以把打开该对话框。
在“页面属性”对话框中，左侧窗口显示“分类”，其中包括了“外观”、“链接”、“标题”、“标题/编码”、“跟踪图像”5项，右侧区域则显示各类中可以设置的项目。4.2.3查看和编辑头内容
一个网页文件结构上实际是由两部分组成，头（head）内容和主体（body）内容主体内容（body）是文档的主要部分，也是包含文本和图像等的可见部分。头内容（head）是除文档标题外的不可见部分，包含有文档类型、语言编码、搜索引擎的关键的关键字和内容指示器以及样式定义等重要信息，这些元器并不是每个页面都需要的，例如，可以仅为主页提供关键字。
下面就以首页为例，说明怎样插入较常用的头（head）内容。
单击“菜单拦”下面“插入快捷”的下拉列表，选择其中的HTML类，此时右侧将会显示该类中可以插入的对象快捷按钮，再次单击第2个按钮“文件头”旁边的下拉箭头，会弹出菜单，该项列出的便是即将插入的头内容。4.2.4 插入图像
图像是网页中不可或缺的组成成份，恰当地使用图像，可以使网站充满生活生命力与说服力，吸引更多的浏览者，加深他们欣赏你网站的意愿。
另一方面，网页的容量大小是网站成功与否的一大关键因素。由于网络在传输上的限制，导致了下载的速度不可能太快，因此，网页的大小就不能太大，其中关键就在于图像的大小了，否则浏览者会失去等待的耐心，无论你的网站多么精彩也无济于事了。
所以，在网面容量大小的问题上一定要重视。下面就来详细介绍对网页图像进行处理的操作步骤，以使得它们在保持图形美丽与网站风格搭配的基础上，图片文件能够变的更小。
1、首先将光标停留在要插入图像的位置，然后单击“菜单栏”下面“插入快健栏”的下拉表，选择其中的“常用”类，则右侧将会显示该类中可以插入的对象快键按钮。左起第5个即为“图像：图像”按钮，单击它右侧的下拉列表，选择第1项“图像”。
2、随即弹出“选择图像源文件”对话框。从计算机磁盘中选择想要插入的图像文件，或在URL编辑框中输入图像的路径和名称。下面的“相对于”下拉表框中，可选择文件URL地址的类型，如果选择“文档”选项，表示图像地址相对于当前文档；如果选择“站点根目录”选项，表示地址相对于根目录。在这里我要插入的是网站标志logo，插入logo图象。
最后单击“确定”按钮，即可完成插入图像的操作。
4.2.5 插入多媒体
在Dreamweaver中，除了之前讲到的可以插入“图像”外，还可插入动画、声音、视频等媒体元素，如Flash,Shockwave,Applets,ActieX及格Midi声音文件等，并且还可以在Dreamweaver自身内插入Macromedia Flash按钮和文本对象，以及进行相关的后期处理和添加设计备注等操作。
在Dreamweaver MX 2004文档中，可以插入媒体文件包括Flash Shockwave影片、QuickTime、AVI java、applet Active X控件以及各种格式的音频文件。
要在浏览器中播放放Flash 动画，必须在浏览器中集成“Flash 播放器（Flash Player）”。其中，Internet Explorer通过ActiveX控制来实现，Netscape Navigator则是通过相应的插件来实现的。在最新的Netscape Navigator和Internet Explorer浏览器中，均已集成了 Flash动
3、画播放功能。操场作步骤：
步骤1 将光标停留在要插入Flash的位置，然后单击菜单栏下面“插入快捷栏”的下拉列表，选择其中的“常用”分类，右侧将会显示该类中可以插入的对象快捷按钮。左起第6个即为“媒体”按钮，单击它右侧的下拉列表，选择第1项Flash图标。
步骤2 在弹出的对话框中选择扩展名为swf 的Flash文件，即可将其插入到Dreamwe
aver的“网页编辑窗口”中，可以看到，在这个窗口中Flash文件的大小。在这里我的主页插入的一个动画。4.2.6插入文本
在网页中，文本内容也可以说是重要的组成部分，一个网站成功与否，它是最关键的因素。在这最关键的因素。可丰富网站的文字内容，并以最最美观、最整齐的方式放入到网页中。
插入文本的两种方式
一种是在网页编辑窗口中直接用键盘敲入文本。这可以算是最基本的输入方式了，和一些文本编辑软件（如Microsoft Word）的使用方法一样，选择好习惯的输入法，就可以运指如飞了。
另一种是复制文本的方式。有些读者可能不喜欢使用Dreamweaver来进行打字的工作，而更习惯在专门的文本编辑软件中快速打字，如Microsoft Word和 Windows自带的记事本等，又或者读者已经准备好了要放入网页的文本的电子版本，那么我们就可以直接使用Dreamweaver的文本复制功能，将大段的文本内容拷贝到网页的编辑窗口来进行排版的工作，具体步骤如下。
打开文本编辑软件（如Microsoft Word），选中要复制的文本，它们将反白显示，执行菜单“编辑/复制”命令或直接用快捷键Ctrl+C，之后切换回Dreamweaver,将光标停留在插入文本的位置，执行主菜单“编辑/粘贴”命令或直接使用快捷键Ctrl+v,即可将大段的文本快速粘贴到网页中。
这在我的“网文精品”中用到很多，全部是在word软件中排好ctrl+c,然后点击要粘贴的位置，crtl+v到Dreamweaver即可。
4.3创建其它网页
还有其它的几个网站与主页的制作相同，一个网页是图象和文字的组合。
“平面设计”中的图象插入和前面的介绍相似，并可以在属性拦中调节图象的大小。在Dreamwerver中常常会用到Firework、Flash，它们是相辅相成，在主页中的主体部分就是用Firework 在“个人说明”中也用到这点，首先定好需要尺寸，在属性中设好背景，颜色等等，插入图象，输入文字，也word里的操作雷同。
第五章 网页链接的建立
5.1 链接的概念
链接（或称超链接）是网页与网页之间一种单向的连接关系。也是www.xiexiebang.com如图所示
（3）即对所选文本或图像建立完链接。
5.6文件下载链接
“文件下载链接”的原理很简单，只要链接文件属于浏览无法识别的关型，便都会使用IE浏览器直接进行下载，并保存到本地计算机中。
浏览器无法识别的文件类型有很多，这里就介绍一个最常用的，以zip或rar为后缀名的压缩格式文件，这种文件可以使用主流的压缩软件（如winzip、winrar）来制作。下面我们就业以实例来说明。
在前面“插入多媒体”一章中，我们曾经讲过直接链接文件的方式来插入“视频”，即直接在“链接”文本框中输入“文件名+名后缀名”，如olympus.wmv。单日击这个链接，经过数据下载后，Windows系统将启动自带的媒体播放器Windows Media Player 来播放该视频。操作步骤
步骤1 先将视频文件olympus.wmv通压缩成olympus.rar文件，放入站点的media文件夹下。
步骤2 将文件路径输入至“链接”文本框中。
步骤3 保存网页，按下F12预览，在浏览器中单击“下载精彩广告视频”链接文本，会弹出“文本下载”选择框，单击其中的“保存”按钮。
步骤4 在“另存为”对框中选择保存到本地计算机中的位置，实例中为“经典回顾”文 件夹。之后单击“保存”按钮，压缩文件即保存到该位置中。至此，“文件下载链接”便制作完成了。读者可以打开“我的文档”文件夹，解压缩olympus.rar文件，随时欣赏下载影片。
本设计中未用到此链接，在此只作简单介绍。
5.7在HTML语言中建立网页链接
5.7.1文字链接
在HTML语言中用超链接标记指向一个目标。其基本格式为： 举个简单的“文本链接”的实例，该实例相对应的HTML代码如下所示。 a href-“index2.html”target=”-blank”>平面设计
动画制作（原窗口，默认为空）
第五篇：个人网站设计及实现毕业设计论文
个人网站设计及实现
第一章 文献综述
互联网是社会发展的必然趋势，很多人已经意识到网络的强大生命力和它在未来将处于的重要地位。他们钻研并且努力进入到这一个新的空间，新的领域。以个人为中心，淡化了传统中心地位，使得我们的世界向多元化加速发展，人人都有话语权，人人都是中心。
互联网是一个互动性极强的平台，它自由、宽容、平等、共享，并使来自民间的声音参与到了构建主流话语的行动中来。计算机技术的发展，特别是网络技术的飞速发展，给文档的保存和管理提供极大的方便[1]。本论文中，将软件工程的基本原理和方法应用到整个网站系统，并对其进行需求分析，提出了解决问题的具体方法。在具体制作中，用ASP技术来实现B/S系统，ASP技术与数据库技术结合，用户在浏览器端可以随意查询自己需要的标本，这样提高了网页的互动性，使整个系统能更好的为用户服务。
Internet飞速发展使得网站不再仅仅为企业或公司等大型结构所拥有，互联网成为人们快速获取、发布和传递信息的重要渠道，它在人们政治、经济、生活等各个方面发挥着重要的作用。因此网站建设在Internet应用上的地位显而易见，一个家庭甚至个人都可以拥有属于自己的网站，而在这其中，个人网站已经日渐普及，而且发展到今天，创建一个能充分体现自我风格和特色的个人网站已经成为互联网用户的新追求。
1.1 课题研究现状分析
伴随着社会的发展和科学的进步，上网成为越来越多人们的选择。随着互联网的飞速发展，有关网络的技术也层出不穷。如今互联网上的个人网站如雨后春笋般蓬勃发展，绚丽多彩的主页比比皆是。每个人都有发挥个人才能，挥洒自己个性的网上伊甸园。在hao123神话以后，网站大全类网站又再一次达到顶峰。然而这个模式拷贝成功的网站却寥寥无几。而对于技术薄弱的个人网站来说，似乎网址类网站应该是一个很好的切入点。但是由于搜索的异军突起，网址类网站似乎变得可有可无。
第 1 页（共 9 页）
[2]
网页实际是一个文件，他存放在世界某个角落的某一台计算机中而这台计算机必须是与互联网相连的。网页经由网址（URL）来识别与存取，当我们在浏览器输入网址后，经过一段复杂而又快速的程序，网页文件会被传送到你的计算机，然后再通过浏览器解释网页的内容，再展示到你的眼前。文字与图片是构成一个网页的两个最基本的元素。可以简单的理解为：文字，就是网页的内容，图片，就是网页的美观。除此之外，网页的元素还包括动画、音乐、程序等等。网页实际上只是一个纯文本文件，它通过各式各样的标记对页面上的文字、图片、表格、声音等元素进行描述（例如字体、颜色、大小），而浏缆器则对这些标记进行解释并生成页面。1.2 个人网站的研究工作 1．理论研究基础
个人网站是由个别提供的一套集博客、文章、相册、日程、通讯录、链接、调查、留言板等诸多功能于一体的网络平台。个人网站的自由、开放精神，并使之更容易操作，更具个性需求，而不需要高深的技术。它可以帮助个人进行全面的信息化，以多种形式达到对信息获取、组织、思考、表达、共享和交流的目的。以个人为中心，建立一个完全属于自己的可定制的个性化网络平台。来自文章的评论，留言板都可以很好的进行交流，倾听别人的声音。2．技术层面的支持
随着互联网的进一步发展与成熟，网络的带宽进一步加阔，网络应用也越来越广泛。网页制作更是日新月异，层出不穷。涌现了很多琳琅满目的网站，使得整个互联网多姿多彩。
在进行动态网页制作的时候，通常都是使用ASP来完成。由于ASP使用方便，操作简单，很多网页设计者一直使用ASP。ASP集成在HTML和脚本语言中，其工作界面简单，因此，ASP相对于其他网页制作软件来说，易学易用，是网页制作初学者的入门软件。同时配合数据库的操作，使个人网站具有更好的网络平台和交互性。1.3 已经取得的研究成果
中国互联网在近几年发展迅猛。一方面，产生了一批依赖技术领先的互联网公司，取得了成功；另一方面，互联网技术逐渐走向普及，使得行业进入门槛正在降低[4]。目前中国网站总数已经近百万。在这里面出现了大量的个人网站。并且个人网站存在着巨
第 2 页（共 9 页）
[3]
大的商业价值。如果能以强大的号召力，把互补的个人网站联合起来，不知道可以成立多少个门户网站。我们有理由相信，个人网站还极具潜力。1.4选题的目的及意义
随着Internet的迅速普及，我们已经不再满足于仅仅浏览网页，而是希望更深入地参预到网络中去，Internet的开放性使个人建立自己的网站成为可能，拥有自己的网站也越来越成为一种时尚，同时创建一个能充分体现自我风格和特色的个人网站已经成为互联网用户的新追求。
我们更需要交流，相信交流能够促进我们不断的进步，并融合别人的长处；让我们多一些渠道倾听来自不同立场的声音；设想我们的网络，当每个人都拥有个人网页，不管是否在线，我们都可以跨越时间、空间进行交流，因为这个网页中拥有我所有的一切，生活，见解，知识，思想；理想的状态是个人门户就是每个人的影子，他为每个人打点网络上的一切，很多志同道合的朋友会在这里和你相识相知。1.5 课题研究的主要内容
互联网是社会发展的必然趋势，很多人已经意识到网络的强大生命力和它在未来将处于的重要地位。他们钻研并且努力进入到这一个新的空间，新的领域。其中包括你和我。
在我们的工作、日常生活中，能够拥有一个自己的网站，一个已经成为不少人的希望和骄傲。就这个课题的研究，因为是个人网站，所以我只是选择了自己擅长和喜爱的内容，在突出自己的风格和特点的同时，还应用了现在流行的网站设计技术和数据库技术。[5]
第二章 设计部分
“个人网站要发展，要么是从我的需求出发，要么是从我周围人的需求出发。”国内著名个人网站站长、手机之家站长高春辉说。网页设计是一门新兴的设计类和网络的交叉学科，近几年随着网络的发展而逐渐收到人们的重视，它本身以网络为载体,把各种信息以最快捷、方便的方式传达给大众。一个网站项目的确立是建立在各种各样的需求上面的，这是个人网站，所以这种需求往往来自于个人的实际需求，其中每个人的实
第 3 页（共 9 页）
际需求占了绝大部分[6]。因此如何更好地的了解、分析、明确需求，并且能够准确、清晰以文档的形式表达出来，保证开发过程按照个人需求为目的正确项目开发方向进行。2.1设计的愿望
在Internet飞速发展的今天，互联网成为人们快速获取、发布和传递信息的重要渠道，它在人们政治、经济、生活等各个方面发挥着重要的作用。因此网站建设在Internet应用上的地位显而易见，它已成为个人、政府、企事业单位信息化建设中的重要组成部分，从而倍受人们的重视[7]。
越来越多的人希望能真正参预到互联网上，这就出现了越来越多的个人网站的设计以及推广的工作和任务。
就我个人而言，之所以在毕业设计的时候选择这个课题是因为我也想拥有自己的个人网站，在互联网上拥有自己的一席之地，从而真正的参与到网络中去，做网络新时代的主人，同时也希望自己喜欢和收藏的一些东西能够和网络一起分享，和互联网上的你一起分享。
我所制作的个人网站大体可分为以下几个功能： 1．搜索引擎：
根据浏览者的要求，使用主页上的搜索引擎链接到百度，在整个Internet上进行搜索，完成信息的优化与提取。2．论坛：
主要功能是网友和网站之间的交流平台，也是网友给版主提出意见的主要渠道。在论坛中用户可以发表意见，这些意见可以让所有人看到，也可以只让版主看到，版主和其他人可以针对留言的内容进行回复，只留给版主的留言只有版主能够回复，并且版主可以登录后台对留言进行管理，是否发表或删除。3．发送电子邮件：
网友可以通过“联系我”利用outlook 向版主或其他人发送电子邮件。4．精品收藏：
在其中展示我喜爱的东西，包括电影、歌曲和一些优美的文章。奇文共欣赏，疑义相与析。我只想起到抛砖引玉的作用，让大家从中认识我和了解我，让一些美好的东西我们大家共同来欣赏。但我增加了管理权限，我以管理员的身份可以对加入的新内容进
第 4 页（共 9 页）
行管理，即允许加入和对其进行删除。5．留言板：
是一个我与大家谈心交流的地方，在留言板中，我们可以畅所欲言，和大家进行交流。就我们感兴趣的话题展开讨论。和大家进行沟通。
2.2设计介绍
这次我所设计的课题正是互联网与个人生活之间的紧密联系的体现，个人的宣传网站，包括个人简介、论坛、个人照片、个人专题等。在突出自己的风格和特点的同时，还应用了现在流行的网站设计技术和数据库技术。
2.3设计的背景 2.3.1用户特征
用户人群：具有基本的计算机操作能力，熟知网络并能够在Internet遨游。2.3.2运行环境
软件平台需要服务器上的操作系统为microsoft windows xp server。因为ASP的开发平台首选是Windows NT Server(Windows 2000 Server)上的IIS，然后是Windows NT Workstation(Windows 2000 Profession)或Windows95/98的Personal Web，同样现在的浏览器是微软一家独大，使用的浏览器是微软的explorer，网站的数据库使用了同样是microsoft的office access数据库，因为一个数据不是很庞大的个人网站没有必要使用oracle等大型数据库系统，同时access数据库结构比较的简单，使用起来比较简单好用。
2.4 达到的预期成果
在明确了我的个人网站的风格和定位后，就是网站的材料组织以及网站的页面设计和数据库设计。网站最后完成发不到网上后，能够充分吸引浏览者的目光，利用搜索引擎，浏览者可以在网站内搜索自己喜欢的资料，并且可以在留言板和大家交流，在后台管理页面中，通过身份认证，管理员可以对网站信息进行管理。站内的其它页面均是我自己的精心收藏，与大家一起分享。
第 5 页（共 9 页）
2.5使用工具的简要介绍 2.5.1 IIS的简要介绍
IIS是Internet Information Server的缩写，它是微软公司主推的Web服务器，最新的版本是Windows2000里面包含的IIS 5.0，IIS与WindowNT Server完全集成在一起，因而用户能够利用Windows NT Server和NTFS（NT File System，NT的文件系统）内置的安全特性，建立强大、灵活而安全的Internet和Intranet站点。IIS的一个重要特性是支持ASP[9]。IIS 3.0版本以后引入了ASP，可以很容易的张贴动态内容和开发基于Web的应用程序。2.5.2 数据库Access的简要介绍
Access数据库是集成在Microsoft公司开发的产品更新换代Office系统中的集成软件[10]。
Access是一个数据库管理系统，它之所以被集成到Office中而不是Visual Studio中，是因为它与其它的数据库管理系统（如Visual FoxPro）相比更加简单易学，一个普通的计算机用户即可掌握并使用它。而且最重要的一点是，Access的功能足够强大，足以应付一般的数据管理及处理需要。
ODBC（Open Database Connectivity开放式数据库互联）是微软推出的一种工业标准，一种开放的独立于厂商的API应用程序接口，可以跨平台访问各种个人计算机、小型机以及主机系统[11]。ODBC作为一个工业标准，绝大多数数据库厂商、大多数应用软件和工具软件厂商都为自己的产品提供了ODBC接口或提供了ODBC支持，这其中就包括常用的SQL SERVER、ORACAL、INFORMIX等，当然也包括了Access。2.5.3 对ASP的简要介绍
Active Server Pages（ASP）是服务器端脚本编写环境，使用它可以创建和运行动态、交互的 Web 服务器应用程序。使用 ASP 可以组合 HTML页、VBScript脚本命令和JavaScript脚本命令等，以创建交互的 Web 页和基于 Web 的功能强大的应用程序[14]。
由于脚本程序是在服务器上而不是在客户端运行，传送到浏览器上的 Web 页是在 Web 服务器上生成的。所以不必担心浏览器能否处理脚本：Web 服务器已经完成了所有
第 6 页（共 9 页）
脚本的处理，并将标准的 HTML 页面传输到浏览器。由于只有脚本的结果返回到浏览器，所以服务器端脚本不易被别人复制。用户看不到创建他们正在浏览的页的脚本命令。2.6 任务概述
随着计算机的普及和网络技术的迅速发展，人们也越来越依赖于计算机和网络。因此，网络安全应该也必须引起注意。网络安全是一门涉及计算机、网络、通讯、密码、信息安全、应用数学、数论、信息论等多种学科的综合性学科，涉及面极广，而且不断更新和发展。国家对信息产业的扶持，使国内的网络状况逐渐好转，更多的服务器的开通，更快的宽带网得逐渐普及，各种各样的攻击行为在网上也越来越频繁化和简单化。
微软在推出 ASP 时提到的 ASP 的一个好处是：Active Server Pages 的源程序，不会被传到客户浏览器，因而可以避免所写的源程序被他人剽窃，也提高了程序的安全性。然而，由于 NT、IIS 以及 ASP 系统本身存在的一些漏洞，却可能使 ASP 源码暴露无遗，解决方法就是及时更新补丁。
该个人网站系统是基于Internet/Intranet 及Web技术，建立以Browser/Server 为结构模式、以数据库为后台核心应用、以服务为目的信息平台，对资源进行科学的加工整序和管理维护，为用户提供个人信息保障和直接参预到互联网上而设计的系统。包括界面设计,代码设计,这一阶段偏重于网页制作工具和技巧的应用, 编写总系统总体功能分析及架构图。
2.6.1 个人简介版块
本模块是个人简介部分，每个个人网站都会有作者介绍。在这个模块访客会了解到作者的一些基本信息,此版块采用了静态网页设计，最大的亮点就是利用了一个图片特效产生的效果，图片以溶解的方式渐渐出现.2.6.2 我的论坛版块
在个人网站建设中，BBS论坛也是其中最主要的一个子系统。BBS论坛的主要功能就是讨论问题，论坛采用了B/S模式，提供了发表评论，回复评论和管理员对评论进行管理等功能。
第 7 页（共 9 页）
2.6.3 个人专题版块
在这个版块我设计和两部分内容包括文学欣赏和快乐音乐。文学欣赏里收集了一些精美文章，快乐音乐里收集了一些好听的mp3歌曲。2.6.4 我的相册版块
个人网站中又一亮点就是个人相册的设置，在我的相册里，放置了我自己的照片、班级照片和校园照片。2.6.5 网站说明版块
此版块是我根据自己的网站结构对整个网站以及每个版块所做的网站结构和功能的说明，以及网站和作者版权说明。2.6.6 给我留言版块
留言板是目前最为流行的网络应用之一，使用留言板，可以为留言者提供发言的机会，让他们能够及时、准确地交换自己的观点。2.6.7 链接百度版块
在网站的首页上我设置了链接百度的搜索引擎，如果访客有内容要查询，可以直接在此引擎内搜索，可直接链接到百度查找内容。
第三章 总结
在本次设计的全过程中，我对四年所学的知识有了一个比较系统的认识和理解。涉及了各方面的知识，大大扩展了我的知识面，同时是我学会了如何使用所学的知识去解决一些实际的问题。
在设计中我深知自己掌握的知识还远远不够，掌握的一些理论知识应用到实践中去，总会出现这样或那样的问题，不是理论没有掌握好，而是光知道书本上的知识是远远不够的，一定要把理论知识和实践结合起来。把学到的知识应用到时间中去，多做多
第 8 页（共 9 页）
练，才可以把理论的精华发挥出来。知识不是知道，了解就好，一定要去应用它，发展它，让它在现实生活中得到充分的应用，从而解决一些问题，这才是学习的根本目的。而且知识又不是单一的，它是互相联系的，学科与学科之间都有着内在的联系。计算机是一门非常复杂且庞大的学科，一项课题往往需要多项技术才可以完成的。在设计阶段，通过对课题的深入分析与研究，迫使我对技术有了一定的了解。在遇到问题时，得到了指导老师与同学的悉心帮助，使我感受到集体的力量是无穷的。
通过这次设计，我学会了和别人配合工作，因为一个人所学的知识不可能面面俱到的，只有通过合作，发挥自己的优点，体现团队精神，才能使工作做得更为出色。通过这次设计，我学到了许多书本上学不到的知识，增强了自己的动手能力。即将毕业我十分珍惜这次锻炼的机会，我按部就班的完成了自己的设计任务，但由于自己的知识水平有限，仍然存在很多的不足之处，恳请老师多多指教！当今的社会是竞争的社会，而人才的竞争则是竞争的焦点，毕业设计对于我们即将离校的同学来说，是离校前很好的一次锻炼，使我们各方面的能力都有了很大的提高，为我们踏出校门，走上社会增强了能力与自信！
计算机技术的高速发展，使我深深地认识到只有不断的加强学习，才能在计算机技术方面不至于被淘汰，今后，我还要加强学习，努力使自己成为一位专业的计算机人员，为我自己所从事的工作服务。
第 9 页（共 9 页）
点击咨询 