WEB基础综合 课程设计.docx

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结构代码（包括主页和各内容页，注意三与四是一一对应的关系）