1、网页设计与制作课程设计沈阳工业大学网页设计与制作课程设计题目：电话簿管理系统学院：工程学院专业/班级：电子商务1101姓名：陈超同组人姓名：燕海霞 王莉 黄程程 唐易灵指导教师：关学铭报告时间： 2014年 6月20日成绩与教师评语成绩教师评语一 网页设计的总体概述 11.1 网页设计 11.2 网页设计的目的 11.3 网页设计的任务 21.4 网页设计的要求内容 21.4.1 HTML标记语言 21.4.2 Dreamweaver8 31.4.3 平面图像处理软件 31.5 本文所制作网页主题内容介绍 41.5.1 网页题目 41.5.1 网页主题内容 4二 网页素材制作 42.1 42.
2、2 5三 Dreamweaver8网页制作 53.1 创建本地站点 53.2 主页制作过程 53.3 二级页面制作 63.4 页面之间的超链接 6四 程序设计与实现 64.1 功能设计 64.2 数据库设计 6五 程序测试 7六 总结 7致谢 7参考文献 7一 网页设计的总体概述1.1 网页设计网页设计是网站是企业向用户和网民提供信息(包括产品和服务)的一种方式,是企业开展电子商务的基础设施和信息平台，离开网站（或者只是利用第三方网站）去谈电子商务是不可能的。企业的网址被称为“网络商标”，也是企业无形资产的组成部分，而网站是INTERNET上宣传和反映企业形象和文化的重要窗口。网页设计的建站包
3、含：企业网站、集团网站、门户网站、社区论坛、电子商务网站、网站优化技术等，如中华网库，在行业中各自有各自的作用。网页设计是一个广义的术语，涵盖了许多不同的技能和学科中所使用的生产和维护的网站。不同领域的网页设计，网页图形设计，界面设计，创作，其中包括标准化的代码和专有软件，用户体验设计和搜索引擎优化。许多人常常会以工作小组负责不同方面的设计过程中，虽然有些设计师将他们所有的网页设计是设计过程的前端（客户端）的设计用于描述一个网站，包括写标记，但是这是一个灰色地带，因为这还覆盖了网络的发展。网页设计师预计将有意识的可用性，如果他们的作用，需要创建标记，那么它们也有望成为最新的网页易读性指引。1.
4、2 网页设计的目的本课程的设计目的是通过实践使同学们经历Dreamweaver 8开发的全过程和受到一次综合训练，以便能较全面地理解、掌握和综合运用所学的知识。结合具 体的开发案例，理解并初步掌握运用Dreamweaver 8 可视化开发工具进行网页开 发的方法;了解网页设计制作过程。通过设计达到掌握网页设计、制作的技巧。 了解和熟悉网页设计的基础知识和实现技巧。根据题目的要求，给出网页设计方 案，可以按要求，利用合适图文素材设计制作符合要求的网页设计作品。熟练掌 握Photoshop 8、Dreamweaver 8 等软件的的操作和应用。增强动手实践能力，进 一步加强自身综合素质。我本次主要
5、是设计的是以“电话簿管理系统”为主题的网页。1.3 网页设计的任务任务一、网站欣赏：Dreamweaver CS3提供了站点创建与管理工具，通过站点管理器可以更好地利用站点对文件进 行管理，实现本地路径设置、地址信息管理、远程服务器信息管理、测试服务器环境配置、模板和库 管理等功能。任务二、网页布局：网页布局的好坏是决定网页美观与否的一个重要 因素，主要从两方面去理解，一种是结构布局，另一种是艺术布局。通过合理的布局，可以将页面中的文字、图像等内容完美、直观地展现给访问者，同时合理安排网页空间，优化网页的页面效果和下载速度。 因此，在对网页进行布局的过程中，应遵循视觉的对称平衡、对比、凝视和空
6、白等原则。常见的网页布局 形式包括:型布局、“三”型布局、框架布局和 POP布局。任务三、色彩基础：网页设计是一种特殊的视觉设计，它对色彩的依赖性很高。由于色彩能够在不知不觉间影响人的心理，左右人的情绪，所以色彩设计也是网站风格设计的决定性因素之一。任务四、软件的安装：启动计算机，将Dreamweaver CS3光盘放入CD-ROM驱动器中，找到Dreamweaver CS3安装 文件setup.exe，双击即可启动安装程序。按操作向导提示操作即可完成全部安装过程。1.4 网页设计的要求内容本程序的设计是为用户提供一个电话薄管理平台，给用户提供一个管理联系人的联系方式的小系统。本电话薄管理系统
7、利用计算机对通讯录进行统一管理，包括了添加、修改、查询记录等功能。程序中涉及结构体、数组、文件等方面的知识，从而实现通讯录管理工作的系 统化、规范化和自动化，给用户的工作和生活提供便利。 系统模块设计:整个电话薄管理系统包括如下几个功能模块。 (1) 输入记录模块:输入记录模块主要完成将数据存入数组中的工作。在此电话薄管理系统中，记录可以从以文本形式存储的数据文件中 读入，也可以从键盘逐个输入记录。 (2) 查询记录模块:查询记录模块主要完成在数组中查找满足相关条件 的记录。在电话薄管理系统中，用户可以按照联系人姓名或联系人 电话号码在数组中进行查找。 (3) 更新记录模块:更新记录模块主要完
8、成对记录的维护。在电话薄管 理系统中，它能实现对记录的修改、删除、插入和排序操作。 (4) 输出记录模块:输出记录模块主要完成两个任务1.4.1 HTML标记语言基本内容：1.构建HTML网页2.文本及版面风格控制3.图像、超链接和表格4.HTML的表单5.HTML的其他常用标记6.层叠样式表CSS。要求：1）了解HTML语言与高级语言（如VB、C等）的区别；识记网页常用标记及属性，如标题、字体、段落、图像、超链接、表格等；2）熟练掌握HTML表单中各界面对象的标记符号和属性，如表单、文本域、列表域、复选框与单选钮、命令按钮等；3）熟练掌握在Dreamweaver中使用层叠样式表CSS；了解层
9、叠样式表与标记属性的区别。1.4.2 Dreamweaver8基本内容1Dreamweaver8基础知识2设计站点3文字处理与图像4超链接5表格与图层的使用6框架 7层叠样式表CSS8表单与行为要求：了解Dreamweaver8基础知识、掌握设计站点、文字与图像处理、超链接、表格与图层的使用、框架、层叠样式表CSS、表单与行为。1.4.3 平面图像处理软件基本内容：1灵活运用Fireworks 8作网站的图像处理 2灵活运用Flash 8作网站的动画处理要求：了解网页文字素材、图形图像素材、声音素材、动画素材的基础和Fireworks、Flash的使用方法。1.5 本文所制作网页主题内容介绍1
10、.5.1 网页题目电话簿管理系统1.5.2 网页主题内容本文网页是沈阳工业大学工程学院11级电子商务专业小苹果组合的电话簿，其中包括对小苹果成员电话信息进行添加、删除和修改，以及及时更新成员的电话号码和所在单位部门，方便其他同学及时取得小苹果成员的最新联系方式和相关动态。二 网页素材制作2.1 Fireworks制作图片2.2 Photoshop制作首页图片三 程序设计与实现3.1 功能设计（1）制作该网页页面主要实现电话簿的管理，其主要功能分别为：添加电话；电话管理；电话修改 添加电话将添加电话设置成超链接，点击“添加电话”跳转到user_add.asp进行操作 电话管理将电话管理设置成超链
11、接，点击“电话管理”跳转到user_manage.asp进行操作注销登录 将注销登录设置成超链接，点击“注销登录”跳转到loginout.asp进行操作3.2 数据库设计四 程序测试（1）网页登录页面（2）电话簿管理网页首页首页显示数据库中存入的电话信息：（3）首页搜索引擎通过输入姓名，实现在数据库中搜索数据的功能：功能实现代码： 搜 索 电 话 按姓名查找: 模糊查询 （4）电话添加页面点击首页添加电话弹出该页面，带有星号的选项必须进行填写，填写好信息后点击保存，将数据添加到数据库。功能实现代码：电话维护页面%if lid then%电话信息修改电话信息添加电话信息姓名:inp
12、ut name=name type=text class=text id=name style=width:154px value= /*电话：input name=tel type=text class=text id=tel style=width:154px value= /*单位:input name=department type=text class=text id=department style=width:154px value= /input type=hidden name=id value=/（5）删除信息选中要删除的信息，然后点击删除所选项，系统会自动弹出“你确定这样
13、做吗？”点击确定删除所选中的信息。点击反回，取消操作。功能实现代码： 全选 五 总结Internet正在以强大的冲击力影响着人类的生活。Internet的出现和迅速发展，彻底改变了人们的传统生活方式。Internet现在已经渗透到了人类社会的各个领域， 以及人们的日常生活的各个环节。Internet的迅速普及，正是依靠不计其数、丰富多彩的网站。网站是由网页按照一定的链接顺序组成。现在有越来越多的人希望在网络上拥有自己的个人主页或个人网站，来展示个人的个性和特点。 同时也有越来越多的企业通过互联网上来展示自身形象，提供服务和产品资讯。以这种廉价的方式获取最大的宣传效果。因此网页制作已经成为现代社
14、会中人们的一种基本功，越来越多的人希望学习如何制作网页，同时越来越多的网页制作工具展现在人们面前。当然掌握所有的网页制作工具是不可能，也是不必要的。网页制作，以及工具之间如何搭配使用，使我们能够快速方便地制作出网页，把人们想了解的信息更便捷的展现给大家。经过一周的时间网页课程设计，我们小组的题目为“电话簿管理系统”基本完成课程设计的要求，基本实现了课程设计要求的所有功能。我主要负责实现网页的功能，通过本次设计使得我们熟悉了Dreamweaver8和SqlServer2000的各项功能，也对也对网页设计与制作有了更进一步的了解，提高了我学习网页的兴趣，以后我会在自己的课余时间多看些此方面的书籍，多做一些这样的小项目，相信通过自己不断的努力，持之以恒，坚持不懈的做下去，自己的动手能力。?从这次设计过程中也使我认识到团结的力量是不可衡量的，团队合作最重要的就是协作，它可以调动团队成员的所有资源和才智，能激发出团体不可思议的潜力，集体协作干出的成果往往能超过成员个人成绩的总和。致谢特别感谢关老师的精心指导，同时感谢组员的配合，才能使本次的设计才能完成参考文献网页设计与制作（第3版）相万让主编电子商务数据库技术（第2版）潘郁主编
