动态网页设计报告书

《动态网页设计》课程设计报告书

班级 09级信息(1)班

学号 ***********

姓名关晓龙

2012 年5 月

目录

一、系统概述 (3)

二、数据库设计 (4)

三、网站设计过程及制作步骤 (4)

3.1数据源配置 (4)

3.2 IIS配置 (8)

3.3创建站点 (10)

3.4页面制作 (11)

3.4.1主页面 (11)

3.4.2注册页面 (11)

四、网站使用说明 (12)

五、心得与体会 (13)

一、系统概述

本网站是关于系统留言方面，用户可以注册新用户登录到网站，并且可以留言等交互功能。

主要实现留言交互功能，主要功能模块有：

网站布局及导航草图（导航草图的制作有利于理清思路，避免在制作网站的过程中乱了方寸）

图导航图

在导航草图中，网站首页下面有6个二级网页。各网页内容和作用如下：主页：导航作用，能连接到其他子页面

登陆页面：输入用户名和密码就能成功登录

注册页面：输入个人信息以注册，注册成功就可以登录否则返回首页

留言页面：提供留言功能

二、数据库设计

根据概述给出数据库设计的内容，字段等，所采用的软件和设计方法等。给出数据库名，画表格，如：

三、网站设计过程及制作步骤

3.1数据源配置

（1）打开【控制面板】窗口，选择【管理工具】中的【数据源（ODBC）】，打开ODBC数据源管理器，选择【系统DNS】选项卡，单击【添加】按钮。

（2）在打开的【创建新数据源】对话框的【选择您想要为其安装数据的驱动程序】列表框中，选择“SQL Server”，然后单击【完成】按钮。

（3）在【创建到SQL Server的新数据源】对话框中，将数据源的名字设置为VoteData，该名字就是用来连接数据库的数据源名字，但不一定是数据库的名称；同时选择SQL Server 数据库服务器，这里选择本机(local)。然后单击【下一步】按钮。

（4）在选择登陆方式的界面中，使用默认的方式。单击【下一步】按钮。

（5）在选择数据的界面中，指定数据源所对应的数据库V oteData，单击【下一步】。

（6）单击【下一步】。

（7）在完成并进行数据源的测试成功后，在【ODBC数据源管理器】对话框的【系统DNS】选项卡中就可以看到新添加的数据源V oteData。

3.2 IIS配置

3.3创建站点

步骤1 进入Dreamweaver 8工作界面后，选择“站点”/“新建站点”命令弹出“未命名站点1的站点定义为”对话框。

步骤2 在该对话框中的“基本”选项卡中的“您打算为您的站点起什么名字？”文本框中输入 ggg

步骤2 单击“下一步”按钮，在弹出的对话框中选中“是，我想使用服务器技术”，在“哪种种服务器技术？”下拉列表中选择“ASP VBScript”。

步骤3 单击“下一步”按钮，在弹出的对话框中选择在开发过程中如何使用文件，这里选中“在本地进行编辑和测试”，在“你将把文件存储在计算机上的什么位置？”文本框中输入F:\ index\

步骤4 在弹出的对话框的“您应该使用什么URL来浏览站点的根目录？”中输入http://localhost/index/ ,输完后，单击“测试URL”按钮。如果这时它提醒你URL前缀测试成功，点击“确定”按钮，你就可以进入下一步了，否则的话，你再按照前面的步骤检查站点出现的问题。

步骤5 单击“下一步”按钮，在对话框中选择“否”。

步骤6 单击“下一步”按钮，点击“完成”按钮即可完成本地站点的创建，这时，创建的站点就显示在“文件”面板中了

如图所示

3.4页面制作

3.4.1主页面

先插入一个3行1列表格，在第1行插入图片。第2背景颜色设置，3行合并单元格设置随机广告。第4行2列嵌入表格插入布局图片。

步骤1 插入模板，在模板的第1列第1行插入一个主要图片

步骤2 在第2行插入导航条

步骤3 在第3行第2列插队入一个表单，在表单中插入一个5行2列的表格

步骤3 做完了相应的操做之后就保存，保存完之后再另存为一个一模一样的网页，改一下名字，点击确定

步骤4 创建一个数据库文件，其中输入用户名、密码、电话、E-mail、QQ 性别，在姓名的字段中添加一个主键，单击保存。

步骤4 在留言板中添加数据源，在添加插入记录的服务器行为

步骤5 在另外一个留言板中，添加记录集和绑定服务器行为。

步骤6 在插入菜单-应用程序对象形字-记录集分页，插入一个记录集分页3.4.2注册页面

步骤1 插入模板，在模板的合并第1列并输入文字“登录”

步骤2 在第2行插入用户名第二列插入文本域

步骤3 在第3行第1列输入文字“密码”，第2列插入文本域

步骤3 做完了相应的操做之后就保存，保存完之后再另存为一个一模一样的网页，改一下名字，点击确定

步骤4 创建一个数据库文件，其中输入用户名、密码、电话、E-mail、QQ 性别，在姓名的字段中添加一个主键，单击保存。

步骤4 在留言板中添加数据源，在添加插入记录的服务器行为

步骤5 在另外一个留言板中，添加记录集和绑定服务器行为。

步骤6 在插入菜单-应用程序对象形字-记录集分页，插入一个记录集分页四、网站使用说明

整个网站分为五个页面，分别为：主页面、登录页面、注册页面、留言页面、搜索、帮助。各个页面间都是相互连接的，方便读者更快捷地找到想了解的信息。

网站的目录结构如下：

Flyfish ------网站根目录

Css ------存放外置CSS文件

Flash ------存放Flash动画

Images ------存放图片文件

Bt ------存放所有标题或栏目标题的图片文件

Content ------存放所有与网页内容相关的图片文件

Design ------存放所有与网页界面设计相关图片文件

Menux ------存放所有与导航下拉菜单相关图片

Navigation ------存放导航栏目图片文件

Sight ------存放景点图片

Linkpages ------存放图像或文本超链接的文件

Music ------存放背景音乐

Nagvipages ------存放导航下拉菜单连接的网页

Js ------存放外置JS图片