建立主题网站——网页的初步设计与制作

网站的初步设计与制作
教学内容分析
本课内容选自必修第六章和选修第四章，这两个章节内容都有关于网页制作，所以将两章节内容结合在一起讲。

建立一个网站的一般过程也就是信息集成的一般过程，所以设计网站的时候也套用这样的过程，学生从中则可以温故而知新。

教学对象分析
通过前面学习，学生已经熟练掌握信息获取和加工的基本方法，部分学生已经考虑或者已经开始信息集成的操作。

将信息集成以网站的形式来表现，是大多数学生都有所了解并十分向往的。

大多数学生对frontpage的基本操作有所了解（初中已经学过），但对设计网站的方法、过程等都是从未接触过的。

所以本课要站在全局的髙度来把握信息集成的一般过程, 体验网站的设计与制作的一般过程。

一、教学目标
（-）知识与技能：
1、了解网站规划设计的一般方法；
2、掌握一种基于网络进行信息集成的工具（本章以Frontpage 2000为例）的基础操作。

（二）过程与方法：
1、熟悉信息集成的一般过程（选题立意、设计规划、开发制作和评估测试）；
2、能够按照信息集成的一般过程，通过独立或合作的方式完成一个信息集成的作品。

（三）情感态度与价值观：
1、利用精心的设计和制作，使学生感受数字化的美：
2、通过主题鲜明的作品，培养学生正确的人生价值观。

3、通过活动培养学生人际交往和团队协作等方而的能力。

二、教学匝点与难点
1、重点：能够利用表格泄位网页，并能熟练的给网页添加网页元素。

2、难点：熟练运用复杂表格来设计网页布局：把自己的审美观融合到网页设计中去。

三、教学方法：任务驱动，小组合作，自主探究
四、教学过程
（一）、作品导入
在因特网这个信息的海洋当中，我们经常会被一些内容丰富，创意新颖、设计独特的网站所吸引，那今天我们首先就一起来欣赏几个网络作品。

看了这些网络作品，你们觉得它做的怎么样呢？
好在哪里呢？
（欣赏网站，分析网站亮点。

可以从内容、栏目、颜色、画而等进行分析。

）
（广播）那么我们大家想不想自己也来做个网站呢？这一节课我们就一起来学习建立主题网站一一网站初步设计与制作。

（二）、分组讨论
活动一、根据课前分组，对学生完成的作业，讨论网站栏目设计的是否合理？
栏目安排注意以下几个方面：
1、要紧扣主题，尽可能删除与主题无关的栏目。

2、尽可能将网站最有吸引力的内容列在栏目中。

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

（三）、师生交流
1、版而设计
版而结构是指将不同元素巧妙排列的方式，合理的版面结构能够让浏览者淸楚、容易地理解作品传达的信息。

布局就是以最适合浏览的方式将图片和文字排放在页而的不同位宜。

下面我们一起来看一下常见的网页布局有哪几种？
常见的页而布局样式：
“厂”字型：页面顶部为主菜单、横条网站标志和广告条，下方左而为主菜单，右而显示内容的布局。

“口”字型：页面一般上下各有一个广告条，左而是主菜单，右面放友情连接等，中间是主要内容。

自由式：又称POP布局，页而布局像一张宣传海报，以一张精美图片作为页面的设计中心, 菜单栏目自由摆放。

在这些网页布局中，你最喜欢哪种？信息量最大的是哪个样式？下面我们结合一个具体的案例介绍一下版面怎么来布局的。

结合演示文稿，分別给学生展示三种页面布局的网页。

并通过对网页布局的简化，展示简化草图。

2、演示新建站点解释三个概念：
网站：因特网上具有相似性质、共同内容的一组信息资源。

网页：用HTML语言写成的文件，它是组成网站的最基本的元素之一。

主页：通常是表示访问某个网站时岀现的第一个页而。

3、演示表格布局主页
（四）、自主探究
任务一、新建一个站点，站点保存于D盘，名字是网站的主题。

并通过表格布局主题网站的首页。

活动二：每组选择一个操作，自主探究下面的各项操作，并让学生演示。

1、网页中文字信息的插入
2、网页中图像信息的插入：
3、网页背景的设置（背景颜色或背景图片）：
4、网页中背景音乐的插入：
（五）、动手实践
任务二、根据你所选的主题，结合前而内容与栏目的设汁，制作网站主页。

最后保存网页，将作品以作业方式提交。

（提交整个文件夹）
拓展任务：通过表格属性美化表格，设巻单元格及表格的背景颜色或图片。

（六）、作品分享
评讲一两个学生作品，请学生评析作品的优缺点，教师做总评。

五、课堂总结
这堂课，我们站在全局的高度来把握信息集成的一般过程，体验了网站的设讣与制作，这个过程是我们以后处理问题的一个基本方法和思路。

今天我们只是完成了网站作品的首页，在接下来的课程中我们将继续完善我们的作品，完成整个网站的制作。