网页布局教案
第六章网页布局 教学目标： 知识与技能： n 常用的网站结构式 n 网页设计（结构式的应用） 1. 使用Photoshop制作网页框架 2. 使用Dreamweaver制作网页框架 情感态度： 随着人类文明的不断进步，社会化大生产时代将作为人类社会的最终形式而存在，个人英雄主义的时代早已经结束，合作意识对社会的发展至关重要。合作是一种能力，更是一种艺术。唯有善于与人合作，才能获得更大的力量，争取更大的成功。现代社会，分工细化，竞争激烈，只有通过小组合作的力量，才能最大限度地实现自己的价值，创造辉煌的人生。 教学重点： n 会使用结构式制作网页 教学难点： n 会使用Dreamweaver制作网页框架 教学方法： 讲授法、演示法 教学课时： 1课时 教学过程 回顾上章内容 v 色彩的象征意义有哪些？（红色、蓝色） 喜庆、幸福、鲜血、战争、危险、狂热 v 色彩的感觉有哪些 冷暖、轻重、进退、兴奋与沉寂 课程导入 通过以下几个网页大家看看它在布局上有什么特点？ 一、常用的网站结构式 在网站中，网页的框架结构就是网站的骨架，是基础。下面来讲解几种常用的网站结构式。 v 上下结构式：结构比较开阔，大的面积可以充分展示网站的形象图片，但由于栏数少，容易给人没有气势的感觉。 网页上下结构式的两种表现形式 来看一下相关的网页实例 v 左右结构式：清晰分列两旁的结构式。一般左侧放置导航，最上边放公司的logo；右侧是正文、内容部分或者企业形象展示。左右结构式和上下结构式一样，常被用于企业网站。 网页左右结构式的两种表现形式 来看一下相关的网页实例 v 上左右结构式：下方两栏的宽窄营造的网站气氛不同。图中均为上左右结构式，但人们浏览网站时，首先看到其中的信息最重要的（用灰色标注）部分。它和左右、上下结构式不同的是：信息相对丰富。 网页上左右结构式的表现形式 来看一下相关的网页实例 v 上左中右结构式： 和上左右结构式相比，上左中右的信息容量更大，一般门户网站多采用这种结构式。但这种结构容易是页面拥挤，看起来比较繁杂。 网页上左中右结构式表现形式 来看一下相关的网页实例 课堂提问 大同一职中网站布局用了哪种结构式？ 上左右结构式 二、 网页设计（结构式应用） v 用所学结构式制作网页（使用photoshop制作） 根据所给出的素材，拼出一幅上左中右结构式的.网页。（用以前学到的ps知识） v 使用Dreamweave软件实现网页的结构式 操作步骤分析 3 2 4 1 操作重点： 插入表格：crtl+alt+t 边框颜色：选中边框 属性面板 边框颜色 背景图片：自动重复 页面属性：文字大小 文本颜色 课堂提问 v 网页的布局可以用什么软件来实现？： Photoshop、dreamweaver v 本章所讲网页框架结构式有哪些？ 上下结构式、左右结构式、上左右结构式、上左中右结构式 n 网页结构式的综合应用（下节课详细讲解） v 网页结构在单个页面中的综合应用 v 网页结构在整个页面中的综合应用 课堂小结： v 掌握所学结构式制作网页 v 会用所学结构式制作网页 v 会使用phtotshop、dreamweaver制作网页 作业： 运用你们今天所学的知识，设计我们一职中的网页。 教学反思： 板书设计： 一、 常用的网站结构式 1.上下结构式 2.左右结构式 3.上左右结构式 4.上左中右结构式 二、 网页设计（结构式的应用） 1.使用Photoshop制作网页框架 2.使用Dreamweaver制作网页框架【网页布局教案】相关文章：
常见的网页布局设计模式01-15
网页布局排版的部分技巧10-31
古老的网页设计布局 -电脑资料01-01
在Frontpage中用框架实现网页布局 -电脑资料01-01
瀑布流布局浅析网页设计 -电脑资料01-01
完美三栏网页布局例子 -电脑资料01-01
关注各网站的布局调整网页设计 -电脑资料01-01