2023年11月23日发(作者：)
毕业设计
论文题目：个人网站的设计与实现
学生姓名：
学 号：
指导教师：
专 业：计算机网络技术
年 级：级计网1班 2009
系 部：电子与信息工程系
【摘要】
本文主要从个人网站的数据库的设计方面入手，实现个人网站系统后台管理员
登录、论坛发言、论坛回复、登录与验证四个方面设计，也设计网站的主页、站点建设界面
设计方面研究，并探讨了运用数据库技术，基于ASP利用ADO访问数据库进行数字化个人
网站的设计与实现，针对要实现这些方面的技术，本文将逐一简单介绍其设计思想和设计方
法。对于个人网站的设计及实现我们分为了三个板块制作。该论文主要由我制作讲述了个人
网站的主页、日志、相册三个页面的设计与实现，（音乐、视频由黄汉同学制作，数据库、留
言板由宋罗同学负责制作）
【Summary】This article mainly from the website database design aspects, the
realization of personal website system backstage administrator login, forum, forum
replies, login and authentication design in four aspects, also designed the website
interface design, site construction research, and explores the use of database
technology, based on the ASP using ADO to access the database of digital personal
website design and implementation, to achieve these aspects of technology, this
article will be discussed briefly introduce the design idea and method. Design and
implementation of personal website for us to three plate production. The thesis is
mainly produced by me about personal website, log, album three page design and
implementation, ( music, video by Huang Han students, databases, message board by
Song Luo students in charge of production)
【关键词】
网站 开发 信息 数据库；
【Key words】 Web development information database
目 录
第一章 概述 …………………………………………………………………………………1
1.1 Dreamweaver8.0技术 ………………………………………………………………1
1.2 Access简介 …………………………………………………………………………1
第二章 网站功能需求 ………………………………………………………………………1
2.1 业务需求 ………………………………………………………………………………1
2.2 网站功能 ………………………………………………………………………………1
2.3 网站布局 ………………………………………………………………………………2
第三章 网站的建设 …………………………………………………………………………2
3.1 站点的创建 ……………………………………………………………………………2
3.2 网站的详细设计 ………………………………………………………………………2
3.2.1 数据库的设计…………………………………………………………………………3
3.2.2网站登录与验证的设计………………………………………………………………4
3.2.3 后台与网站的链接……………………………………………………………………4
3.3 界面设计…………………………………………………………………………………5
3.3.1 主页界面 ……………………………………………………………………………5
3.3.2 后台管理员登录 ……………………………………………………………………6
3.3.3论坛发言………………………………………………………………………………6
3.3.4论坛回复………………………………………………………………………………8
第四章 网站测试 ………………………………………………………………………………10
总结 ………………………………………………………………………………………………11
参考文献 …………………………………………………………………………………………11
四川警安职业学院毕业设计
引言
现代社会是一个信息化的社会，人们对信息的需求越来越大，对信息的传递速度要求越
来越快，在Internet飞速发展的今天,互联网成为人们快速获取、发布和传递信息的重要渠道,
它及时.迅捷的给人们提供了所需要的信息，各种网站便是这信息传播的枢纽，大量的信息，
大批量的访客对网站的管理都是一种挑战，而实现这一管理的就是数据库的操作，由此可见
数据库的完善与否直接影响着网站的稳定性。
随着科技的进步，时代的发展，计算机信息行业的逐步壮大，人们也越来越离不开各种
各样的信息了，人们对信息的追求也越来越迫切了。互联网作为信息技术的通信桥梁连接着
全球的计算机，而网站作为网络信息主要的表现形式而且还是互联网信息的主要承载者，在
Internet上表现出其及其重要的地位，并发挥着其及其重要的作用。Internet的日益兴起和
以网页为载体的网络信息的广泛传播和应用，使得网站的建设及网页制作得到发展的空间，
大至大型企业的产品推销、售后服务、解决方案，小至个人Web页面开发，形形色色，五彩
缤纷，网站建设和网页制作也成为计算机网络领域最热门的话题。
网站数据库的规划设计以及网站的页面开发，都是对应网站所要实现的功能而进行开发
设计的，我将通过各种网页制作以及数据库设计工具制作出能达预期效果的数据管理系统以
及网站页面，使网站管理人员更加快捷的，准确的对网站做出正确的维护和更新；使美观网
站成为我们与外界沟通和交流的平台，让更多的人了解自己，在以后的社会竞争中能起到自
我推荐的作用。
四川警安职业学院毕业设计
第一章 概述
1.1 Dreamweaver8.0技术
Dreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即
所得网页编辑器，它是第一套针对专业网页设计师特别发展的视觉化网页开发工具，利用它
可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。
Dreamweaver具有最佳的制作效率、操作直观、简单易学、站点管理方便、无可比拟的控
制能力等优势，但他同样存在着难以精确达到与浏览器完全一致的显示效果、页面原始代码
难以控制等缺陷。
1.2 Access简介
Access 是微软公司推出的基于Windows的桌面关系数据库管理系统（RDBMS，即
Relational Database Management System），是Office系列应用软件之一。它提供了表、查询、
窗体、报表、页、宏、模块7种用来建立数据库系统的对象；提供了多种向导、生成器、模
板，把数据存储、数据查询、界面设计、报表生成等操作规范化；为建立功能完善的数据库
管理系统提供了方便，也使得普通用户不必编写代码，就可以完成大部分数据管理的任务。
Access能够存取 Access/Jet、Microsoft SQL Server、Oracle，或者任何 ODBC 兼容数据库内
的资料。
第二章 网站功能需求
2.1 业务需求
“个人网站要发展，要么是从我的需求出发，要么是从我周围人的需求出发。”国内著
名个人网站站长、手机之家站长高春辉说。网页设计是一门新兴的设计类和网络的交叉学科，
近几年随着网络的发展而逐渐收到人们的重视，它本身以网络为载体,把各种信息以最快捷、
方便的方式传达给大众。一个网站项目的确立是建立在各种各样的需求上面的，这是个人网
站，所以这种需求往往来自于个人的实际需求，其中每个人的实际需求占了绝大部分。因此
如何更好地的了解、分析、明确需求，并且能够准确、清晰以文档的形式表达出来，保证开
发过程按照个人需求为目的正确项目开发方向进行
2.2 网站功能
我的个人空间网站主要包括以下模块：首页、个人日志、生活相册、个人简历、给我留
言、后台管理。
首页：包含个人网站内的所有项目
第 - 1 - 页 共 12 页
[6]
四川警安职业学院毕业设计
个人日志：日志是一个记录个人日记和精品收藏文章的地方，供给大家一起分享。
生活相册：包括个人歌朋友的生活照片
个人简历：对个人信息的简介以及兴趣爱好的展现，同时可以直接链接到一些个人兴趣有
关的界面。
给我留言：是一个我与大家谈心交流的地方，在留言板中，我们可以畅所欲言，和大家进
行交流。就我们感兴趣的话题展开讨论。和大家进行沟通。
后台管理：是整个网站管理员操作的，它记录着所有在网站登录过、发表留言和上传图片
的信息。
2.3 网站布局
不本网站的布局的设计为上方和左右方的嵌套布局，上方为网站标题和导航栏，左嵌套为
我的照片，右嵌套为日志浏览，下方为友情链接。网站颜色主要采用
background-color:#5F564D;
color:#777c7c;
font-family: "宋体", verdana, arial, helvetica;
第三章 网站建设
3.1 站点的建设
创建本地站点的具体操作步骤如下：
要制作一个网站，第一步操作都是一样的，就是要创造一个“站点”，这样可以使整个网
站的脉络结构清晰地展现在面前，避免了以后再进行纷杂的管理。 从菜单中选择“站点/管
理站点”在弹出的对话框中选择“新建”，之后再选择其中的“站点”，再次弹出一个对话
框，在文本框中输入自己已经企化好的网站名称“我的网站”。填好后，单击“下一步”，
进入下一个步骤。由于我要做的是一个静态的网页，所以选择上面的一项“否，我不想使用
服务器技术。”单击“下一步”，进入下一个步骤。 在此选项中有两个选择，选择推荐的“编
辑我的计算机上的本地副本，完成后再上传到服务器”。底下的文本框允许在本地磁盘上指
定一个文件夹，Dreamweaver将在其中储存站点文件的本地副本。单击该文本框后面的文件夹
图标，新建并指定一个空的文件夹“E:/ding”。之后单击“下一步“，进入下一个步骤。这
一步是如何设置连接到远程服务器，弹出式菜单中有6中选择，这里选择“无”。而后“下
一步”再“完成”，即可。
3.2 网站详细设计
3.2.1数据库的设计
第 - 2 - 页 共 12页
四川警安职业学院毕业设计
我的个人网站采用的数据库是Access，有,,三个数据库文件。
的users表文件为用户登录与注册。的picture为我的相册的数据表文件。
的forum和bbs是实现我的论坛的表文件。
以下就的各个数据库表文件的详细介绍：
users表:username(用户登录与注册名)、password(用户与注册登录的密码)、realname（用
户注册所填写的真实姓名）、sex(用户注册的性别)、address(用户注册的通讯地址)、postalcode(用
户注册的邮政编码)、tel(用户注册电话)、mobiletel(用户注册手机)、email(用户注册电子邮箱)、
web(用户注册个人主页)、intro(用户注册个人简介)。Picture表：title(网页所显示的图片名字)、
flilename(图片的名字)。Froum表：froum_id（为论的栏目id编号）、title（论坛的论题）body(论
坛发表的内容)，hits(用户点击的次数)、ip(用户的ip 地址)、user_id(用户发表贴子的用户名)、
user_email（为用户发表贴子的电子邮件名）、submit_date（用户发表文章提交的期）、frist_id(用
户发布贴子的主题目)、father_id(用户发布贴子的子题目)、froumnme（论坛的栏目）、
froumcout(统集用户对某一栏目发布贴子的数目)
3.2.2 网站登录与验证的设计
（1）数据库连接
本网站的数据库软件使用的Microsoft Access数据库，利用该软件建立了存储用户信息
的注册表users，然后登陆是可以从此表中查询信息与使用者的录入信息相比对，通过比对的
结果判断是否能够进入我网站的主页。其次是用另一个表MESS来存储用户的留言信息。
（2）注册验证与登录
如果用户未输入用户名与密码而想登录而单击了用户登录界面的确定按钮，就会弹出“用
户名不能为空！”消息是用以下代码现实的。
第 - 4 - 页 共 12页
四川警安职业学院毕业设计
3.2.3 后台与网站的链接
我把动态相关信息全部储存在数据库中, 要想在网页中显示数据库中的相关动态内
容必须先对数据库进行链接与打开，要想链接数据库必须使用前文所提到的ADO接口提供的
基本对象中的Connection对象；而要想打开数据库则必须使用ADO接口提供的基本对象中的
Recordset对象；所以，我采用了调用odbc_文件的方法进行连接，将打开与链
接的代码写入了文件中，其方法如下：
以下为数据库连接代码：
<%
'该文件就是用于连接数据库，它一般被包含在其它文件中。当执行时，就相当于写在包
含文件中。
dim db
set db=object("TION")
"DRIVER={Microsoft Access Driver (*.mdb)};DBQ=" &
h("")
%>
3.3 界面设计
3.3.1 主页界面
每个网站都会有一个首页，就功能上而言，它代表着一个网站的风格与特色，
就网站架构上而言，它代表了网站的第一层架构，至于网站上其他Web页，原则
上都必须通过首页来连接散播出去，可见首页是多么的重要。首页是打开网站后
在浏览器中显示的第一个页面。它是起什么名字通常要视Server端的设置，一般
的有,或等，目前主要以的居多。当
然，后缀名为html也是正确的。具体设置方法是：右健单击“文件”浮动面板中
的,在弹出的菜单中选择“设成首页”。
首页的布局有很多方法，在这里我所用到的是表格的“布局模式”。“布局”模
式中的表格称为布局表格，单元格称为布局单元格。在绘制布局表格和布局单元
格时，必须从“标准”模式切换到“布局”模式。直接单击“布局”按钮即可。
操作步骤：
1、在“插入快捷栏”的“布局”分类中，单击“布局表格”按纽。
2、将变成“+”形状的鼠标光标放到编辑中网页上，在要绘制的地方进行拖动就可以进行创
第 - 5 - 页 共 12页
四川警安职业学院毕业设计
建了。（如果绘制的是第一个表格必须从网页的最左上角开始绘制）。3、在这里要绘制多个
表格，可以再次单击“布局表格”按纽进行绘制，也可以按住Ctrl键绘制多个表格。
3.3.2 论坛管理员登录
表2.1 管理员登录
字段名称 数据类型 字段大小 允许空 说
明
id 自动编号 长整型 否 无
user 文本 50 否 无
pwd 文本 50 否 无
1．表的说明
此表是用来论坛管理员登录的，共分为三个字段，其中id字段设为主键，数据类型是自
动编号，user和pwd字段分别用来存放管理员的登录名和密码，数据类型文本。
2．限制条件
在论坛管理员登录时，只有正确输入此表中的用户名和密码才能够登录到管理界面，才
有权对论坛里面的内容进行删除，否则只能在界面出发表评论。
第 - 6 - 页 共 12页
四川警安职业学院毕业设计
3.3.3论坛发言
表2.2 论坛发言表
字段名称 数据类型 字段大小 允许空 说明
id 自动编号 长整型 自动编号
time 是 留言时间 日期/时间
name 50 是 姓名 文本
sex 50 是 性別 文本
url 是 个人网站 备注
color 50 是 留言颜色 文本
email 是 电子邮件 备注
sysop 50 是 给版主 文本
pic 50 是 表情图示 文本
Yahoo 50 是 Yahoo Msn 文本
msage 50 是 MSN 文本
ICQ 50 是 ICQ 文本
txt 是 留言內容 备注
ip 50 是 留言位置 文本
uptime 是 回应时间 日期/时间
1．表的说明
此表是用来记录访客基本信息以及发表评论内容的，共有十五个字段，这里只给出了七
个字段，其中id 字段设为主键，数据类型是自动编号，time字段数据类型是日期/时间，其
余为文本或者备注。每个在论坛里发表评论的访客的基本信息和评论内容都可以保存在此表
中，便于显示调用。
2．限制条件
没有在论坛中正确填入自己的基本信息，就会导致登录失败，表中不会保存此内容。
第 - 7 - 页 共 12页
四川警安职业学院毕业设计
3.3.4论坛回复表
1．表的说明
此表用来存放访客针对论坛里面的内容所做的回复内容，各字段的内容同论坛发言表。
每个在论坛里回复评论的访客的基本信息和评论内容都可以保存在此表中，便于显示调用。
2．限制条件
没有在论坛中正确填入自己的基本信息，就会导致回复失败，表中也不会保存此内容。
表2.3 论坛回复表
字段名称 数据类型 字段大小 允许空 说明
id 数字 长整型 无
id_2 自动编号 长整型 自动编号
time 留言时间 日期/时间
name 50 是 姓名 文本
sex 50 是 性別 文本
url 是 个人网站 备注
color 50 是 留言颜色 文本
email 是 电子邮件 备注
第 - 8 - 页 共 12页
四川警安职业学院毕业设计
pic 文本 50 是 给版主
Yahoo 文本 50 是 Yahoo Msn
msage 文本 50 是 MSN
ICQ 文本 50 是 ICQ
txt 备注 是 留言內容
ip 文本 留言位置 50 是
ad 文本 无 50 是
第 - 9 - 页 共 12页
四川警安职业学院毕业设计
第四章 网站测试
Dream weaver MX提供了全面检测站点的功能，它比检测链接更全面。全面地检测内部、
外部链接、去除错标签、空标签、多余的标签等，它的使用相当简单，使用全面检测站点功
能如下：
1、选择菜单中【站点】的【报告】命令，打开一个窗口。
2、选择检测范围，在【报告】选项中有四个内容供选择：Current Document、Entire Local
Site、Select Files in site、Folder。
3、对工作流方面的信息进行检测。
4、对HTML文件的信息做出检查。
把编好的网站文件复制到D:/my web文件夹中，可以打开浏览器,就会看见网站了。
网站建成后并不意味着网站建设的结束，网站内容需要不断更新， 并且网站发布前要进
行细致周密的测试，以保证正常浏览和使用。主要测试内容：
1、服务器稳定性、安全性。
2、程序软件的测试。
3、网页兼容性测试，如浏览器、显示器。
4、根据需要的其他测试。
网站发布后也要定时的对网站进行维护，以保证网站的正常浏览和使用。主要的维护内
容有：
(1)、服务器及相关软硬件的维护，对可能出现的问题进行评估，制定响应时间。
(2)、数据库维护，有效地利用数据是网站维护的重要内容，因此数据库的维护要受到重
视。
(3)、内容的更新、调整等。
(4)、制定相关网站维护的规定，将网站维护制度化、规范化。
第 - 10 - 页 共 12页
四川警安职业学院毕业设计
总结
通过大学三年的学习，对网页设计已经不像以前那样一筹莫展了，现在自己能够实实在
在的做点东西出来，此次课程设计为个人网站，主要是展示自己，从学习Macromedia
Dreamweaver到现在更开设了ASP网页设计课程后对ASP网页设计这门课程以及JavaScript
脚本语言的学习，逐渐掌握了制作网页的方法和技巧，加上以前学习的网页设计的课程，通
过学习，能够熟练的使用网页三剑客来制作网页。对于一个动态网页我认为最重要的就是数
据库的设计，只要做好了数据库相关的事情，其它的设计都不难。
此次制作的个人主页对一个新手总的来说做得很不错，例如：1.记事本和留言本的设计
加上了数据库，能够实现动态记事和留言。2.界面清爽简单给人一种美好的感觉。也存在一
些缺点，例如：1.仅仅实现了留言板和日志的动态管理，没有能够实现动态添加好友和相片
上传的功能。2.网页基本上使用表格实现的许多功能，没有能够使用布局模式去设计，那样
界面可能会更加美观，不会有表格那么多的冗余的东西。3.留言板和日志的缺点仍然很多，
日志没能够实现对文字的格式编辑，这是一大败笔，界面不怎么美观。
经过这次课程设计从中学到很多，原来以为很难的网页设计其实也不是很难，只要自己
去动手做，总会有成果的，先前的我做的网页真的难以入目，但是通过在课堂上老师的讲课
以及实验中的体会加上平时的一些灵感对网页设计产生了兴趣，通过多次对个人主页的设计
修改 设计 在修改 在设计这样一遍又一遍的制作，终于做出了还过得去的个人主页，但是这
只是一个开始，网页设计很多东西还需要我们去努力，想要真正做出一个有成就的网页，光
我们在课堂上所学的这点知识远远不够，我们必须学会网页设计三剑客，加上必备的网页设
计语言我们才有可能制作出更加完美的网页，通过这学期的ASP课程以及课程设计学习到了
在网页设计中如何链接数据库，如何使用Macromedia Dreamweaver制作网页，掌握了网页设
计代码的书写以及用photoshop美化网页等等。总之，学到了很多，以前的课程设计我基本
上都是找代码的，但是这次是自己认认真真做出来的。这可能是我第一次真正自己动手做出
来的东西。在这之中感谢课堂上兢兢业业讲课的翁老师使我对网页设计这以前认为很难的东
西产生了兴趣并付诸了行动，感谢在这之中帮助我的同学们。
第 - 11 - 页 共 12页
四川警安职业学院毕业设计
参考文献
[1] 刘瑞新，《ASP动态网站开发、毕业设计指导及实例》[M]. 机械工业出版社 2000
[2] 王玉芬.《网站规划与设计》[M]. 西北工业出版社 2003
[3] 石晓燕、苏萍《网页设计基础》[M]. 清华大学、交通出版社 20 04
[4] 动态网站开发基础教程（c#篇）. 清华大学出版社,2008年11月[4]刘华,《程
序设计》. 清华大学出版社.2004
[5]小志,《ASP入门与实例演练薄》. 中国青年出版社，
[6]赵增敏,《ASP动态网页设计》. 电子工业出版社，2003
[7]邓文渊,陈俊华，《挑战ASP与网页数据库设计》.中国铁路出版社，2004
[8]宣小平,《ASP数据库系统开发实例导航》.人民邮电出版社，2003
[9]周艺文，《Photoshop网页艺术设计》. 清华大学出版社，2006
[10]刘禾,蔡锋,《精通ASP架站技巧》. 中国青年出版社，2002
[11]龚玉清,《网页设计的色彩运用》. 现代教育技术出版社，2003
第 - 12 - 页 共 12页
发布评论