个人网站的设计与实现.docx

1、个人网站的设计与实现福建儿童发展职业学院毕业论文（设计）(个人网站的设计与实现)姓 名： 学 号: 系 别： 人文科学系 专 业： 初等教育（信息技术方向)年 级: 009级 指导教师: 201年 10 月 30 日1.引言 1系统构架 12.1 obeDreamweaer S简介1.2 ASP技术 22. Acess数据库软件 23. 系统概要设计 31 网站整体设计 33.2 留言板设计 3. 数据库建立 3.1静态网页设计6 4.3 链接页面的制作94.4 其他页面的建立 5. 测试 0. 结束语 1个人网站的设计与实现摘要:随着国际互联网的普及，人们已经越来越不满足于在iternet上

2、浏览信息了。希望能够更深入的参与其中,拥有自己的网站。我们可以在网络这个平台上更好的展现自我。个人网页的设计与实现不仅能够让我们更好的与外界交流,沟通；还能够突出自己的个性与风格,增加个人魅力与自信。该研究课题主要研究现在人们的个人网站的实现。该课题主要是介绍了如何开发个人网站。关键词：个人网站;AS;web.引言目前关于NTER是我们听到最多的部分就是万维网(wol wde web）。Web实际上由数十亿单个页面组成，这非常类似于我们创建的ORD文档页面。这就是它就是一大堆页面。所谓的“页”，“页”中可能包括文字、图像、图形、声音、动画等。这些单个页面会链接到其他页面。通常一家企业或个人会创

3、建统一的一组页面,这些页面彼此相关。相关页面的集合就称为网站。每个网站都有主页,这个页面就像一个目录。通常主页就是网站的第一个页面，不过有些网站还包含入口页面，这有些类似于书本的扉页，可以由这个入口页面进入主页。这次的课题研究,我的网站设计与整个个性化页面生成系统主要由使用eamea开发的关联规则采掘系统和利用IS+P技术实现的个性化eb页面生成器两部分组成。二者通过数据库服务器和Web服务器连接。2.系统构架 网站,一个全新而又时髦的名词，正是有了无数的大小网站,才使互联网能蓬勃发展。很多人都想拥有一个属于自己的网站,因此，网站设计软件成为目前最为流行的软件之一。下面就介绍一下我开发个人网站

4、所需的设计软件以及开发环境。21 de DreaweaverCS5 简介Adb Deaweaver CS5是一款集网页制作和管理网站于一身的所见即所得网页编辑器，reamweaverCS5是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。2 ASP技术 AP是ctive Srer Pag的简写。Actve Server Pe是创建动态网页的一个很好的工具，它起一种编程语言的作用，可以利用它编写动态产生HML的程序代码。而且S也是服务器端脚本环境,可以用来创建交互式WB页并建立强大的的Web应用程序。SP技术能让Web

5、开发员和网页设计员快速地开发容易维护的动态eb主页。用户端只要使用可执行码的浏览器就可阅读ASP所设计的网页内容。SP所使用的脚本语言均在Web服务器端执行，用户端的浏览器不需要执行这些脚本语言。ASP不但功能强大,而且语法的编写规则很简单。ASP使用简单易懂的脚本语言和HTML语言作为基础语言，对脚本语言的类型没有限制，使用的编辑器简单，使用像indos的记事本这样的普通文本编辑器即可。23 Acces数据库软件Acess是ffice软件中用来管理数据库的应用软件，它操作简单、功能全面,其存储方式简单且便于管理和维护；既可以用来存放数据,也可以作为客户端开发工具进行数据库应用系统开发,即可以

6、开发小型软件，也可以用来开发大型应用系统。它可运行于各种Mrsft Wndw系统环境中,由于它继承了Wino的特性,不仅易于使用，而且界面友好。它并不需要数据库管理者具有专业的程序设计水平,任何非专业的用户不必编写代码,就可以用它来创建功能强大的数据库管理系统。本网站采用功能强大的Micosoft Access作为后台数据库，开发了一个小型的个人网站。图2-1 体统的结构图:3.系统概要设计3.1 网站整体设计表3- 网站构架图3.2 留言板设计表3-2留言板构架图3.3数据库建立图3-3 实体E图:网站用到的后台文件:表3- 后台文件部分图：文件名作用与功能备注din.s登陆后台ide.a首

7、页admi_artcleas管理文章后台arcat.as删除功能后台pot.sp发布功能后台morldmdb数据库文件后台a_diary.ap心情管理后台后台认证：只允许浏览者进入页面浏览，在对回复留言和新闻的增加、删除这些管理时都需要对用户的身份进行认证,即需要管理员提供后台管理的用户名和密码,该用户名和密码保存在相对应的数据库中。4 详细设计首先网站的策划，因为我制作的是个人的网站,所以面对的对象是自己周围熟悉的同学朋友，主题和内容就是自己日常生活琐事,还有跟好朋友有个交流沟通的平台，互相了解的小天地。这样就没有什么特别高的创意要求，只要温馨，简洁大方就好了。当然,如果你要设计的是一个面向

8、大众的个人展示平台，那就要求新颖的创意了。针对我自己的个人网站，我主要从下面几点进行设计的：快乐世界：是一个体现个性的板块内容，放置一些我比较喜欢的优秀文章或者我觉得很有意义的小故事还有图片供大家欣赏。(其他几个页面也是类似的,只是介绍的方向不同）。拥抱阳光：展示一些自己近期的生活照。心情动态:让朋友可以对我当天的心情有一个直观快捷的了解方式。留言板：设计一个留言板作为和朋友交流的纽带,这样可以随时促进朋友之间的情感，又因为是自己设计的,比较有保密性，分享快乐和秘密的地方。4.1静态网页设计现在整体的布局已经明确了，可以进行网页的设计了。图4-1 网站首页效果图: 这是我网站首页的效果，接下来

9、，我就简单演示一下这个主页的制作过程。首先,运行Dremwear cs,接着就是页面的布局了，选择“插入表格”然后根据你的需要划分,选择你所需的表格行列数。如图:图4-2网页分栏图:然后依次在你所划分的位置插入你所需要的图片等等。图- 网页分栏效果图：这样一个简单有漂亮的网页的划分就完成了.4.2 数据库设计本设计是采用AS结合ccess数据库平台的一个个人网站。网站开发的性能要求是实现网站的智能化。本设计能实现以下功能：心情版块的增、删、改和留言板的实现及一些静态网页的浏览。网站的数据库建设在这个网站的设计过程中占有非常重要的位置。其中，我们应该要考虑到的问题有：1.系统管理员： 系统管理员

10、具有对整个网站发布,数据库的管理,信息管理,人员管理的最高权限。包括心情的增、删、改，留言的回复、删除。以上的功能只能是管理员才有权限操作。2.浏览者:信息的最终浏览者,他们是不具有任何权限的普通用户。3.在设计数据库过程中，必须考虑到各种信息存放，更新。所以数据库必须能最大限度的满足各种信息的输入输出。以下为后台数据库的各表的结构和字段的分析。表3-5Admi (系统管理员)表:表-6 心情版块的管理表：表7内容管理表:表38 留言管理表：5 系统实现1 动态页面的制作在我的整个网站中,动态页面占了很重要的部分。首先，我根据我的个人主页所要实现的功能我制作好了我的数据库,接下来，我就把我设定

11、系统的SN(数据源名称）的方法来讲讲。S是用来确定数据库所在的位置以及数据库的相关属性的。使用DN的优点是,如果我要移动数据库档案的位置或是使用其他类型的数据库的时候，我只要重新设定DSN即可,不需要去修改原来使用的程序。下面,我就演示我在自己的电脑上配置DS的过程:1.启动控制面板，双击“管理工具”下的“数据源（ODB)”。2.在打开的“数据源(ODC)”对话框中选择“系统SN”标签,然后单击“添加”按钮。在弹出的“创建新数据源”对话框中，选择数据库的驱动程序为“MicrosoftAccessDrver(*.mdb）”,然后单击“完成”按钮。3.在出现的“ODBC Mcrosoft cess

12、安装”对话框，在“数据源名”文本框中输入我的这个网站的数据库的名称：mywrld，单击“数据库”栏中的“选择”按钮选择我的这个网站根目录中我已经建好的数据库 myworld.mb,然后单击“确定”按钮。4.这时,我发现系统数据源名称中已经多了一个“mywld.db”，这就是我的网站要使用的数据库。单击“确定”按钮，这样,我就完成了数据源的创建过程。如图:图-1数据源添加成功图：弄好这些后,打开dreamwer,将数据库与网页进行连接。打开数据库,连接好数据库,并将数据库中的内容分别拽入到表格中的适当位置，这样,数据库中的内容就显示在里面了。 链接页面的制作 链接的概念:链接也称超级链接，是指从

13、一个网页指向一个目标的连接关系,所指向的目标可以是另一个网页，也可以是相同网页上的不同位置,还可以是图片、电子邮件地址、文件、甚至是应用程序。可以分为文字，影像,邮件，文件下载这几种链接。在网页中，单击了某些图片、有下划线或有明示链接的文字就会跳转到相应的网页中去。 、在网页中选中要做超级链接的文字或者图片。2、在属性面板中单击黄色文件夹图标，在弹出的对话框里选中相应的网页文件就完成了。做好超级链接属性面板出现链接文件显示。3、按F1预览网页。在浏览器里光标移到超级链接的地方就会变成手型5. 其他页面的建立一样的，根据首页的制作方式来制作其他页面,这里我们要特别注意的就是制作网站的四个基本原则

14、：对齐、亲密性、重复性和对比。对齐就是指页面上的元素相互之间对齐。亲密性原则就是指元素相互靠近，放置在领进位置上时所建立起来的关系。重复的概念就是指，在整个项目中重复某些元素,从而将所有分离的部分联系在一起。网站整个看上去要体现统一性,体现出相同的理念。对比可以把你的目光吸引到页面上，让你为之注目。使元素形成对比能够吸引人的视线浏览页面,并建立一个信息层次体系，让你能够查阅众多信息并从中挑出你真正需要的信息。下面要给大家介绍我的设计中的部分代码：4 计数器的设计 采用ASP编程的方式实现访问者第几次光临本站。首先在代码的起始部分写如下代码：%Resosbufr=true%，意为先将页面先输出到

15、缓冲区。然后在底部计数器部分写下如下代码:制作计数器时，一定要在代码的最写.5添加记录的设计ech 字段数据编辑br ech table th=60 bordr=0 cellpading= celspcn= bgolo=#CCCCCech f ao=?keedit&tablenam= & naes prmarkey= keys & &pimrykevle= if(actionad,rs（ke),） ehod=post nme=edior echecho i(action=add,， ) eco &nsp; eco bsp； eo &nbp;&ns； eh 表结构anbsp;&b； e

16、ch 表浏览nbp;  ho 主界面.6 设置当前页的记录数sub soslect(sql) pg,pgeUrl,strd,tur pageSze =reque(aeiz） 设置每页显示的记录数if paeSize = orntiNumeic(pageSi) tegeSize50判断是否删除 if equest（keylog） thnstrdel = deletfr reest（tbenam) & where &request(primarykey） equest(eog) resoseWrtetrdel conn.execute(strdl) eurl = ? rpae(reque

17、s.QueryString，kyog=&reqest(ylog）,) repnsRirec erl end if7 设置当前显示的页数g eqes(page） f = or notisNurc(age）thnag1 pageUrl = ？keysql&sq= &qifequs（priayey） and reqest(tale_m） and isNumeric(rest(pagize) thn eho &reqest(pagSiz)&/ption ls ech opton vue=050 to value=01 20/option 30 40 0/ption pion vale=6060 opt

18、onale7070 opt valu=80 option vlu=900optn 00/oion 六、 测试 一个好的网站建设好了之后是不能立即发布的,因为由于在程序开发和页面制作的过程中难免会出现误差，所以在正式发布前通过测试找出网页中的漏洞是非常重要的一个环节。在这之前需要进行一段时间的测试。1测试的项目。我主要就如下几个方面进行探讨：性能测试,安全性测试,稳定性测试 ，浏览器兼容性测试 ,可用性/易用性测试,链接测试 ，代码合法性测试 。在我的个人网站的测试过程中，在数据库的链接做的不好,很多图片的相对位置都出现了很多的错误，还好,经过我自己的修改，现在已基本消除了这种现象。下面是关于连

19、接数据库的部分代码：连接数据库之前,首先必须声明一个对象来作为数据库与S程序之间的媒介,对象的声明方式如下:Set cn=seer.reatobjt(“AOBO.Cntion”)ateoe是rvr对象中建立的函数，利用上面书写的方法，即可建立一个与数据库交换数据的对象，这种对象称为cnection对象。Con是一个要与数据库沟通的对象变量。对象建立完成后,还要打开通道与数据库作连接才算是连接完成。通过ADO连接acss数据库实例代码如下: 2.在I地址栏里输入htt:/ocalos/tes/，就能访问系统的前台首页面。图5-1网站首页示意图：这是在地址栏中输入http:/ocalhst/tes

20、t/跳出来的页面。6结束语两个多月的毕业设计已告一段落，到此,我制作的个人网站已经基本完成。但由于毕业设计时间较短,本人的能力有限，导致于我无法让我的数据库和网站进行正确的相联接，这个系统还有许多不足的地方。这些都有待于进一步改善。参考文献1刘瑞新.asp动态网站开发毕业设计指导及实例北京:机械工业,20.45-502陈旭东.网页设计与制作M.北京：北京大学，003-11.3明日科技.sp开发典型模块大全M.北京：人民邮电，09.9-122赵艳铎网页制作三剑客M.上海：上海科学普及出版社,20薛凯,康亚雄.Dramweaer CS3 入门 提高 精通M.机械工业出版社,86甘登岱.网页设计三合

21、一M.北京：清华大学出版社，2007邱云飞,温国峰.网页设计与网站建设M.北京：清华大学出版社，20098杨继萍,孙岩,梁文新.Acess2007数据库应用与开发M.北京：清华大学出版社,208致 谢通过这次的毕业设计，我不仅提高了自己的学习能力、动手能力,也拓宽了我的知识面，同时也克服了自己害羞的性格,增强了克服困难的勇气。在本次毕业设计中，指导老师认真负责的工作态度，不厌其烦地指导都让我特别感动。无论在理论上还是在实践中，都给了我很大的帮助,使我受益匪浅；这对于我以后的工作和学习无疑是一种巨大的帮助，非常感谢他耐心的辅导。另外,在网站制作过程中身边的同学同样给予我不少帮助，当我有问题向大家请教时，大家都很热情尽力的帮助我，在这里一并表示感谢。