云上运维及应用实践教程（第2版）教案4 项目二 任务1 电子商务网站的栏目规划 任务2电子商务网站的主页布局；5 实验二 进行电子商务网站的整体策划；6 项目三 任务1创建网络数据库 任务2SQL语言的使用.doc

教案序号：.

课题

项目二任务1电子商务网站的栏目规划

任务2电子商务网站的主页内容布局

授课形式

√理论□理实一体□实训(验)□其它：

学时安排

本单元总学时：2（其中：理论2学时、实践学时）

教学内容及目标

了解商务网站栏目设计过程，熟悉网站栏目设计结构，掌握商务网站栏目设计的方法和技巧；

了解CSS样式的原理和基本应用，掌握CSS样式设置的基本过程及其相关的属性、方法。

教学重点及难点

重点、难点：网站栏目设计的方法和技巧、CSS样式设置与应用。CSS样式的设置与应用。

授课对象

学情分析

学生接触网站建设的相关内容时间不长，虽然有网页制作的基础，但基础较差，需要在讲授过程中，教师进行巡回指导或同学间小组讨论。

教学媒介

机房

授课

地点

5405

教学设计（可加页）：

一、课前回顾：1、ASP语言原理？

2、asp语言的功能和输出方法？

二、新课内容：项目二任务1电子商务网站的栏目规划

任务2电子商务网站的主页内容布局

任务1电子商务网站的栏目规划

一、任务引出

诸暨市吉尔特机械有限公司是专门从事研发与制造各类机械设备的高新技术企业。本任务以诸暨市吉尔特机械有限公司为例，为了更好地开该公司网站，首先应规划出合适的网站栏目。在本任务中，将引导读者完成诸暨市吉尔特机械有限公司网站栏目规划。

二、任务预览

对于一个公司网站来说，一般需要有顾客（管理员）注册/登录、公司介绍、新闻动态、产品导航、在线订单、招聘信息、产品分类、在线留言、产品/新闻有哪些信誉好的足球投注网站、联系我们等栏目，图2-1即为诸暨市吉尔特机械有限公司网站的基本栏目架构图。

浏览用户

浏览用户

公司主页界面

站点时钟

产品有哪些信誉好的足球投注网站

公司简介

产品导航

新闻动态

在线订单

招聘信息

产品分类

在线留言

必威体育精装版产品

在线调查

友情链接

版权申明

流量统计

用户/管理登录

常见问题

联系我们

三、实践操作

1、确定栏目内容的原则如下：

（1）尽可能删除与主题无关的栏目；

（2）尽可能将网站最有价值的内容列在栏目上；

（3）尽可能方便访问者的浏览和查询。

2、栏目的规划书应该具有统一格式，具体包含以下内容：

第一、栏目概述。其中包括栏目定位，栏目目的，服务对像，子栏目设置，首页内容，分页内容。这一部分起到一个索引的作用，能对栏目有一个大概的整体把握和了解。

第二、栏目详情。

第三、相关栏目。这一项是用以说明本栏目和其它栏目之间的结合，之所以要有这一项是想通过各个栏目之间的联系，来加强网站的整体性。

第四、参考网站。标明本栏目参考了哪些网站，或可以参考哪些网站，并一定要说明参考其它网站的哪些优点，哪些地方是我们在建设过程当中应该注意的，决不是只是写上一个网址就可以了。

第五、附录。用以记录这个文档的历史修改过程和改了哪些内容。

网站栏目规划书是写给我们自己的，不是为了让别人看，而是我们网站在以后的建设过程中的一个依据。有了这个规划书以后，我们可以很轻松解决的具体设计制作工作（包括页面设计，制作，编程）。

根据公司的具体实际情况和信息，结合网站栏目规划的原则与步骤，完成公司网站的栏目规划书，同时完成公司网站的基本栏目架构图。

四、小结

通过以上的任务，学生可以了解网站栏目设计的整个过程，熟悉网站栏目设计结构，掌握网站栏目设计的方法和技巧。

任务2电子商务网站的主页内容布局

一、任务引出

在规划好“诸暨市吉尔特机械有限公司”网站栏目后，接下来就要对网站主页的内容布局谋篇了。目前，网页内容布局的方法基本有三种：表格、框架和层，其中表格是最基本、最直接的布局方式。

在本任务中，将用表格的方式布局“诸暨市吉尔特机械有限公司”网站主页。

二、任务预览

三、实践操作

1、头部文件制作

（1）启动Dreamweaver并打开已定义的“诸暨市吉尔特机械有限公司”动态站点，选择【新建】→【ASPVBScript】命令，新建ASP文档，并命名为“top.asp”。

（2）单击【属性】面板上的【页面属性】按钮，在弹出的【页面属性】对话框中选择【外观】选项，将页面的背景颜色设置成为“#87a1b2”，同时选择【链接】选项，完成【链接】选项相应参数的设置。

（3）选择【标题/编码】选项，完成【标题/编码】选项相应参数的设置。

（4）选择【插入】→【表格】命令，在弹出的对话框中设置表格“行数”为“3”、“列数”为“8”、“表格宽度”先设定为“500像素”，“边框粗细”、“单元格边距”、“单元格间距”均设为“0”。

（5）参数设置完成后，单击【确定】按钮，将表格插入页面中；同时，选择所插入的表格，在【属性】面板中设置对齐为“居中对齐”，合并相关的单元格并适当调整单元格的