动态网页设计论文_图文

毕业设计（论文）

题目：

专业：

班级：

学生：

指导教师：

摘要

在Internet飞速发展的今天，互联网已成为人们快速获取、发布和传递信息的重要渠道，正以一种前所未有的冲击力影响着人类的活动。它在人们政治、经济、生活等各个方面发挥着重要的作用。因此网站建设在Internet应用上的地位显的格外重要，它已成为政府、企事业单位信息化建设中的重要组成部分。

现今的社会，人们已经离不开了网络，网络已经成为人与人之间交流的一种形式，它能够把事情的复杂化转为简单化，摆脱了时间和空间的限制。网站为消费者提供了一个网络生活空间，通过其网页展示了企业介绍、企业荣誉、产品介绍、招商信息、加盟程序、留言等一系列内容的介绍。浏览者不仅可以利用留言板经济而又快捷地与外界进行各种信息的沟通，也可以直接在网上申请加盟。

本论文还介绍了网页的结构分析和具体功能实现，网页的界面和运作方式，尽力模拟近代网页普遍性形式，成为一个完整的动态网站

关键字

Dreamweaver；Php；PhpMyAdmin；动态网页

目录

1 引言 (1)

2 网页制作概述 (1)

2.1 网页的类型 ........................................................ 错误！未定义书签。

2.1.1 静态页面 (1)

2.1.2 动态页面................................................. 错误！未定义书签。

2.2 网页开发技术 .................................................... 错误！未定义书签。

2.3 网页布局 ............................................................ 错误！未定义书签。

2.3.1 网页布局的基本概念 ............................. 错误！未定义书签。

2.3.2网页布局方法.......................................... 错误！未定义书签。

2.3.2 网页布局技术......................................... 错误！未定义书签。

2.4网页配色 ............................................................. 错误！未定义书签。

2.5 网页设计流程 (2)

3 动态网页开发环境和技术 (2)

3.1 了解Dreamweaver开发工具 (2)

3.2 Php语言基础知识 (2)

3.3 开发环境介绍 .................................................... 错误！未定义书签。

4 设计及具体代码实现................... 错误！未定义书签。

4.1网页结构设计 (3)

4.2创建数据库 (3)

4.3主要模块的代码实现 (5)

4.3.1 注册代码的实现 (5)

4.3.2 登陆及退出登录代码的实现 (7)

4.3.3留言代码的实现 (9)

4.4运行测试 (11)

4.4.1 注册 (11)

4.4.2 登陆 (12)

4.4.3留言 (13)

4.5遇到的问题及解决方法 (14)

结束语 (16)

致谢............................................... - 17 -参考文献............................................ - 18 -

1 引言

网页是网站信息发布与表现的一种主要形式。因此要实现一个网站，必须了解网页制作的相关知识。较流行的开发工具有：Dreamweaver，Php，PhpMyAdmin。

网页制作要能充分吸引访问者的注意力，让访问者产生视觉上的愉悦感。因此在网页创作的时候就必须将网站的整体设计与网页设计的相关原理紧密结合起来。网站设计是将策划案中的内容、网站的主题模式，以及结合自己的认识通过艺术的手法表现出来；网页制作通常就是将网页设计师所设计出来的设计稿，按照W3C规范用html语言将其制作成网页格式。

2 网页制作概述

2.1.1静态网页与动态网页区别

通常，网页可以分为静态网页和动态网页。静态网页页面上的内容和格式一般不会改变，只有网管可根据需要更新页面。动态网页的内容随着用户的输入和互动而有所不同，或者随着用户，时间，数据修正等而改变。网页上的内容也可以由用户通过使用客户端描述语言(JavaScript, JScript, Actionscript,）来改变。当然更普遍的是由服务器端的描述语言（Perl，PHP, ASP, JSP, ColdFusion, 等)进行编译，从而对动态网页的内容进行改变。无论是客户端还是服务器端的改变都需要使用较为复杂的应用软件。随着信息技术的更加专业化，越来越明显的倾向表明，网页设计和网站的发展会逐渐成为两个不同的领域。网页是借助于美术构图与程序互动、动画等方式向大众推广相关信息的媒体，所以网页设计包括了几大部分：版面构图程序开发网站内容管理

2.5 网页设计流程

网页设计是一个互动的过程，不仅是设计师构思设计就可以完成的。从客户提出需求到最终发布，期间需要客户与设计人员共同参与协商才可以，具体流程如下：

首先，获取客户需求和资料。在设计网站页面之前，设计师需要知道客户的需求，从而确定客户建立网站的目的。客户提出网站需求是非常重要的一个环节。没有详细的需求，设计人员无法凭空进行设计制作。在这个步骤中，双方的沟通与交流是非常重要的。

其次，确定网站内容。设计人员选择适合自己的图像编辑软件、动画制作软件和网页制作软件进行网页的初步设计，这中间可能还需要和客户进行多次沟通才能达到客户满意的效果。在具体设计时，设计人员应该为网站定位一个主题，从而保证所有网页都围绕这个主题进行设计制作，保证风格的和谐统一。

然后，申请域名和空间。使用该方法能够有效同步管理文件。还可以通过FTP软件连接到服务器空间上，然后上传发布文件。

最后，后期维护。一般静态网站上传后，如果客户方没有专业人员维护，这样就需要设计人员从客户方获取新资料进行定期或不定期的更新。如果是动态网站，设计人员需要负责培训客户方如何使用后台管理，这样客户就可以自己通过后台管理添加信息，设计人员只要及时更正动态网站的错误即可。

3 动态网页开发环境和技术

3.1 了解Dreamweaver开发工具

3.

4.1网页结构设计

css+div结构目前用的人最多，框架结构现在很少有人使用了，而表格结构目前用的人也不多，但并不意味着已经被淘汰，它也有DIV所不能取代的效果——方便快速的布局，只要不是经常改动的小部分就可以用表格。DIV可以与表格一起用，大布局用DIV，而小地方就用表格，效果会很好。比如本次论文所涉及的网页就用到了表格与css+div相结合的思想，其上、下、左、右和中间分别是一个单独的div模块。具体框架结构如图4-1。

图4-1 网页框架图

4.2创建数据库

本论文设计的网页，所用到的数据库test是通过数据库管理工具——PhpMyAdmin做的，具体创建过程就不在这一一介绍了。其包含两个表分别为：liuyan、test2，如图4-2和4-3。

本表主要存储游客名、游客留言内容和留言时间等数据。

图4-3 信息存储表2

本表主要存储数据有：游客注册名、性别、年龄、学历、专业、爱好、

备注、密码（密码就是注册时，所输入的验证码）和注册时间。

4.3主要模块的代码实现

4.3.1 注册代码的实现

if($_POST['name'])

{

include("conn.php");

$up=$_FILES["tx"];

$hh=$up['type'];

$fff=$up['tmp_name'];

$yu=$up['name'];

//获得客户端和服务器端的验证码。

$host=$_SERVER['HTTP_HOST'];

$host= md5($host);

$cookie_=$_COOKIE[$host];

@session_start();

$y=$_SESSION[$cookie_];

$y_d=$_POST['yz'];

/*。。。。。。。。。。。。。。核对客户端和服务器端的验证码库。。。。。。。。。。。。。。*/

if($y_d===$y)

{

/*。。。。。。。。。。。。。。。。。。。查询数据库中的资源个数。。。。。。。。。。。。。。。。。。。*/ $dd=mysql_query("SELECT * FROM `test2`");

$hang=mysql_num_rows($dd);

$hang=$hang+1;

/*。。。。。。。。。。。。。。values后不能有空格。(id,name,sex,age,diploma,speciality,like,remark,mima,enrolDate)。。。。。。。。。。。*/ $sql="insert into test2

values($hang,'{$_POST[name]}','{$_POST[sex]}',{$_POST[age]},".

"'{$_POST[diploma]}','{$_POST[speciality]}','{$_POST[like]}','{$_POST[rema rk]}','{$_POST[yz]}',now())";

/*。。。。。。。。。。。。。。。。。。。。。。。。检测是否插入成功。。。。。。。。。，。。。。。。。。。*/ if(@mysql_query($sql,$conn))

{

if($hh=="image/pjpeg"||$hh=="image/gif"||$hh=="image/png"||$hh=="image/bm p"||$hh=="image/jpg"||$hh=="image/jpeg")

{

@move_uploaded_file($fff,'E:/zhandian/zhandian1/sousuo/touxiang/'.$_POST['n ame'].'.jpg');//目录地址不能用反斜杠'\'。

}

echo "";

}

else {echo "";}

}

else{ echo "";}

}

@mysql_close($conn);

?>

这段代码主要是将游客注册信息插入到test2表，如果游客注册成功，会弹出一个注册成功提示框“注册成功,您是第***位注册用户!”。如果没能注册成功，则会弹出一个注册失败提示框“对不起,您未能注册成功!”或“对不起您未能注册成功,因为您输入的验证码不正确或右侧的验证码已经失效。”,（出现此提示是因为游客在注册时，由于停留时间过长，对应的session 已经不存在了）如图4-4所示。

图4-4 注册界面

4.3.2 登陆及退出登录代码的实现

header('Content-Type:text/html;charset=GB2312');

include("conn.php");

$g=mysql_query("SELECT * FROM `test2` WHERE name='{$_GET[username]}' and mima='{$_GET[mima]}'");

$h=mysql_query("SELECT * FROM `test2` WHERE mima='{$_GET[mima]}' and name!='{$_GET[username]}'");

$j=mysql_query("SELECT * FROM `test2` WHERE name='{$_GET[username]}' and mima!='{$_GET[mima]}'");

$hang=mysql_num_rows($g);

$hang_1=mysql_num_rows($h);

$hang_2=mysql_num_rows($j);

if($hang){

$host=$_SERVER['HTTP_HOST'];

$host= md5($host);

$cookie_=$_COOKIE[$host].$_COOKIE[$host];

@session_start();

$_SESSION[$cookie_] = $_GET[username];

echo "

欢迎".$_GET[username].

"登陆！

";

}

else{

if($hang_1){

echo '用户名有误';

}

else{

if($hang_2){

echo '密码有误';

}

else{

echo '用户名和密码都有误';

}}}?>

这段代码主要是检测游客登录时，所提交的用户名和密码。如果表test2中有游客所提交的游客名，但没有游客所提交的密码，则会输出一个错误提示信息“密码有误”。如果表test2中有游客提交的密码，但没有游客提交的用户名，则会输出一另一个错误信息“'用户名有误”。如果表test2中既没有游客提交的游客名，也没有游客所提交的密码，则会输出“用户名和密码都有误”。如果表test2中既包含游客提交的游客名，又包含游客提交的密码，则输出“欢迎***登陆！”信息，并把游客的名字存入到一个名为$cookie_的SESSION中。

header('Content-Type:text/html;charset=GB2312');

$host=$_SERVER['HTTP_HOST'];

$host= md5($host);

$cookie_=$_COOKIE[$host].$_COOKIE[$host];

@session_start();

$_SESSION[$cookie_] = "";

?>

这段代码主要是将值为要退出的游客名的SESSION设为空,登陆界面如图4-5：

图4-5 登陆界面

4.3.3留言代码的实现

header('Content-Type:text/html;charset=GB2312');

include("conn.php");

//获得客户端和服务器端的密码。

$host=$_SERVER['HTTP_HOST'];

$host= md5($host);

$cookie_=$_COOKIE[$host].$_COOKIE[$host];

@session_start();

$y=$_SESSION[$cookie_];

if($y)

{

/*。。。。。。。。。。。。。。查询数据库中的资源个数。。。。。。。。。。。。。。。*/

$dd=mysql_query("SELECT * FROM `liuyan`");

$hang=mysql_num_rows($dd);

$hang=$hang+1;

$sql="insert into liuyan values($hang,'{$y}','{$_GET[liuyan]}',now())";

/*。。。。。。。。。。。。。。。。。。检测是否插入成功。。。。。。。。。。。。。。。。。。。。。。。。*/

if(@mysql_query($sql,$conn))

{

echo $hang;

}

else {echo "留言失败";}

}

else{ echo "还没登陆";}

@mysql_close($conn);

?>

这段代码主要是将游客提交的留言内容插入到表liuyan中，如果游客留言信息被成功插入，则会输出插入位置（游客是第几位留言的）。如果插入失败。则会输出错误提示信息“留言失败”或“还没登陆”,（当游客还没登录时就留言，会输出此错误信息）留言界面如图4-6。

图4-6 留言界面

4.4运行测试

我们以游客张山为例，来测试一下本网页的几个主要功能模块。（游客注册、游客登录和游客留言）

4.4.1 注册

当游客张山输入注册信息时，界面如图4-7：

图4-7 注册界面

当游客张山提交信息成功后，将会弹出一个成功提示信息，如图4-8：

图4-8 提示界面

当我们查看数据库test中的表test2时，会发现其多了一条关于张山的游客信息。如图4-9：

如图4-9 注册后的数据库图

4.4.2 登陆

当张山把名字和密码输入时，登陆界面如图4-10：

图4-10 登陆界面

当张山以正确的名字和密码登陆后，出现提示，如图4-11：

图4-11 提示界面

4.4.3留言

当张山写入留言时，留言界面如图4-12：

图4-12 留言界面

当张山成功将留言内容提交后，会弹出一个留言成功提示框，如图4-13：

图4-13 成功留言界面

当我们查看数据库test中的表liuyan时，会发现其多了一条有游客张山所写的留言内容，如图4-14：

图4-14 留言图

4.5遇到的问题及解决方法

在本次论文设计中主要遇到两个大问题。

第一，在输出注册框时出现了乱码。

解决方法是:在要输出的注册框代码的开头处加上这么一段代码header('Content-Type:text/html;charset=GB2312');

第二，在游客留言时，游客已经退出了登录，但还能以此游客名进行留言。

解决方法是：在游客登录时，在后台创建一个名为$cookie_（此名是有游客电脑中的关于本网页的cookie值相加得到的。）的session，将游客名

存入其中。在用户退出登录时，就其值设为空（因为游客在提交留言时，会有一个专门的动态网页首先查看后台服务器中有没有名为$cookie_的session或其值是否为空，如果其不存在或值为空，则就说明此游客还没有登录，就会有相应的提示框弹出。）。

总结：在制作本次论文所涉及的网页时，大大小小也遇到的不少问题，但主要的问题也就这两个，这些问题都是通过查阅一些相应的查考文献来一一解决的。

结束语

本设计根据毕业设计任务书的要求制作，功能基本实现，可以完成登陆、注册、留言、各产品展示等功能的实现。此次设计是查看了一些企业网站的结构然后进行设计的，虽然此次设计构造不能说是成熟，但也算是尽了力。

这是我首次运用Dreamweaver、Php语言结合PhpMyAdmin数据库系统开发工具进行动态网页的制作，一切都是从零开始学习，所以制作的时候难免会过于简单，考虑的也不是很周全。同时由于时间的仓促，有些功能的实现不是很完美。在设计过程中不可避免地遇到了各种各样的问题，由于整个设计完全都是由个人设计的，有关Dreamweaver、Php和数据库连接等方面许多细节问题都要靠自己去摸索，加之本人水平有限，因此还存在着许多不足之处。

在以前的时间内我学习了许多专业课程，比如C语言，java语言，数据库系统概论，FLASH等等，虽然通过学习对这些课程有所了解和掌握，但是始终处于理论知识的掌握阶段，并没有真正应用于实践设计开发，所以对知识的掌握还不够全面和熟练，并不能真正独立的开发出一个完整的应用于实际的系统。通过这次毕业设计，使我学到了很多，对自身的能力有了很大的提高。此次设计是动态网页设计，而不是简单的静态网页，因此采用了在开发动态网页方面比较先进的Php语言作为开发语言。Php是一种Web编程脚本语言。当然在制作的过程中碰到过一些让人头痛的问题，我都一一解决了，直到设计全部完成，也让我在解决问题方面的能力得到了提高。

整个开发的过程对我来说是一次将理论应用于实践的过程，是将以前所学知识充分利用的过程，是一次真正的实践过程。

总体说来，在这学期的毕业设计中，学到了一些在课堂内所学不到的知识，收获很大。