信息技术基础网页制作教学流程.docVIP

网页制作 第1课时　 序 10’ 各班第二单元小组作品展示(4组) 点评 第一环节　欣赏与分析 10’ 欣赏与分析 个人网站 主题研究网站 班级网站 获奖作品 第二环节　网页制作流程 5+5 A　主题\内容\结构 B　建立文件目录结构（站点及其文件夹） C　收集资料\加工处理 (其它软件) D　边学习边制作 (DW) T1: 启动DW,界面,面板,站点 (重点) 学生任务 1. 电子档案袋: 讨论主题(未做!) 2. 确定主题和内容；设计结构；建立站点；收集资料 3. 启动DW,界面,站点 第2课时　学习制作 第一环节　DW软件、界面、面板介绍；建立站点webs 第二环节　建立首页index.htm,用不同视图观看，分析其代码组成 第三环节　网页中的基本元素: 文,图,表 代码 调整 元素整合及技巧 文字 P 属性面板 / 代码调整 字体字色, 字链接 图像 img src=“” 图大小, 图链接, 图文混排 表格 tabletrtd 表格,大小,颜色,边框,背景等 其它 日期 分隔线 [学生任务] 建立首页index.htm，尝试将各种元素插入，观察其不同的代码组成，熟练掌握! 网页标题； 插入文字;文字链接(到图) 二个小图片;图片链接(到flash) 表格;既是布局,也是容器,边框,颜色 . OK! 1 电子档案袋,在讨论区写上你的网页主题,写明需要的资源(如果需要开网,写清网站名称) ?2 设疑：如此混乱，如何处置？ 几点注意: 1. 2. 3. 第3课时　学习布局 : 表格布局：页眉，导航区, 主体，页脚 常用工具栏与布局工具栏 布局工具栏的使用 绘制首页布局 有能力的同学再绘制出第一页的布局,其实copy即可 初试PS: 打开图片,裁切,图像大小,存为网页专用图. 设疑：如何解决无吸引力的问题? …　图片链接？导航菜单？ 第4课时　 创作电子作品――“网页中的图元素” 创作电子作品 主题，建站 　↓ 基本元素 ↓ 布局？ ↓ 网页中的图 PhotoshopCS1 广告条制作 图像加工处理 技术： 裁切； 文字； 图层样式； 画笔； 难点： 层的概念　存盘格式 文章表达思想 文如其人 电子作品 一种信息表达的方式 亦如其人 课前准备： PhotoShop 5/blog/ 5”网页制作” 教学流程 1、前言（7分钟）　　　 从文如其人―――网页亦如其人，认真做好网页作品。 导入3’： 我们大家一起登陆到“电子档案袋”中，参与老师新设置的讨论话题，时间为3分钟，请大家认真表达自己的想法。此处可是“文如其人”。 广播“讨论区”2’：――――网页作为一种表达的形式，只有当它的主题风格颜色布局图文动画等，都和谐统一成为一个整体，才是一个好的作品。不能片面地看待事物。 板书　创作电子作品的流程1’ 2、广播教学（10分钟） 5 “网页制作“－“图与多媒体”， 观看flash 学习PhotoshopCS 首先设计一个简单的广告条2’； 再设计一个原创广告条3’ 存盘 3、学生操作实践（20分钟） 打开PS，选取自己需要的图，进行基本广告条制作，存入站点。 有基础的同学可制作多个。 制作后，插入到网页的相应位置上。 ――使用相关技术，处理你网页中要引用的其它图片，边处理，边制作网页。 4、评价总结（8分钟） 方案一：基本完成，全体上传到档案袋； 方案二：点选上传到FTP 方案三：广播网页成形的学生 　　　 小结：制作过程中出现的问题 总结：技术回顾，重点难点，边制作边调整 　　下节课讲“导航、按钮、翻转图等”，注意收集材料，提前构思！！ 2005－2006学年度第一学期《信息技术基础》第四单元＿＿网页制作 5 网页的主题: 小而精 题材不俗 网页名称与主题相关 网页的风格与创意 广告条,标志 色彩 字体 布局 导航与菜单 NO必须掌握的网页代码标记 html head …… /head body …… /body /html p/p img src=” ‘ table /table 网页制作流程 构思设计,确定主题 布局, 逐页制作,素材处理 图元素及文字元素插入 导航菜单制作;实现链接 修饰:动画,特效等 提问，点评 “德育渗透” “在线交流” 广播教学 学生实践操作 交流 评价 问题小结 重点回顾