WEB基础综合 课程设计.docx
《WEB基础综合 课程设计.docx》由会员分享,可在线阅读,更多相关《WEB基础综合 课程设计.docx(15页珍藏版)》请在冰豆网上搜索。
WEB基础综合课程设计
宁波大红鹰学院信息工程学院
课程设计报告
课程名称:
Web基础综合课程设计
项目名称:
项目组长:
沈奇乐(页面设计)
项目成员:
汪坚坚(美工设计)韩晓斌(交互设计)
班级名称:
10计科3
专业名称:
计算机科学与技术
完成时间:
信息工程学院制
一、项目需求和背景
我们网站主要经营鲜花买卖,附带花束的包装,预订和运送。
由于我们主要经营中高档鲜花,价格偏高,所以消费的主体定位为白领阶层。
随着国内人均收入的增加,人们越来越追求高品质的生活,鲜花作为人与人之间情感交流的工具越来越受到人们的喜爱,尤其是收入较高的人群。
但是往常送花都要到花店订购,不但浪费时间而且麻烦,网购就没有这样的麻烦。
由于国内大型的鲜花交易网站很少,大多数时候都是一些交易网站交易,缺少包装或者包装没有个性,缺乏创意。
而我们则致力于创造一个专业的鲜花交易网站,面向国内庞大的消费群体,让人们可以简单方便的订购自己喜欢的花束,另外我们网站还提供鲜花个性包装服务,客户可以根据自己的要求包装花束。
国内鲜花交易网站很少,也就意味着我们的网站拥有很大的市场前景和较少的竞争。
而为了突出我们的特色,我们网站实行全国连锁,保证花朵的新鲜。
二、网站规划设计说明
1、网站规划
网站名称:
缘来缘
网站主题:
通过网站做到鲜花的交易
输入法网站语言:
简体中文
网站风格:
网站主体以白色为背景,辅以粉色和绿色,以简洁清爽为主体,凸显产品特色,网站内容介绍文字以黑色为主调,简洁明了,网站的修饰也也以简单为主,不奢华,不浮夸,总体给人一种诚信可靠的感觉。
建站内容及特性
作为鲜花交易网站,由于实行全国送花机制,所以网站实行会员机制,支持支付宝财付通支付,可以使用各大银行账户直接付款。
国内各大城市免邮费,网站实行积分制。
会员可以使用积分兑换活动产品或抵现金使用。
网站运用运用流行元素,体现新颖的花束包装,提倡个性,并为客户提供专门的花束包装建议,使客户可以得到独一无二的花束。
(1)首页设计
页头:
以粉色为主的背景色加上醒目的LOGO以及客服电话和会员登录口。
页面:
主要以热销产品的照片和价格为主,上方为各大栏目的导航和最新产品的推荐,右面为“心情故事”,“订单查询”,“送花相关”三个栏目,下方为网站的最新动态,最下方为网站相关,是新会员也可以方便的订购。
(2)导航设计
导航系统是有效连接网站各处的工具,它有效的分类网站内容并指向它所代表的内容。
是通过超文本链接或图片链接,使浏览者能够在网站上自由前进或后退,而不会让浏览者使用浏览器上的前进或后退。
网站导航项目:
☉新手上路
主要教授新用户订购方式
①如何订购
②订购流程
团购问题
☉支付方式
主要介绍付款的方式,方便用户付款。
付款方式
相关问题
补交花款
☉送货服务
主要介绍送货的相关事宜。
送货范围
送货说明
地区查询
☉售后服务
主要针对已售出花束进行售后处理和投诉。
投诉说明
发票问题
保鲜方法
☉其他
常见问题
祝福参照
推荐分成
2、结构设计
网页布局图(主要给出不同版式页面的布局图)
(1)首页
图1首页布局图
(2)内容页1….
图2内容页1布局图
(3)内容页2….
图3内容页1布局图
(3)内容页2….
图3内容页1布局图
Ø网站结构图
图4网站结构图
3、CI形象设计
(说明:
LOGO如何设计,体现了些什么用意或是用到了什么技术等,至少100字)
4、网站色彩
(1)网站主色调
该网站以白色为主调,配以粉色和少量绿色,文字为黑色。
如下图所示
图5配色采集
白色是一种十分简洁的颜色给人一种干净简洁的感觉,配以暖色系的粉色和少量的绿色装点,鲜明突出又不失简洁。
(2)网页链接色
表1普通文字链接配色表
(3)导航链接色
(画表格说明)
5、技术方案
表2技术方案表
序号
网站组成
使用技术
效果说明
1
1、网站所有文字页面
2、静态图片
3、表格
HTML
1、出版在线的文档,其中包含了标题、文本、表格、等内容。
2、通过超链接检索在线的信息。
3、为获取远程服务而设计表单,用于检索信息、定购产品等。
4、在文档中直接包含电子表格、视频剪辑、声音剪辑以及其他的一些应用。
2
1、网站动态菜单
2、动态图标
JavaScript
1、实现在一个Web页面中链接多个对象
2、与Web客户交互作用,而可以开发客户端的应用程序等。
3
1、轻常更新的网页
2、动态数据
如新闻中心,汽车展示
ASP
1、是一种在WEB服务器端运行的脚本语言,程序代码安全保密
2、此可以使用ActiveX控件继续扩充其功能
3、可以轻松的存取各种数据库
适用与各种浏览器
4
网站内的动态按钮
CSS
使用CSS的技术,网页便会给人一种赏心悦目、工工整整的感觉,同时字体的色彩变化也使主页变得更加生动活泼。
5
1、产品资料
2、新闻资料
3、产品查询
数据库
1、完善的客户数据资料处理
2、快速的资料查询能力
3、未来电子商务的基础
6
1、主要动画
2、动态图标
Flash
1、以极富吸引力的动画吸引浏览者停留
2、增强网站感染力
三、HTML页面结构图(包括主页、内容页等,不同风格的版面都要给出结构图)
图6HTML页面结构图
四、页面DIV结构代码(包括主页和各内容页,注意三与四是一一对应的关系)