1、网站首页的布局教学目标:明确网站布局的一般原则根据原则修改网站首页教学重点:理解并运用网站首页的一般规则教材分析:教材中利用表格的方式列举了几种常见的样式,如厂字型、口字形、自由式。根据主题,选择那种样式,为什么要采用这种样式,学生不能很好的理解。而且容易固化学生的思维。教学过程:上节课我们一起开始研究网站首页面的设计和制作,请大家回忆一下首页面上有哪些基本组成元素?有了这些元素,可以开始考虑布局了,这些元素在页面上该如何摆放呢?大家已经开始尝试去做了,下面我们来看看做的情况。 (师生共同浏览作业,呈现两个例子)对于这两份作业,可能大家都有一些自己的想法,我们先不急着说,等我们今天学习完了以后
2、再作评价。课后,请每个同学任选一个专题网站,对网站的首页面各基本组成元素的位置进行了分析。每个人看到的页面是有限的,那我汇总了一个班的情况。看看根据这些数据,你能得出些什么结论?根据数据,大家可以总结一下,一般情况下:1、 网站的名称一般(上、左上)主题地位重要,要突出显示,这个位置是我们比较容易看到的,是很醒目的位置。2、 栏目一般放在中间偏上或左边偏上用户通过栏目访问网站里面的内容,要方便用户去点击。3、 友情链接一般放页面的靠下方的位置,因为它相对栏目显得不重要,不是你网站里提供的主要内容。4、 版权信息一般放在页面的最下方。因为它对于浏览者来说是最不重要的内容,但对于网站的作者来说却是
3、不可缺少的东西。所以放在最不重要的位置。5、 其他的空白处网站的推荐栏目及主要内容,一般不会有大篇幅的文字出现。第一个原则:重点突出展示学生作品用原则一分析,我们的首页面布局不仅仅要做到重点突出,还要注意图片的大小合不合适,左右文字图片是否对称?视觉效果上看是否谐调这就是我们的第二个原则:平衡谐调。展示学生作品,首页和分页面对比,总结第三个原则风格统一练习:学生根据这三个原则修改自己的首页。根据完成情况作适当点评。总结:我们浏览的网站中大部分都是我们看到的规则布局形式,当然也有不规则的,比如我们少部分数据反映的特例网站:“”的页面形式,这样的布局相对比较自由,这样的页面因为有自己的独特魅力,所
4、以在网上尤其吸引我们的眼球。希望大家能够不拘一格,大胆创新。当然不管什么样的布局,依旧需要遵循我们提出的原则:重点突出、平衡谐调,风格统一。附调查图表:020406080网 站 名 称 的 位 置 60 80 30 10 0 3 20左 上 上 右 上 左 中 右 其 他020406080栏 目 列 表 的 位 置 60 80 30 70 0 3 5左 上 上 右 上 左 中 右 其 他020406080友 情 链 接 的 位 置 60 80 30 10 0 3 20左 下 下 右 下 左 中 右 其 他020406080100版 权 信 息 的 位 置 10 90 9 0 0 3 1左 下 下 右 下 左 中 右 其 他