生活保健-乌啼隐杨花

《网站设计》教学设计
本节内容为教育科学出版社普通高中课程标准实验教科书《网络 技术应用》（选修）
第四章“建立主题网站”的第二节“网站设计”，我主要介绍栏目设置和版面设计， 并安排学
生根据自己的主题进行设计。

【教学分析】
一、教学重点及难点分析
本节的重点有：栏目设置。本节的难点是：树立网站整体风格。
二、教学目标分析
1、知识目标：让学生了解网站建设的前期准备工作；学会如何设计好一个网站。
2、能力目标：提高学生分析能力、探究能力、组织能力。
3、情感目标：增进班级集体荣誉感，团队合作理念以及同学友谊。
4、价值目标：培养学生自信心及个性化发展。

【教学资源】
1、硬件：多媒体网络电脑室；软件：安装Macromedia Dreamweaver 4、Microsoft FrontPage
等网页制作工具。
2、准备好设计表格发学生（电子）。
【教学过程设计】
一、引入
打开 几个不同类型的优秀网站，让学生欣赏，学生分组讨论网站的设计风格、整体规
划、素材的运用、颜色的 运用等特点，引发学生兴趣，并指出其实这些网站我们都能制作，
并有可能比它们做得更好，增加学生学 习网站的信心。
[教师] 同学们，上节课你们已经确定了专题网站的主题，这节课我们就来完成网站 的
设计，那么下节课，你们就可以开始动手来制作网站了。
让学生对这个网站栏目进行分析
表4－7 “机器人做学玩”网站栏目设置
栏目名称
机器人博览
子栏目名称
成长历史
动态关注
机器人概述 各家定义

分门别类

机器人文化

人机互动

浮想联翩
内容描述
回顾机器人的发展历史，
关注机器人的未来发展趋
势
介绍对机器人的各种定
义，展示目前机器人的几
大种类
展现人类关于机器人的种
种联想，机器人与人类的
共同发展

机器人比赛 群雄逐鹿

设计制作

站点内服务 网站地图

版权申明

论坛

留言板


介绍近年来的机器人制作
赛事和机器人制作的成功
案例

方便访问者的浏览，给浏
览者留出发表自己意见的
空间
这个网站按什么进行分灯的，它的栏目到底有多少？然后完成自己小组的栏目设置：
4.2网站栏目设计
根据小组的网站主题和内容，对网站的栏目进行设计。
网站主题：
栏目名称












子栏目名称






内容描述
（教师组织学生讨论，并让小组回答，每小组回答完后教师都作点评。）
二、版面设计 [教师]上网冲浪，会有大量的网页掠过我们的眼帘，但是能够吸引我们眼球的只有那
些有特色的网 页，大量的网站引不起网民的兴趣，访问者寥寥无几，究其原因，网站内容
是否丰富是其中一个方面，而 网页的版面设计是否精美也是重要的因素之一，版面结构是
指一种能够让浏览者清楚、容易地理解作品传 达的信息的东西，通俗地讲，也就是将不同
元素巧妙排列的方式。布局就是以最适合浏览的方式将图片和 文字排放在页面的不同位

置。讲解常用的几种页面布局样式：“厂”字型，“口”字型， 自由式。
“厂”字型：页面顶部为主菜单以及横条网站标志＋广告，下面左面为主菜单，右面
显示内容的布局。优点：页面结构清晰，主次分明；缺点：呆板，如果细节色彩上不注意，
容易“看之无 味：。
“口“字型：页面一般上下各有一个广告条，左面是主菜单，右面放友情链接等，中
间 是主要内容。优点：充分利用版面，信息量大，与其他页面的链接多，切换方便；缺点：
页面拥挤，不够 灵活。
自由式：又称为POP布局，页面布局像一张宣传海报，以一张精美图片作为页面的设
计中心，菜单栏目自由摆放。优点：漂亮、吸引人，适宜于艺术类网站；缺点：显示速度
慢文字信息量少 。
（教师要让学生广开思路，可小组讨论，也可一对一讨论，教师要明确指出需要分析
与网站 主题的关系。）
三、树立网站整体风格
网站标志如同商标一样，看见标志就让大家联想起你的网站。
标准色彩
标准字体
收集素材
四、学生评价
每个小组的规划表都要上台展示给其它小组，让大家评 价，小组成员可根据评价结果
完善最终网站规划表。
五、教师评价小结
教师对 各小组网站规划表进行评价，同时指出优缺点。明确各小组的规划要在年级内、
班级内进行打分比赛，要 求学生最终完善网站规划表。并把本班优秀的规划表张贴在电脑
室公示栏，让学生自己去评价。
对这节课进行总体小结。指出这节课学生学习状态、讨论参与度、纪律情况等，评价
学生的优缺点，主 要是鼓励学生对制作网站增强信心。
【课余练习】
教师提供一些优秀网站地址给学生上网进行比较参考，进一步完善设计。