动态网页设计课程设计指导书.docx

上传人:b****4 文档编号:12098252 上传时间:2023-04-17 格式:DOCX 页数:18 大小:2.64MB
下载 相关 举报
动态网页设计课程设计指导书.docx_第1页
第1页 / 共18页
动态网页设计课程设计指导书.docx_第2页
第2页 / 共18页
动态网页设计课程设计指导书.docx_第3页
第3页 / 共18页
动态网页设计课程设计指导书.docx_第4页
第4页 / 共18页
动态网页设计课程设计指导书.docx_第5页
第5页 / 共18页
点击查看更多>>
下载资源
资源描述

动态网页设计课程设计指导书.docx

《动态网页设计课程设计指导书.docx》由会员分享,可在线阅读,更多相关《动态网页设计课程设计指导书.docx(18页珍藏版)》请在冰豆网上搜索。

动态网页设计课程设计指导书.docx

动态网页设计课程设计指导书

枣庄学院

信息科学与工程学院课程设计任务书

 

题目:

墨学动态网站设计

 

学生1:

王宇(201212230315)

学生2:

刘志伟(201212230308)

专业:

网络技术

课程:

动态网站开发

指导教师:

董希尚职称:

讲师

完成时间:

2013年12月----2014年1月

枣庄学院信息科学与工程学院制

2013年12月20日

课程设计任务书及成绩评定

实验任务:

运用dreamweaver软件和讯实后台做墨学动态网站

实验目的:

通过综合性课程设计题目的完成过程,运用所学动态网站知识,解决生活中遇到的实际问题,达到活学活用,所学所用的目的,进一步理解动态网站的学习目的,提高实际应用水平

 

指导教师签字:

日期:

指导教师评语

 

成绩:

指导教师签字:

日期:

硬件:

win-7系统笔记本

软件:

dreamweaver和讯实后台

 

课程设计进度计划

起至日期

工作内容

备注

13年12月上旬

13年12月中旬

13年12月下旬

收集素材

制定计划方案

设计制作

参考文献、资料索引

序号

文献、资料名称

编著者

出版单位

《网站开发与网页设计》张明清华大学出版社

 

一、课程设计安排

1、设计目的:

Internet在短短的的十几年内,经历了飞速的发展,互联网几乎浪潮席卷了全球的每个角落。

很多企业已经将互联网作为形象宣传、产品推销的主要手段。

因此社会需要大量的网络和网站建设的人才,这给即将踏出校门的计算机专业的毕业生提供了巨大的就业机会。

那么学生能不能把握这些机会,关键就要看学生有没有这样的能力。

为此,信息工程系开设网站建设课程设计,目的就是要使学生在已经学习和掌握相关课程的基础上,将自己的专业知识综合运用,并将其运用于实践中,以努力提高学生在这方面的动手能力。

2、设计目标:

目标是衡量学生是否取得效果的重要标志,这次课程设计的目标就是培养学生具有专业网站初步的规划、设计、制作能力。

具体表现在网站内容、功能、安全等方面合理策划和规划;培养具有主页和二级页面的创意、设计、美工等方面的技术处理能力和具有强大的动态效果制作能力。

培养学生具有基于后台数据库的编程技术,实现客户—服务器端交互式动态网页的制作能力。

3、设计内容:

WEB站点服务器的创建、配置、调试;网页制作三剑客即Deamweaver、Flash、Firework软件的运用,HTML标记语言、JavaScript和VbScript编程;ASP内建对象和可安装组件;SQL-Server数据库的安装与配置;结构化数据库语言SQL等。

4、设计课题:

制作专业性网站,学生可以从以下课题中选择自己感兴趣的课题或者自选课题。

序号

课题

要求

1

企业网站

1、Flash首页1个;2、静态页面制作5幅;3、网站计数器1个;4、产品价格的录入与查询;5、用户的信息反馈;6、管理页面

2

商业网站

1、Flash首页1个;2、静态页面制作10幅;3、网站计数器1个;4、商品价格的录入与查询;5、管理页面;

3

政府网站

1、Flash首页1个;2、静态页面制作5幅;3、网站计数器1个;4、会员注册系统1个;5、留言本一个;6、管理页面;

4

图书网站

1、Flash首页1个;2、静态页面制作5幅;3、网站计数器1个;4、会员注册系统1个;5、图书录入和借阅管理;6、读者意见箱一个;7、管理页面;

5

教育网站

1、Flash首页1个;2、静态页面制作5幅;3、网站计数器1个;4、会员注册系统1个;5、网上考试页面一个;6、管理页面;

6

娱乐网站

1、Flash首页1个;2、静态页面制作10幅;3、网站计数器1个;4、会员注册系统1个;5、影视欣赏页面一个;6、管理页面;

二、课程设计基本工作步骤

要想设计和制作出一个非常出色的网站,必须用心去把握网站建设步骤中每一个环节,基本上可分为以下几个步骤。

1、确定网站的主题、内容、功能;

在网站设计工作之前一定要明确网站的主题(如:

学习、体育、娱乐、慈善、儿童、女性、军事、生活等等),要搞清

楚该网站应该包含哪些方面的具体内容,必须具备哪些功能等;否则就不能做到有的放矢,制作一个出色的网站也就无从谈起了。

如果是设计自己的个人主页,想要获得很高的点击访问率,确定主题一定要注意以下三点:

1、主题要小而精,千万不要面面俱到,否则给人的感觉就是没有主题,没有特色,样样有却样样都很肤浅;2、题材最好是你自己擅长或者喜爱的内容。

比如:

您对足球感兴趣,可以报道最新的战况,球星动态等;3、主题需要创新,换句话说:

也就是要有自己的特色,对于一些已经具有相当知名度的相同题材的网站,你要超过它是很非常困难的。

如果是为他人、企事业单位、社会团体等设计网页,在主题的确定方面同样需要注意以下几点:

1、最好能全面的了解和掌握客户方的背景、文化、业务流程等方面的情况;2、网站主题、内容、功能方面的需求最好由客户方以书面的形式提供;3、对于客户提出的书面报告,每一项都要全面而深刻的理解,及时与客户进行沟通交流,切不可自以为是;这样日后可以少走弯路。

2、网站的整体设计

网站是各个单位、部门在互联网中的门面,一个好的网站能够通过非常出色的整体风格和版式设计将主题鲜明的表现出来;同时,页面看上去还要非常的美观。

在完全了解客户的需求后,就可以进行网站的整体风格和版式设计阶段。

在设计过程中,一定要周到考虑,耐心细致,绘制出相应的草图并附之以说明,从而形成详细而全面的设计文档资料。

网站的整体风格和版式设计完成之后,将设计资料交由客户方审核;对客户提出的意见要做好记录并确定修改方案,经过多次的反复修订后,最终客户满意从而形成定稿,就可以开始下一阶段的工作。

网站的整体风格和版式设计分为以下几个部分:

1、网站板式设计;2、网站的目录结构和导航栏的设计;3、数据库的设计;4、功能设计。

3、网页的详细设计

(1)功能设计:

功能模块的划分

(2)界面设计:

1)整体效果:

区域分配、风格的设计;

2)主界面(留言的显示)的设计:

LOGO的设计标题、功能菜单、客户信息、版权信息显示区;

3)各个子页面的设计

4)后台管理的设计:

如管理员的登录界面、系统资料的修改

(3)数据库设计:

数据库管理系统采用、表结构的建立:

字段名

字段类型

宽度

字段属性

说明

(4)处理过程设计:

第一种方案、第二种方案

4、网站的测试与发布

网站完成后在上传到服务器之前应该在安装不同浏览器的环境中进行测试,测试目的主要是察看:

1、网站是否能够在不同的浏览器下能正常打开(如:

Flash动画、JavaScript程序等);2、测试所有的网页元素是否正常显示(如:

字体、图片、色彩等);3、测试网站中是否存在中断的链接等。

如果以上测试都很正常就可以将整个网站上传到服务器中。

5、网站的更新与维护

网站运行一段时间后,通常会出现以下问题:

1、网页的内容随着时间的推移会过时;2、先前没有发现的问题和不足逐步暴露出来。

所以网站的更新与维护通常是不可少的;更新后的网站同样需要经过测试,然后再上传到服务器中覆盖旧的文件。

三、设计案例(墨学网站管理系统)

1、网站的整体与版式设计

(1)设计主页面(栏目的划分)

(2)二级页面设计

●后台用户登录

后台管理界面

2、站点的目录结构设计

 

注释:

kechengsheji(站点根目录)、admin(后台管理程序)、CSS(CSS样式表文件)、database(后台数据源与数据库)、images(网页中的插图与动画)、bottom.asp(页面的版权区域)、conn.asp(数据库的链结程序)、firstpage.asp(主页中的内容页面)、head.asp(页面中标题部分页面)、index.asp(网站主页)、show_news.asp(新闻栏目)。

3、程序实现(部分代码)

DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http:

//www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">

xmlns="http:

//www.w3.org/1999/xhtml">

墨学网站墨学网站-PoweredbyASPCMSV2

src="/Templates/cn/images/log.gif">

height=92useMap=#Map>

coords=230,2,130,34

onclick=javascript:

setHomepage()>

addCookie()shape=rect

coords=370,2,260,34>

functionaddCookie(){ //加入收藏

if(document.all){

     window.external.addFavorite(''贵州陈酱世家酒业有限公司');

   }elseif(window.sidebar){

     window.sidebar.addPanel('贵州陈酱世家酒业有限公司','',"");

   }

}

functionsetHomepage(){ //设为首页

if(document.all){

  document.body.style.behavior='url(#default#homepage)';

  document.body.setHomePage('

}elseif(window.sidebar){

 if(scape){

  try{

      netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");

  }catch(e){

   alert("该操作被浏览器拒绝,假如想启用该功能,请在地址栏内输入about:

config,然后将项signed.applets.codebase_principal_support值该为true");

  }

 }

 varprefs=Components.classes['@mozilla.org/preferences-service;1'].getService(Components.interfaces.nsIPrefBranch);

 prefs.setCharPref('browser.startup.homepage','

}

}

both">

width=968height=43useMap=#Nav>

href="/"shape=rectcoords=23,3,97,42>

href="/about/?

19.html"shape=rect

coords=140,3,238,42>

1_1.html"

shape=rectcoords=282,3,382,42>

href="/list/?

5_1.html"shape=rect

coords=422,3,518,42>

107.html"

shape=rectcoords=565,3,660,42>

href="/gbook/?

18_1.html"shape=rect

coords=706,3,799,42>

href="/about/?

109.html"shape=rect

coords=842,3,935,42>

src="/Templates/cn/images/focus-1.2.0.full.js">

hidden"id=indexad>

varswf_width='908';

varswf_height='220';

varconfigtg='0xffffff:

文字颜色|2:

文字位置|0x000000:

文字背景颜色|30:

文字背景透明度|0xffffff:

按键文字颜色|0x4f6898:

按键默认颜色|0x000033:

按键当前颜色|8:

自动播放时间|3:

图片过渡效果|1:

是否显示按钮|_blank:

打开新窗口';

varfiles='/upLoad/slide/month_1312/201312272022503373.jpg|/upLoad/slide/month_1312/201312272023297488.jpg|/upLoad/slide/month_1312/201312272023476451.jpg|/upLoad/slide/month_1312/201312272024052595.jpg|/upLoad/slide/month_1312/201312272024217789.jpg';

varlinks='#|#|#|#|#';

vartexts;

document.write('

d27cdb6e-ae6d-11cf-96b8-444553540000"codebase="width="'+swf_width+'"height="'+swf_height+'">');

document.write('');

document.write('');

document.write('');

document.write('

19.html">

src="/Templates/cn/images/more.gif">

left;HEIGHT:

150px"class=gycjL>

style="WIDTH:

109px;HEIGHT:

132px"alt=""align=left

src="/Templates/cn/images/20120323134159_71226.jpg"width=115height=127>

12pt">       第一个阶段是兴盛时期,指的是先秦时期。

这个时期儒墨争鸣,墨家成员众多。

《吕氏春秋·当染篇》记载:

“孔墨皆死久矣,从属弥众,弟子弥丰充满天下。

”《孟子 滕文公下》载,因“世衰道微,邪说暴行有作”故“孔子俱,作《春秋》。

”庄子眼中世衰道微的表现是怎样的呢?

他接着说:

 

1_1.html">

src="/Templates/cn/images/more.gif">

both">

155px"id=demo1vAlign=top>