我们的目标：完成一个电子商务网站—— 绿精灵植物网

我们的目标：完成一个电子商务网站——绿精灵植物网

我们的目标：完成一个电子商务网站——绿精灵植物网

我们的准备工作

• 电子商务网站设计规划书– 网站功能分析– 网站设计风格构思– 网站结构图– 网站首页、二级页面、三级页面、后台管理布局图（草图）– 网站数据库设计– 网站目录文件设计

• 网站首页、二级页面、后台页面美工图• 网站 LOGO 、导航条、横幅的 FLASH• 网站素材的搜集

如何完成我们的网站？如何完成我们的网站？

由美工图制作完成网站的首页和二级页面

• PS 切片注意点：– 根据网页布局的需要切成大块，存储为 web 和设备所用格式—— html

和图像– 注意给重点切片取名字– 切大块时，一些无关图片需隐藏– 用作超链接或者网页内容的图片单独保存（可以进行二次切片、或者复

制组、复制图层），二次切片时，存储为 web 和设备所用格式——仅限图像

配置站点

• 组长：配置 IIS—— 网站和 Ftp 站点，注意 FTP 站点设置为写入

• 配置 DW—— 配置本地信息和测试服务器• 组员：配置 IIS—— 网站• 配置 DW—— 配置本地信息、远程信息和测试服务器• 由组员通过 FTP 将网站文件实现上传、下载和同步• 由组长收集完成网站后，上交作业

静态页面的制作

• 由切片生成的网页需将一些图片设置为背景，注意设置单元格的宽度和高度

• 由于切片直接生成的网页容易变形，可以重新用表格布局• CSS 样式的设置

– body,td,input,div—— 设置字体大小– a:link,a:visited– a:hover,a:active—— 设置普通超链接– .title1—— 设置标题文字样式（加粗、颜色、大小）– .content—— 设置主体内容文字样式（行间距、首行缩进）– .line—— 设置各种线条，如 .linetop .linefoot .lineleft .lineright .box 等– 特殊超链接用“类”或者“高级”设置，用类设置的 CSS 样式需应用；

用“高级”设置的样式需给使用对象取名字

静态页面的制作

• 模板的制作和应用– 模板可以直接新建，或者由普通网页另存为– 模板必须有可编辑区域，此区域不能填满– 其他页面可以应用模板，在可编辑区域填写自己的特殊内容

• 服务器包含的应用– 将网站中公共的部分分别制作单页保存– 将单页面 <body></body> 内部代码保留，其余删除– 在需要用到的页面中布局，并包含公共部分

• 后台管理框架网页的制作– 一般使用“上方固定，左侧嵌套”布局，产生四个网页– 注意框架网站的超链接目标

spry

• spry– Spry 框架是一个 JavaScript 库， Web 设计人员使用它可以构建能够

向站点访问者提供更丰富体验的 Web 页。有了 Spry ，就可以使用 HTML 、 CSS 和极少量的 JavaScript 将 XML 数据合并到 HTML 文档中，创建构件（如折叠构件和菜单栏），向各种页面元素中添加不同种类的效果。在设计上， Spry 框架的标记非常简单且便于那些具有 HTML 、 CSS 和 JavaScript 基础知识的用户使用。

• spry 的使用– spr 面板——插入系统自带内容– 修改内容– 修改 CSS

作业 1

• 首页、列表页、内容页的制作– 首页、商品列表页、商品信息页的制作——必做– 将商品页另存为模板备用（或者用服务器包含也行）

• 完成《电子商务网站规划书》并打印上交——必做• 初步完成网站的数据库——必做

作业 2

• 首页、列表页、内容页的制作– 新闻列表页、新闻内容页的制作– 将新闻页另存为模板备用（或者用服务器包含也行）

• 后台管理框架网页的制作– 应用框架网页完成后台首页– 在后台左侧列出管理员管理的模块

根据小组职责表完成网站的相关功能

• 数据库的连接– “provider=Microsoft.JET.OLEDB.4.0;Data

Source=”&Server.MapPath(“ 数据库相对于网站根目录的路径” )

• 记录集的新建、绑定、重复• 转到详细页• 数据库的增、删、改• 用户身份验证（登录、注销、限制对页的访问、检查新用户

名）

小组提交作业示范、演示、评分小组提交作业

示范、演示、评分

我们的目标：完成一个 电子商务 网站—— 绿精灵植物 网

Documents

我们的目标：完成一个电子商务网站—— 绿精灵植物网