《《web基础综合课程设计》课程设计报告.doc》由会员分享,可在线阅读,更多相关《《web基础综合课程设计》课程设计报告.doc(12页珍藏版)》请在金锄头文库上搜索。
1、宁波大红鹰学院信息工程学院课 程 设 计 报 告课程名称:电子商务网站项目名称:项目组长:黄政杰项目成员:郑建楼(美工设计)吴威杰(交互设计)班级名称:10计科4(本)专业名称:计算机科学与技术完成时间:2011-11-20信息工程学院制解决党委自身和基层党支部存在的的突出问题,发挥各村、社区、机关单位党支部在当前城市征迁、园区建设、招商引资、服务群众、维护稳定的作用,我镇党委高度重视,制定了切合临淮实际的活动实施方案,按照中央规定的活动步骤和要求扎实有效的开展了基层组织建设年活动。一、项目需求和背景(一号标题,黑体四号, 段前段后0.5行,表和图要加题注)(正文部分要求宋体,小四,固定行距2
2、0磅,首行缩进2个汉字)介绍项目的开发背景,可以从市场、客户群、目标、定位等介绍,项目需求主要包括功能、技术、性能等需求。(至少400字)二、网站规划设计说明(网站规划设计说明,包括LOGO设计、结构设计、技术方案、内容规划等。)1、网站规划(二号标题,黑体小四号,至少500字,包括主页和各内容页)网站名称:AC商铺网站主题:通过网站宣传,树立商铺形象,提高商铺知名度输入法网站语言:简体中文网站风格:以暖色调为主,给人以家的感觉,主题鲜明突出(顾客之上,服务到家),要点明确,以简单明确的语言和画面体现站点的主题,表现网站的个性和情趣,办出网站的特点。建站内容及特性“海外海宾馆”,作为一个宣传性
3、的企业网站主要是突出它的中心标志性形象,运用现代流行理念和元素,体现出今日海外海网现代不失传统、庄重不失轻松、大众不失前卫的特点。并做好各个栏目的导航,突出网站的重要职能和重要内容,使得网站能够同今日高科技与服务行业完美结合,建成国内一流的宣传型商务网站。(1)首页设计页头:准确无误的标识海外海集团站点和它的企业标志。页面:应是各大栏目导航,最新产品展示,最新供应、求购、代理、合作信息,最新加入会员企业,最新行业资讯,最新展会信息。(2)导航设计导航系统是有效连接网站各处的工具,它有效的分类网站内容并指向它所代表的内容。是通过超文本链接或图片链接,使浏览者能够在网站上自由前进或后退,而不会让浏
4、览者使用浏览器上的前进或后退。海外海网站导航项目:集团概况公司简介发展历程1、海外海荣誉 2、海外海规模 3、董司长寄语 4、联系方法新闻中心主要写集团记事为一个大类进行企业展示,对感兴趣的人可是跟企业进行联系,发送信。人力资源主要公布企业现今的人力规模和最新要招聘的对象。下属企业主要是对海外海企业下属的十一个企业进行介绍。企业信息化主要以集团今日公告、客户留言反馈、友情链接这三个栏目组成。2、结构设计(至少200字,二号标题,宋体小四号, 段前段后0.5行,内容宋小四,单倍行距) 网页布局图(主要给出不同版式页面的布局图)(1)首页图1 首页布局图(2)注册页.图2 注册页布局图(3)登录页
5、.图3 登录页布局图(4)结算页图4 结算页布局图(5)留言页图5 留言页面布局 网站结构图图4 网站结构图3、CI形象设计网站的LOGO是AC()大写的AC与相对应的英文解释,很容易知道这是一个卖电脑配件的网站。4、网站色彩(说明:包括网页主色调、链接色、导航色等,要求通过表格列出页面中需要的颜色表)(1)网站主色调该网站的主色彩是蓝色和浅蓝色,配以棕黄色和少量的白色,文字为黑色和白色,如下图所示:图5 配色采集绿色是一种非常具有亲和力的颜色,它代表的是自然、生命、活力与健康,是使用比较广泛的颜色之一。黄绿色和橙色的使用,则使整个网站显示朝气蓬勃。(2)网页链接色表1 普通文字链接配色表(3
6、)导航链接色(画表格说明)5、技术方案(说明:用到了哪些技术及软件,至少250字)表2 技术方案表序号网站组成使用技术效果说明11、网站所有文字页面2、静态图片3、表格HTML1、 出版在线的文档,其中包含了标题、文本、表格、等内容。 2、 通过超链接检索在线的信息。3、 为获取远程服务而设计表单,用于检索信息、定购产品等。 21、网站动态菜单2、动态图标JavaScript1、 实现在一个Web页面中链接多个对象2、 与Web客户交互作用,而可以开发客户端的应用程序等。31、轻常更新的网页2、动态数据如商品展示,用户信息ASP1、 是一种在WEB服务器端运行的脚本语言,程序代码安全保密 2、
7、 此可以使用ActiveX控件继续扩充其功能 3、 可以轻松的存取各种数据库 适用与各种浏览器4网站内的动态按钮CSS使用CSS的技术,网页便会给人一种赏心悦目、工工整整的感觉,同时字体的色彩变化也使主页变得更加生动活泼。51、 用户资料2、 产品资料3、 产品查询4、 留言信息数据库1、 完善的客户数据资料处理2、 快速的资料查询能力3、未来电子商务的基础三、HTML页面结构图(包括主页、内容页等,不同风格的版面都要给出结构图)图6 HTML页面结构图四、页面DIV结构代码(包括主页和各内容页,注意三与四是一一对应的关系) 五、代码及注释(要求: 包括主页和不同风格内容页CSS代码及JS代码
8、,字体: Times New Roman,字号:五号,行距:1.25倍,)* /通配符的设置,保证页面效果一致margin: 0;padding: 0;border: 0; font-family: 宋体, sans-serif;font-size: 12px;color: #000;body /设置整个页面的背景色及文本的位置background: #CCC;padding-top: 20px;text-align: center;#main /设置最大DIV的背景图像、背景颜色及宽高background: #060 url(site/img/home_main_bg.gif) repeat
9、-x;border: 1px solid #060;margin: 0 auto;height: 500px;width: 770px;六、网站测试结果(要求:页面在FF及IE(7.0以上一种版本)下测试结果,贴图完成,要求测试主页和各内容页,贴图要有各浏览器的标识)1、IE7.0下测试结果图7 IE7.0测试结果2、IE8.0下测试结果。图8 IE8.0测试结果3、FF下测试结果图9 FF测试结果七、项目计划及分工1、项目计划表电子商务网站设计 项目计划表项目组长: 班级: 日期:进程第1次课(11.11.)第2次课(11.13.)第3次课(11.19.)第4次课(11.19.)第5次课(11.19.)第6次课(11.19.)负责人项目计划总体方案效果图设计报告系统测试答辩2、分工完成情况(标注具体工作或书写工作创新的地方) X1: X2: X3:八、总结(要求:必须要有内容,可以是学习总结,可以是体会,可以是技术知识总结,也可以是经验总结等,不能少于600字)附页(源代码附加注释)(包括xhtml代码、JS代码等核心代码,只需要附录在电子稿中,不需要打印,注意排版,Times New Roman ,五号,单倍行距) 翻译服务 网站建设 服务流程 付费