资源简介

《设计首页》教学设计
课题： 设计首页 时间：
教学目标： 知识与技能：
（1）了解首页的概念及首页中包含的元素；
（2）掌握简单网页的新建方法；
（3）能够在网页中插入、排版文字，掌握图片、水平线的插入方法及属性的设置方法，能够灵活应用“网页属性”对话框，设置网页属性，如背景图像等；
（3）掌握保存、预览网页的方法，了解网页保存与普通文档保存的不同点。
过程与方法：
（1）对比教学，使学生掌握学习应用软件的基本方法和规律，达到举一反三的功效；
（2）采用任务驱动，学生或自主探究、或同伴讨论互助，进行设计制作首页的实践活动，从而建立对象属性设置的思维方法和操作方法，为学生今后学习其它软件奠定基础。
情感态度与价值观：
（1）在对比学习中，让学生体验软件学习的一般方法及规律，提高其学习信息技术的信心；
（2）在网站首页的设计和创建的过程中，掌握对象属性的设置方法，初步体验成功的快乐；
（3）通过创建“新桥初中——我成长的乐园”网站，更好地了解学校文化历史与蕴含。 重点：
（1）简单网页的新建与保存；
（2）简单网页的设计方法，如文字、图片以及水平线的插入与编辑等；
（3）设置网页属性的一般方法。
难点：
（1）设置水平线的颜色；
（2）网页背景音乐添加的方法与属性设置。
课前准备：
（1）学习任务单
（2）素材包
（3）教学PPT
（4）学生课前准备：建立站点
板块 任务性问题设计 学生活动设计 反馈交流设计
情境导入 播放配音PPT《脸谱》
Q：脸谱能够准确反映出人物的性格，一个网站的“脸”是什么呢？
说一说
师：本课的任务就是设计网站的“脸谱”，设计制作首页。 观看、思考、同伴交流
师生交流：说说你浏览过的网站的“脸”是什么？
信息准备 1、首页的概念：
首页是指一个网站打开后看到的第一个页面，大多数作为首页的文件名是index、default、main。
2、展示首页样图，分析回答页面中包含了哪些元素？
归纳：首页中一般有如下的对象：
(1) 网站的标题与图片徽标
(2) 网站的宗旨（文字介绍）
(3) 水平线（起分隔作用）
(4) 链接到下一面的标记（可为文字，也可为图片）
强调：网站内容的合理布局。
倾听、圈画关键词

师生交流：当你打开浏览某网站的首页时，你会看到首页中有哪些对象？
初次应用 【过渡】了解首页中一般包含的对象后，我们就要开始设计制作网站的首页了。
任务一：文字元素的添加
1、新建网页，取名为“index.html”；
2、制作首页标题。在“设计”模式中输入标题“新桥初中——我成长的乐园”，字体：华文新魏，大小：65像素（px），颜色：绿色（#009900），居中对齐；
3、添加“学校简介”文字说明。先打开“学校简介.wps”文件，将其文字全部选中－复制，然后再在首页中利用Dreamweaver“编辑”菜单中的“选择性粘贴”命令——带结构的文本以及全部格式（粗体、斜体、样式）进行粘贴。
任务二：水平线的添加
4、插入水平线。将插入点移动到需要插入水平线的位置，单击“插入——HTML——水平线 命令”，完成水平线的插入。利用属性窗口设置高度为2像素，颜色的设置：选中水平线－右击－标签编辑器－浏览器特定的，将颜色设置为绿色（#009900）。 阅读学习任务单
自主实践操作
同伴互助
教师巡视、个别指导

师生交流一：段落首行如何空两格呢？小结：Dreamweaver中进行空格的两种方法。
师生交流二：边操作边保存预览
师生交流三：演示设置水平线的颜色
再次应用 【过渡】光有文字的首页往往不能更好地吸引浏览者，这时就要为它添加一些其它元素，比如图片、音乐等，使得页面图文并茂。
任务三： 图片元素的添加
5、插入网站标志图。将插入点移到标题左端，单击“插入”菜单－“图像”命令，选择站点下“images”文件夹中的“logo.png”图片，并将图片宽、高设置为：100*100，对齐方式：绝对居中。
6、在页面的下端分别插入“xuexiao.png”、“enter.gif”两张图片和“进入下一页”的文字。
任务四：页面背景的添加
7、设置网页背景图片。“属性窗口”－“页面属性”，打开“页面属性”对话框，设置网页背景图像为“bj.jpg”。
任务五：页面背景音乐的添加
8、添加网页的背景音乐。“窗口”菜单－“行为”命令，打开“行为”面板，单击“+”后选择“插入声音”命令，打开“插入声音”对话框，选择背景音乐“jijingzhiyin.mp3”。
属性设置：在页面中选择音乐插件图标，单击“属性面板”－“参数”按钮，将“autostart”参数后面的值由“false”改为“true”。
任务六：保存与浏览网页
9、保存网页。单击“文件”菜单－“保存”或“另存为”命令。
10、预览网页。“文件”菜单－“在浏览器中浏览”－“IE8.0”或按“F12”键。 自主实践操作
同伴交流、互助、 教师巡视、个别指导与辅导
反馈交流：学生代表演示操作如何添加背景音乐。
课堂小结 1、提交作品：以“目录”的形式提交站点
归纳：网页保存与普通文档保存的不同点。
2、评价作品：
强调：网页内容的合理布局。
3、分享收获，体验初次制作网站的成功喜悦，以及深层次地了解学校历史文化与底蕴。 提交作品
自评、互评
分享收获 师生交流：提交“index.htm”网页文件与提交站点两者有何不同？

展开更多......

收起↑