毕业(设计)论文封面.doc

广东松山职业技术学院 毕业（设计）论文 题目：基于Web超级同学录网站设计与开发 姓 名： 年级、专业： 指 导 教 师： 年 月 日 第一章 引言 随着INTERNET的不断发展，越来越多的用户进入网络，利用网络资源。尤其是利用网络来发布信息，与亲朋好友联系。例如Email，OICQ，同学录等等。一个好的同学录更加成为用户之间进行交流的友好平台。毕业在即，为了更好的加强本班同学之间的联系，方便同学之间的交流，设计这样的一个同学录，目的是在全班的同学都参与进来，为我们提供一个良好的交流互动的平台，曾近同学之间的感情。 第二章 网站设计概述 1站点的总体规划 本同学录主要分为以下几个模块：班级通讯录，班级相册，班级留言板。其中主要做了班级通讯录，班级留言板和班级相册的部分程序。后台数据库采用ACCESS，用ASP实现对数据库的存取访问。 2． 2 开发工具说明 Dreamwearer MX 2004、FLASH、Fireworks MX 2004、HTML　SWiSHmax等 2． 3 主要模块划分 2．3．1班级通讯录 可以浏览班级成员的通讯方式，包括QICQ，电子邮箱，工作地点，联系电话 2．3．2班级相册 在页面中可以浏览到班级的同学照片或者集体相片等 2．3．3班级留言板 向班级的任何成员发布留言信息，以便于联系（为了增强趣味性，还可以选择人物头像） 2．3．4班级公告牌 查看班级近期的新闻，公告，方便班级成员了解班级情况 4 网站大致结构图如下 2-1网站结构图 2． 5主要流程 2．5．1注册为班级成员。 2．5．2登录同学录并可以在相关的连接上浏览本班信息，包括班级成员，班级公告，班级成员同学地址等 第三章 部分界面设计说明 在进入系统之前先必须输入正确的用户名和密码，登录系统的界面如下： 用户名：admin 密 码：admin 3．1主界面 3-1主界面 3．2 留言板界面 3-2留言板 3．3 班级相册界面 3-3班级相册 3．4 班级成员注册 3-4班级成员注册 第四章 网站版面设计说明 在网站开发前，最好使用DREAMWEAVER MX的网站管理功能规划好网站的基本结构，最直接的做法就是建立支持服务器技术的动态站点，将全部的素材都保存在这个站点文件夹下方便管理和维护。 4.1设计素材 Image文件夹保存“班级相册”所用到的图片 Images文件夹保存整个网站所用到的全部图片，包括网站背景图片 Face文件夹保存用户注册时所选择的各种GIF头像图片 Liuyanban文件夹中保存系统留言板中所用到的GIF头像图片 注：如果需要改变网站的某些图片，请直接将要用的图片拷贝到相应的素材文件夹中以同名替换原来的图片即可。最好使用和替换图片大小一样，文件格式一样的图片进行替换。 4.2页面布局 Index.asp 为同学录的主界面，界面布局如下图： 4-1主页面布局 info.asp 为班级通讯录页面，界面布局如下图： 4-2通讯录页面布局 liulanban/index.asp 为班级留言板留言显示页面，界面布局如下图： 4-3留言板页面布局 站点中部分用到的图片经过FIREWORKS MX 2004的处理，为了使站点文件的容量缩小，建议图片尽可能的保存为GIF，JPEG等较小容量的图片，以提高网站运行的速度 4.3为页面添加样式表 为页面添加CSS样式表文件，以单独的文件列出，可以统一的对网站整体进行格式化，包括页面颜色，表格颜色，表格样式，字体大小，字体颜色，图片和超连接等。另外，样式表文件以单独的文件列出还有利于网站的维护，即当需要改变网站中的某些元素的属性时，可以不用改动网站的页面代码，直接改动外部CSS样式表文件就可以达到对网站元素属性的修改。 4.4样式表代码 利用DREAMWEAVER MX的样式表编辑器可以直接到处外部样式表文件，方便对网站页面样式的直接修改。也可以直接在需要添加样式表的的页面中直接引用样式表。样式表编辑器如下图 具体对于样式表的引用方式分上述两种： 第一种是直接在文档中直接引用，这样引用方式将会在页面中加入如下代码： html head style type=”text/css” 这里是样式表的具体代码 /style /head body /body /html 第二种是对于外