网页模板的应用教学设计

合集下载

《制作网页》教学设计(精选5篇)

《制作网页》教学设计(精选5篇)

《制作网页》教学设计(精选5篇)《制作网页》教学设计1教学目标:1、知识与技能(1)了解超级链接的含义及链接源和链接目标的含义,掌握同一站点内以及不同站点间网页超级链接的创建方法。

(2)掌握网页内书签的作用及创建书签链接方法,掌握交互式按钮、框架网页内超级链接的设置方法。

(3)理解热区链接的含义及创建方法。

2、过程与方法(1)通过创建网页超级链接的操作,使学生了解网页中创建超级链接的基本方法,破除对网页链接的神秘感。

(2)通过对不同对象设置超级链接的操作,使学生总结出操作的规律,培养学生自主学习与操作的能力。

(3)通过网页不同的超级链接方法,拓展学生思维,创建多种形式的网页链接。

3、情感态度与价值观(1)通过链接我国主要自然保护区网页,激发学生热爱祖国、热爱自然、热爱生命的激情。

(2)完成超级链接,使学生感受成功的喜悦和快乐。

教学重、难点:1、教学重点:(1)超级链接的含义及链接源和链接目标的含义。

(2)超链接的制作方法——给文字、图片制作超链接,制作书签链接,给交互式按钮制作超链接,框架页面内的超链接,图片区域制作超链接等。

2、教学难点(1)书签链接中名称及对应链接位置的设定。

(2)在框架页面中制作超链接时,目标对象所选择的显示窗口形式。

教学方法与教学手段:任务驱动法、讨论探究法、讲解与演示法、类比知识迁移法。

教学准备:"动物——人类的朋友"站点,包括未链接的网页,如欢迎页、表格页、框架页,表单页等。

教学过程:1、引入展示两个主页,一个已经创建了链接,一个没有创建链接,让学生进行比较并找出区别,引出本课课题——超级链接。

提出:我们在先前的学习中,哪个软件中的相关操作与它类似?什么是超级链接?找一个例子,分析链接源和链接目标分别是什么?学生展开交流,通过对比找出不同点,并积极思考,回答老师的问题。

设计意图:通过对比操作、交流,再辅以知识迁移,明确本节课教学内容。

2、新授(1)站内超级链接引导学生回顾PowerPoint中超链接的制作方法(教师提示:右击链接源,利用快捷菜单制作超链接),辅以教材中的内容,让学生自行探究并完成以下操作:任务1同一站点内不同页面之间的链接1制作首页(欢迎页)到表格页的超链接。

《网页设计与制作》课程教案

《网页设计与制作》课程教案

《网页设计与制作》课程教案一、教学目标1. 了解网页设计与制作的基本概念和流程。

2. 掌握HTML、CSS和JavaScript的基本语法和应用。

3. 能够独立设计并制作一个简单的网页。

二、教学内容1. 网页设计与制作的基本概念和流程。

讲解网页设计与制作的基本概念,如网页、网页设计、网页制作等。

介绍网页设计与制作的流程,包括需求分析、页面布局、页面设计、编码实现等。

2. HTML的基本语法和应用。

讲解HTML的基本语法,如标签、属性、注释等。

通过实例演示HTML在网页中的应用,如、段落、图片、等。

3. CSS的基本语法和应用。

讲解CSS的基本语法,如选择器、属性、注释等。

通过实例演示CSS在网页中的应用,如字体样式、颜色、布局等。

4. JavaScript的基本语法和应用。

讲解JavaScript的基本语法,如变量、运算符、注释等。

通过实例演示JavaScript 在网页中的应用,如动态修改内容、响应用户事件等。

5. 设计并制作一个简单的网页。

根据所学知识,设计并制作一个简单的网页,包括页面布局、页面设计、编码实现等。

三、教学方法1. 讲授法:讲解基本概念、语法和应用。

2. 演示法:通过实例演示HTML、CSS和JavaScript在网页中的应用。

3. 实践法:学生动手实践,设计并制作一个简单的网页。

四、教学环境1. 教室环境:多媒体教学设备、网络连接。

2. 软件环境:文本编辑器、浏览器、网页设计软件。

五、教学评价1. 课堂参与度:学生参与课堂讨论、提问和回答问题的情况。

2. 课后作业:学生完成课后作业的情况,包括网页设计作品的质量和完成时间。

3. 期末考试:考查学生对网页设计与制作的基本概念、语法和应用的掌握情况。

六、教学资源1. 教材:《网页设计与制作教程》2. 辅助材料:PPT课件、实例代码、教学视频3. 网络资源:在线教程、相关论坛、网页设计素材库七、教学安排1. 课时:共计32课时,每课时45分钟2. 课程安排:第1-4课时:网页设计与制作的基本概念和流程第5-8课时:HTML的基本语法和应用第9-12课时:CSS的基本语法和应用第13-16课时:JavaScript的基本语法和应用第17-20课时:设计并制作一个简单的网页3. 课后作业:每课时布置相应的课后作业,巩固所学内容八、教学策略1. 针对不同学生的学习基础,调整教学进度和难度,确保学生能够跟上课程节奏。

初中网页设计教案

初中网页设计教案

初中网页设计教案教学目标:1. 让学生了解网页设计的基本概念和流程。

2. 培养学生运用HTML和CSS进行网页设计的能力。

3. 引导学生运用创意思维和审美观念,提高网页设计的美观度和实用性。

教学内容:1. 网页设计基本概念和流程。

2. HTML和CSS的基本语法和应用。

3. 网页设计实例分析和实践。

教学过程:一、导入(5分钟)1. 教师通过向学生展示一些精美的网页,引起学生对网页设计的兴趣。

2. 教师简要介绍网页设计的基本概念和流程,让学生对网页设计有一个整体的认识。

二、基本概念和流程(10分钟)1. 教师讲解网页设计的基本概念,如网页、网站、HTML、CSS等。

2. 教师介绍网页设计的流程,包括需求分析、设计稿、HTML编写、CSS样式设置、测试和发布等步骤。

三、HTML和CSS的基本语法和应用(10分钟)1. 教师讲解HTML的基本语法,如标签、属性、注释等。

2. 教师讲解CSS的基本语法,如选择器、属性、注释等。

3. 教师通过示例,演示如何使用HTML和CSS创建一个简单的网页。

四、网页设计实例分析和实践(10分钟)1. 教师展示一个精美的网页设计实例,分析其设计思路和技巧。

2. 教师指导学生动手实践,尝试仿造示例网页进行设计。

3. 教师巡回指导,解答学生遇到的问题,提供建议和改进意见。

五、创意思维和审美观念(5分钟)1. 教师讲解如何在网页设计中运用创意思维,提高网页的个性化和独特性。

2. 教师讲解网页设计的审美观念,如色彩、布局、字体等。

3. 教师鼓励学生发挥创意,注重审美,提升网页设计的作品质量。

六、总结和作业布置(5分钟)1. 教师对本节课的内容进行总结,强调重点和难点。

2. 教师布置作业,要求学生课后练习网页设计,巩固所学知识。

教学评价:1. 学生能掌握网页设计的基本概念和流程。

2. 学生能运用HTML和CSS进行简单的网页设计。

3. 学生的网页设计作品具有创意思维和审美价值。

教学反思:本节课通过讲解网页设计的基本概念和流程,让学生了解网页设计的方方面面。

大学网页设计与制作教案

大学网页设计与制作教案

课程名称:网页设计与制作授课教师: [教师姓名]授课班级: [班级名称]授课时间: [具体时间]课时安排: 2课时教学目标:1. 知识目标:- 了解网页设计的基本概念、原则和流程。

- 掌握HTML、CSS和JavaScript的基本语法和常用标签。

- 熟悉网页布局技术,如Flexbox和Grid。

- 学习使用常用的网页设计工具,如Dreamweaver、HBuilder等。

2. 能力目标:- 能够独立设计和制作简单的网页。

- 能够运用所学知识解决实际网页设计问题。

- 培养团队协作能力和创新思维。

3. 素质目标:- 培养学生对网页设计的兴趣和审美能力。

- 增强学生的动手实践能力和解决问题的能力。

- 培养学生的创新意识和终身学习的能力。

教学内容:第一课时1. 导入:- 通过展示一些优秀的网页设计作品,激发学生的学习兴趣。

- 简要介绍网页设计的发展历程和现状。

2. 网页设计的基本概念:- 介绍网页设计的定义、原则和流程。

- 讲解网页设计的基本要素,如色彩、字体、布局等。

3. HTML基础:- 介绍HTML的基本语法和常用标签。

- 讲解HTML文档结构、头部信息、段落、链接、图片等标签的使用。

4. CSS基础:- 介绍CSS的基本语法和常用属性。

- 讲解CSS选择器、字体、颜色、布局等属性的使用。

第二课时1. JavaScript基础:- 介绍JavaScript的基本语法和常用语句。

- 讲解JavaScript的变量、数据类型、运算符、函数等概念。

2. 网页布局技术:- 介绍Flexbox和Grid布局技术。

- 讲解如何使用这些技术实现响应式网页设计。

3. 网页设计工具:- 介绍Dreamweaver、HBuilder等网页设计工具。

- 讲解如何使用这些工具进行网页设计和开发。

4. 实践练习:- 学生分组,根据所学知识设计一个简单的网页。

- 教师进行指导和点评。

教学方法:- 讲授法:讲解网页设计的基本概念、原则和流程。

信息技术八年级上册网页制作教案及导学案

信息技术八年级上册网页制作教案及导学案

信息技术八年级上册网页制作教案及导学案第一篇:信息技术八年级上册网页制作教案及导学案信息技术八年级上册第二单元第四节《网页的制作》教案及导学案教材版本:河南大学、河南电子音像出版社教案部分学习目标:1、通过自学演练会在网页中添加文字并对文字进行相关的设置2、利用自学及小组合作探究掌握图片的插入及调整方法3、通过复习回顾知道如何在互联网中进行搜索,并能搜索到自己所需的素材并进行下载。

能力目标:1、能利用所学知识进行互联网的搜索,并能对所需内容进行下载保存。

2、培养学生自主学习、自主练习、提出问题、解决问题的能力。

3、培养学生合作学习探究的能力。

学习重点:1、会按自己的需求在互联网上进行搜索,并能下载自己所需的素材。

2、综合运用所学知识进行图片网页的制作。

学习难点:综合运用所学知识进行图片网页的制作。

教法与学法:自学演练、合作探究、教学演示、复习回顾、个别指导教学环境:多媒体网络教室教学过程:一、激趣导入同学们肯定去很多地方旅游过,在你们的旅游途中,在些地方的自然景观肯定给你留下了深刻的印象。

你或许用你的相机拍下了这美丽的一幕,或许你只是把这种美丽留在了心中。

今天,我们就通过制作网页来把这些美图展示出来,让我们用网页一记录下这美好的景象。

二、新课学习任务1、复习回顾学生通过回顾讨论,完成导学案中第一部分内容。

任务2、自学演练——为网页添加标题:美丽的大自然按学案第二部分的要求进行制作任务3、搜集素材因为每个同学到过的地方各不相同,根据自己的需要在互联网上搜索相应的图片,并做相应的记录,然后分类保存。

任务4、在网页中插入图片参考课本第二部分的内容,把搜集来的图片插入到相应的单元格,并对图片做相应的设置,使整个网页美观大方。

任务5、为图片添加说明利用任务1所学知识,为每张图片添加相应的说明词。

任务6、学生讨论解疑,教师个别指导学生们在制作过程中,肯定会遇到各种各样的问题。

在即将结束制作之前,利用同学们互帮互助,教师个别指导的方法来让学生掌握本节课的内容。

10-2《网页模板的应用2》教学设计

10-2《网页模板的应用2》教学设计
教学重点
创建模板的方法
难点
更新模板的方法
教学过程
教学
环节
教师活动
措施
学生活动
信息媒体
复习
复习上节内容
演示
边看边回顾
软件
引入
一、点评作业,提出学习任务。
1、演示作品——《钟高青少年体育俱乐部》;2、点出课题,提出学习任务——模板的使用方法。
演示、分析
学生观察、分析、思考,明确了本节课的学习任务和内容。
10.2网页模板的应用课程教学设计
课题名称
10.1网页模板的应用(2)
课型
新授课
教学时间
第5周第2课时
教学目标
一、过程与方法
讲解法、演示法、任务驱动法、自主探究法
二、知识与技能
掌握在网页中创建模板的方法;
学会给指定的范围添加可编辑区域;
更新模板的方法;
培养学生的自主学习的能力;
培养学生分析问题解决问题和探究问题的能力;
(7)按照相同的步骤完成2007年及其2008年部分的制作,效果图见下面。
3、教师现场指导
4、创建模板的三种方法:
(1)直接创建模板
(2)从文件菜单新建模板
(3)将普遍网页另存为模板
演示、分析、分发制作视频与相关素材、现场辅导、点评
1、学生按教师演示实践本任务的操作;
2、小组合作,快速完成的同学必须帮助旁边未完成的同学。
3、观看制作视频,重新回顾
Dreamweaver软件、作品《钟高青少年体育俱乐部》模板页面的效果文件、制作视频及相关素材。
三、拓展延伸,巩固加强
1、展示实例——个人博客案例,请学生欣赏并分析观察;
2、布置任务二:制作实例:个人博客的模板

网页制作教学设计优秀8篇

网页制作教学设计优秀8篇

网页制作教学设计优秀8篇制作交互网页教学设计篇一网页的制作一、教学题目:网页的制作二、教学目标:1、知道站点、主页的概念,能在指定位置建立只有一个网页的站点;2、认识frontpage的界面;3、掌握在主页中插入文字、图片、水平线;4、掌握页面文件与图片的保存。

三、教学重点:1、能在指定位置建立只有一个网页的站点(难点)2、能在页面中插入文字、图片、水平线3、掌握页面文件与图片的保存(难点)四、教学难点:在教学中,一方面采用比较教学的方法,促进学生知识的迁移;另一方面,提供学生一个导学课件,让学生根据这个网络环境下的课件自己探索学习,以满足不同层次学生的需求。

五、教学过程:教师活动:1、引入课题:(激发兴趣,活跃气氛)同学们喜不喜欢上网?经常上新浪、西祠胡同等,有没有同学知道新浪、西祠胡同称做什么?(网站)浏览新浪网站,浏览的第一个页面称为什么?(主页)我们还可以浏览其它的页面,点击超链接浏览,当鼠标变成手指的形状时有超链接。

问题1:网站是不是就是网页?用自己的语言描述一下网站的概念(网站包含多个网页,通过超链接把不同的页面链接起来)问题2:网页是不是就是主页?(第一个页面称为主页,网站设计者可以确定哪一个是主页,主页的文件名一般为:,主页也是网页)设计网站一般必须经过两个步骤,首先是在计算机里做好,然后发布在internet上,让所有的人访问浏览。

今天我们学习用frontpage建立站点,制作一个主页。

先来研究一下没有发布的网站,打开教师做的网站问:同学们看到了什么?(文件夹)总结:可以这样理解网站:在资源管理器里,网站表现为一个文件夹,里面存放的是所有与网站相关的文件。

打开主页,浏览页面,这是老师做的一个导学课件,将帮助大家完成学习任务。

请学生浏览教师课件,了解学习任务。

2、新建站点frontpage的启动问:与word比较,有什么不同?(增加了视图区,编辑区有三个窗口)总结:视图区:多种视图模式是为了方便网站的管理。

网页设计教学教案

网页设计教学教案

网页设计教学教案第一章:网页设计概述1.1教学目标让学生了解网页设计的概念和重要性让学生掌握网页设计的基本原则和流程1.2教学内容网页设计的定义和作用网页设计的基本原则(如用户体验、界面设计、内容组织等)网页设计的流程(如需求分析、设计稿制作、编码实现等)1.3教学方法讲授法:讲解网页设计的概念和原则案例分析法:分析优秀网页设计案例,让学生了解设计要点实践操作法:让学生动手制作简单的网页设计稿1.4教学评估课堂问答:检查学生对网页设计概念和原则的理解案例分析报告:评估学生对优秀网页设计案例的分析能力网页设计稿:检查学生的实际操作能力第二章:网页界面设计2.1教学目标让学生掌握网页界面设计的基本原则和方法让学生了解网页界面设计的常见元素和布局方式2.2教学内容网页界面设计的基本原则(如清晰性、一致性、美观性等)网页界面设计的常见元素(如文字、图片、按钮等)网页界面设计的布局方武(如网格布局、分区布局等)2.3教学方法讲授法:讲解网页界面设计的原则和常见元素案例分析法:分析优秀网页界面设计案例,让学生了解设计要点实践操作法:让学生动手制作网页界面设计稿2.4教学评估课堂问答:检查学生对网页界面设计原则和常见元素的理解案例分析报告:评估学生对优秀网页界面设计案例的分析能力网页界面设计稿:检查学生的实际操作能力第三章:网页布局与排版3.1教学目标让学生掌握网页布局和排版的基本原则和方法让学生了解网页布局和排版的常见技术和工具3.2教学内容网页布局和排版的基本原则(如清晰性、一致性、美观性等)网页布局和排版的常见技术(如HTML、CSS等)网页布局和排版的工具(如网页编辑器、设计软件等)3.3教学方法讲授法:讲解网页布局和排版的原则和技术案例分析法:分析优秀网页布局和排版案例,让学生了解设计要点实践操作法:让学生动手制作网页布局和排版设计稿3.4教学评估课堂问答:检查学生对网页布局和排版原则和技术的理解案例分析报告:评估学生对优秀网页布局和排版案例的分析能力网页布局和排版设计稿:检查学生的实际操作能力第四章:网页色彩与字体设计4.1教学目标让学生掌握网页色彩和字体设计的基本原则和方法让学生了解网页色彩和字体设计的常见技巧和搭配规律4.2教学内容网页色彩设计的基本原则(如对比度、饱和度、色调等)网页字体设计的基本原则(如易读性、一致性、美观性等)网页色彩和字体的常见搭配规律和技巧4.3教学方法讲授法:讲解网页色彩和字体设计的原则和方法案例分析法:分析优秀网页色彩和字体设计案例,让学生了解设计要点实践操作法:让学生动手实践,进行网页色彩和字体设计4.4教学评估课堂问答:检查学生对网页色彩和字体设计原则和方法的理解案例分析报告:评估学生对优秀网页色彩和字体设计案例的分析能力网页色彩和字体设计稿:检查学生的实际操作能力第五章:网页交互设计让学生了解网页交互设计的基本概念和重要性让学生掌握网页交互设计的常见技术和方法5.2教学内容网页交互设计的定义和作用网页交互设计的常见技术(如Jav a Sc r ipt.jQuery等)网页交互设计的常见方法(如按钮、滑动门、下拉菜单等)5.3教学方法讲授法:讲解网页交互设计的概念和技术案例分析法:分析优秀网页交互设计案例,让学生了解设计要点实践操作法:让学生动手实践,进行网页交互设计5.4教学评估课堂问答:检查学生对网页交互设计概念和技术的理解案例第六章:网页素材的使用6.1教学目标让学生了解网页素材的种类和作用让学生掌握网页素材的使用方法和技巧6.2教学内容网页素材的种类(如图片、音频、视频等)网页素材的作用和选择原则网页素材的使用方法和技巧(如插入、优化、压缩等)讲授法:讲解网页素材的种类和作用案例分析法:分析优秀网页素材使用案例,让学生了解设计要点实践操作法:让学生动手实践,使用网页素材6.4教学评估课堂问答:检查学生对网页素材种类和作用的理解案例分析报告:评估学生对优秀网页素材使用案例的分析能力网页设计稿:检查学生的实际操作能力第七章:网页代码基础7.1教学目标让学生了解网页代码的种类和作用让学生掌握网页代码的基本编写方法和技巧7.2教学内容网页代码的种类(如HTML、CSS、Jav a Sc r ipt等)网页代码的作用和编写原则网页代码的基本编写方法和技巧7.3教学方法讲授法:讲解网页代码的种类和作用案例分析法:分析优秀网页代码编写案例,让学生了解设计要点实践操作法:让学生动手实践,编写网页代码7.4教学评估课堂问答:检查学生对网页代码种类和作用的理解案例分析报告:评估学生对优秀网页代码编写案例的分析能力网页设计稿:检查学生的实际操作能力第八章:网页兼容性与优化8.1教学目标让学生了解网页兼容性和优化的概念和重要性让学生掌握网页兼容性和优化的方法和技巧8.2教学内容网页兼容性的概念和原因网页优化的概念和方法网页兼容性和优化的方法和技巧(如代码优化、图片优化等)8.3教学方法讲授法:讲解网页兼容性和优化的概念和方法案例分析法:分析优秀网页兼容性和优化案例,让学生了解设计要点实践操作法:让学生动手实践,进行网页兼容性和优化8.4教学评估课堂问答:检查学生对网页兼容性和优化概念和方法的理解案例分析报告:评估学生对优秀网页兼容性和优化案例的分析能力网页设计稿:检查学生的实际操作能力第九章:网页设计案例分析9.1教学目标让学生了解网页设计案例的分析方法和流程让学生掌握分析优秀网页设计案例的技巧和要点9.2教学内容网页设计案例分析的方法和流程分析优秀网页设计案例的技巧和要点网页设计案例的评析和总结9.3教学方法讲授法:讲解网页设计案例分析的方法和流程案例分析法:分析优秀网页设计案例,让学生了解设计要点实践操作法:让学生动手实践,进行网页设计案例分析9.4教学评估课堂问答:检查学生对网页设计案例分析方法和流程的理解案例分析报告:评估学生对优秀网页设计案例分析的技巧和要点的掌握情况网页设计稿:检查学生的实际操作能力第十章:网页设计项目实践10.1教学目标让学生了解网页设计项目的流程和规范让学生掌握完成网页设计项目的方法和技巧10.2教学内容网页设计项目的流程和规范完成网页设计项目的方法和技巧网页设计项目的评析和总结10.3教学方法讲授法:讲解网页设计项目的流程和规范案例分析法:分析优秀网页设计项目,让学生了解设计要点实践操作法:让学生动手实践,完成网页设计项目10.4教学评估课堂问答:检查学生对网页设计项目流程和规范的理解案例分析报告:评估学生对优秀网页设计项目分析的技巧和要点的掌握情况网页设计稿:检查学生的实际操作能力重点和难点解析1.网页设计概述2.网页界面设计补充和说明:介绍如何使用设计原则(如对齐、对比、重复和亲密性)来创建直观且吸引人的界面。

第7课 驾轻就熟

第7课 驾轻就熟

第7课驾轻就熟—应用模版创建网页尊敬的各位评委老师,大家好:今天我说课的题目是——《应用模版创建网页》,根据新课程的理念,对于本节课,我将以教什么,怎么教,为什么这么教为思路,我将从:教材分析、学生要素、教学三维目标、说教学法、教学过程、最后说评价总结。

首先我们先进行教材分析本节课选自清华大学出版社出版的初中信息技术八年级下册第三单元第7课。

本教材贯彻“以学生为主体,教师为主导”的方针,把提高学生的积极性,培养学生的创新能力作为教育的根本目标。

本节课所学的《应用模版创建网页》是制作网站的重要内容,主要学习内容是利用模版创建网页,制作flash导航栏,是在学生对前面网页制作知识掌握后的能力提高训练,目的在于激发学生制作出更加生动完美的网站。

其次是学情分析八年级的学生思维活跃,想象力丰富,好奇心强,同时又有了一定的自学能力和动手能力,是学生观察概括性发展的转折学期。

通过前面的学习,大部分同学会简单的制作网页,创建站点等了一定的认识。

但由于信息技术课时比较少,每周只有一节课,课后上机操作练习的机会少,学生的遗忘性大,需要及时巩固提高。

这一年龄阶段的学生对网络有着浓厚的兴趣,但对网络知识的认识不够全面,教师要在教学实践中加以正确引导。

接下来说一下本节课的教学三维目标。

①【知识与技能:】(1)通过学习,掌握利用模板创建网页的方法。

(2)通过学习,学会运用Flash按钮制作导航栏进行站内导航。

(3)通过学习,了解链接对象的目标框架的含义。

②【过程与方法:】通过小组合作、课程整合,交流评价,培养学生分析信息、利用信息和信息创新能力,以及对已学知识进行规划管理的能力。

能够通过教师引导、动脑思考、交流与实践操作学习过程,体验和感悟探究的一般过程;③【情感态度与价值观:】通过小组合作、讨论探究的形式,增强学生的合作、协助精神,让学生学有所得,有成就感,增强自信,又能够激发学生学习积极性。

当我们对教材进行了分析并且了解了教学目标之后,就不难理解本节课的重点与难点重点:应用模板创建网页是重点。

H5 页面设计(Mugeda 版)教学教案.doc

H5 页面设计(Mugeda 版)教学教案.doc

《H5页面设计(Mugeda 版)》教学教案第1章1.2.3 条理性原则1.2.4 切身性原则1.2.5 创新性原则1.3 H5 页面的设计规范1.3.1 页面尺寸1.3.2 页面适配1.3.3 文件大小1.4 H5 页面的设计流程1.4.1 明确设计目的1.4.2 策划内容1.4.3 搜集素材1.4.4 进行页面设计1.4.5 进行交互设计1.4.6 生成和发布H5综合训练——分析《方寸之间看徽州》拼图H5 游戏小结1.了解H5的基础知识。

2.掌握如何学好H5设计。

3.掌握H5的设计原则与制作流程课后练习(1)如何理解H5 与H5 页面,二者有什么区别和联系?(2)列举H5页面的设计原则,并举例分析某个H5页面设计对这些原则的遵循情况。

(3)简要说明H5 页面的不同设计风格。

(4)鉴赏下图所示的草莓音乐节H5页面,分析其设计风格并对该风格的特点进行介绍。

(5)鉴赏下图所示的音乐公益H5页面,分析其风格,并简述其遵循的设计原则。

第2章2.3.2 模板管理2.3.3 素材管理2.4 Mugeda 中的H5 编辑器界面2.4.1 菜单栏2.4.2 工具栏2.4.3 “时间线”面板2.4.4 工具箱2.4.5 “页面编辑”面板2.4.6 页面编辑区2.4.7 “属性”面板综合训练——使用模板制作出游季H5 页面小结1.掌握Mugeda的基础知识,以及在Mugeda平台中新建和管理页面、素材。

2.掌握Mugeda中的H5编辑界面的操作方法。

课后练习(1)简述新建H5 页面的方法。

(2)简述模板的使用方法。

(3)简述Mugeda 的H5 编辑器界面的组成部分。

(4)在Mugeda 中新建一个名为“新春贺喜”的H5 页面,保存该页面,然后在Mugeda 中新建一个名为“新年”的文件夹,将“新春贺喜”H5 页面移动到“新年”文件夹中。

(5)应用Mugeda中自带的“测试题”模板,编辑模板中的文字,然后发布编辑后的模板。

10-1《网页模板的应用》教学设计

10-1《网页模板的应用》教学设计

10.1网页模板的应用课程教学设计二、展开探究,实施学习任务1布置学习任务任务一:建立模板2、教师演示操作步骤(1) 在D盘建立站点mysitelOl及其目录(2) 新建模板,命名为“ kj.dwt ”(容易混淆的地方,是此处要新建的模板空模板-HTML模板一—布局为无,学生容易搞成别的地方)■ TOH!* gft■-* ■传祁■■«■ ■*m...R “1* •:・■ ttZ-SI ___________________■W -新课教学(3)修改页面属性,参考P229页的参数。

字体大小为9点,文本颜色为#333333,上下左右边距为0(4)制作页面的导航栏。

插入1行2列的表格,宽度为980像素,分别制作logo和导航栏部分。

⑸利用嵌套表格,制作左侧栏目内容。

⑹按照相同的步骤插入2行1列的表格,完成版权栏的制作。

至此完成了模板页面的制作。

3、教师现场指导4、创建模板的三种方法:(1)直接创建模板(2)从文件菜单新建模板(3)将普遍网页另存为模板三、拓展延伸,巩固加强1、展示实例——个人博客案例,请学生欣赏并分析观察;2、布置任务二:制作实例:个人博客的模板3、教师现场巡视指导操作演示分析分发制作视频与相关素材现场辅导点评1学生按教师演示实践本任务的操作;2、小组合作,快速完成的同学必须帮助旁边未完成的同学。

3、观看制作视频,重新回顾Dreamweaver软件、作品《钟高青少年体育俱乐部》模板页面的效果文件、制作视频及相关素材。

演示作品分析技术要点1学生根据刚才所学的创建模板知识完成拓展案例的制2、小组合作品《个人博客》效果文件、网页效果图。

《网页设计与制作》课程教案

《网页设计与制作》课程教案

《网页设计与制作》课程教案一、教学目标1. 了解网页设计与制作的基本概念和流程。

2. 掌握HTML、CSS和JavaScript的基本语法和应用。

3. 学会使用网页设计软件进行网页布局和美观设计。

4. 能够独立设计并制作一个简单的网页。

二、教学内容1. 网页设计与制作的基本概念和流程。

2. HTML的基本语法和使用方法。

3. CSS的基本语法和使用方法。

4. JavaScript的基本语法和使用方法。

5. 网页设计软件的使用方法和技巧。

三、教学方法1. 讲授法:讲解网页设计与制作的基本概念和流程,HTML、CSS和JavaScript 的基本语法和使用方法。

2. 示范法:通过实际操作演示如何使用网页设计软件进行网页布局和美观设计。

3. 练习法:学生跟随教师的步骤进行实际操作练习,巩固所学知识。

4. 互助法:学生之间相互讨论和帮助,解决学习中遇到的问题。

四、教学准备1. 教室环境:安装有网页设计软件的计算机。

2. 教学材料:教案、PPT、网页设计软件教程。

3. 网络环境:学生可以访问互联网,查找相关资料。

五、教学过程1. 导入:通过展示一些精美的网页,引起学生对网页设计与制作的兴趣。

2. 讲解:讲解网页设计与制作的基本概念和流程,HTML、CSS和JavaScript 的基本语法和使用方法。

3. 示范:教师使用网页设计软件进行网页布局和美观设计的实际操作演示。

4. 练习:学生跟随教师的步骤进行实际操作练习,巩固所学知识。

5. 讨论:学生之间相互讨论和帮助,解决学习中遇到的问题。

7. 作业:布置相关的练习题目,让学生课后巩固所学知识。

六、教学评估1. 课堂参与度:观察学生在课堂上的积极参与程度,提问和回答问题的积极性。

2. 练习完成情况:检查学生完成练习的情况,包括正确性和完整性。

3. 作业质量:评估学生作业的质量,包括对知识的掌握程度和创意性。

4. 同伴评价:学生之间相互评价对方的作品,提供反馈和建议。

网页制作与设计教案

网页制作与设计教案

网页制作与设计教案一、教学目标1、让学生了解网页制作与设计的基本概念和流程。

2、帮助学生掌握网页设计的常用工具和技术。

3、培养学生的创意和审美能力,能够设计出具有吸引力的网页。

4、提高学生的团队合作和沟通能力,通过项目实践完成网页制作。

二、教学重难点1、重点HTML 和 CSS 的基本语法和应用。

网页布局的设计原则和方法。

色彩搭配和图像运用在网页设计中的技巧。

2、难点JavaScript 脚本语言的初步应用。

响应式网页设计的实现。

解决网页兼容性问题。

三、教学方法1、讲授法通过讲解理论知识,让学生对网页制作与设计有系统的认识。

2、实践法安排学生进行实际的网页制作项目,提高他们的动手能力。

3、案例分析法展示优秀的网页案例,分析其设计思路和技术实现,启发学生的创意。

4、小组讨论法组织学生进行小组讨论,共同解决问题,培养团队合作精神。

四、教学过程1、课程导入(约 15 分钟)展示一些精美的网页,引导学生观察并思考网页的组成元素和设计特点。

提问学生对网页制作的了解和兴趣,激发学生的学习热情。

2、知识讲解(约 45 分钟)介绍网页制作与设计的基本概念,包括网页的定义、类型、作用等。

讲解 HTML 的基本标签和结构,如`<html>`、`<head>`、`<body>`等,以及常用的文本标签、链接标签、图像标签等。

介绍 CSS 的作用和语法,包括选择器、样式属性等,通过实例演示如何使用 CSS 美化网页。

3、实践操作(约 60 分钟)学生根据所学知识,动手创建一个简单的网页,包括设置网页标题、添加文本内容、插入图片和链接等。

教师巡视指导,及时解决学生在操作过程中遇到的问题。

4、网页布局设计(约 45 分钟)讲解网页布局的常见方式,如流式布局、固定布局、响应式布局等。

介绍使用 CSS 进行布局的方法,如浮动布局、定位布局等。

学生尝试使用不同的布局方式设计网页布局。

5、色彩与图像运用(约 45 分钟)讲解色彩搭配的基本原则和方法,以及在网页设计中的应用。

网页设计教学教案

网页设计教学教案

网页设计教学教案第一章:网页设计概述1.1 教学目标了解网页设计的概念与意义掌握网页设计的基本原则与要求了解网页设计的发展趋势1.2 教学内容网页设计的概念与意义网页设计的基本原则与要求网页设计的发展趋势1.3 教学方法讲授法:讲解网页设计的概念、原则与要求展示法:展示优秀的网页设计案例,分析其设计思路与技巧1.4 教学步骤引入话题:介绍网页设计的概念与意义讲解基本原则与要求:强调用户体验、界面美观、内容清晰等原则分析发展趋势:介绍响应式设计、扁平化设计等趋势课堂练习:学生自行设计一个简单的网页布局1.5 作业布置要求学生完成一个简单的网页设计布局,包括头部、主体内容、底部等部分第二章:网页设计与制作基本工具2.1 教学目标掌握网页设计与制作的基本工具学会使用HTML、CSS、JavaScript等语言进行网页制作2.2 教学内容HTML:介绍HTML的基本结构与标签CSS:介绍CSS的语法与使用方法JavaScript:介绍JavaScript的基本语法与功能2.3 教学方法讲授法:讲解HTML、CSS、JavaScript的基本概念与使用方法实践操作法:学生实际操作,掌握基本语法与使用技巧2.4 教学步骤讲解HTML:介绍HTML的基本结构与标签,如、段落、图片等讲解CSS:介绍CSS的语法与使用方法,如选择器、属性、样式表等讲解JavaScript:介绍JavaScript的基本语法与功能,如弹窗、动态效果等课堂练习:学生自行设计一个简单的网页,并使用HTML、CSS、JavaScript实现一些基本效果2.5 作业布置要求学生完成一个简单的网页,并使用HTML、CSS、JavaScript实现一些基本效果,如导航栏、图片轮播等第三章:网页布局与排版3.1 教学目标掌握网页布局与排版的方法与技巧学会使用div标签进行布局掌握CSS样式表的编写方法3.2 教学内容网页布局的方法与技巧使用div标签进行布局CSS样式表的编写方法3.3 教学方法讲授法:讲解网页布局的方法与技巧展示法:展示优秀的网页布局案例,分析其设计思路与技巧实践操作法:学生实际操作,掌握布局方法与技巧3.4 教学步骤讲解网页布局的方法与技巧:介绍网格布局、浮动布局等方法讲解使用div标签进行布局:介绍div标签的使用方法与布局技巧讲解CSS样式表的编写方法:介绍选择器、属性、样式表等语法课堂练习:学生自行设计一个简单的网页布局,使用div标签与CSS样式表实现3.5 作业布置要求学生完成一个简单的网页布局,使用div标签与CSS样式表实现,包括头部、主体内容、底部等部分第四章:网页配色与图片处理4.1 教学目标掌握网页配色原则与技巧学会使用图片处理软件进行图片处理掌握CSS样式表中图片样式编写方法4.2 教学内容网页配色原则与技巧图片处理软件的使用方法CSS样式表中图片样式编写方法4.3 教学方法讲授法:讲解网页配色原则与技巧展示法:展示优秀的网页配色案例,分析其设计思路与技巧实践操作法:学生实际操作,掌握配色方法与技巧4.4 教学步骤讲解网页配色原则与技巧:介绍对比、调和、重复等配色原则讲解图片处理软件的使用方法:介绍Photoshop、Fireworks等软件的使用技巧讲解CSS样式表中图片样式编写方法:介绍图片样式、响应式图片等语法课堂练习:学生自行设计一个简单的网页配色,并使用图片处理软件进行图片处理4.5 作业布置要求学生完成一个简单的网页配色,并使用图片处理软件进行图片处理,将处理后的图片应用到网页中第五章:网页第六章:响应式网页设计6.1 教学目标理解响应式网页设计的概念与重要性掌握媒体查询的使用方法学会创建适应不同设备的网页布局6.2 教学内容响应式网页设计的概念与重要性媒体查询的使用方法响应式布局技术6.3 教学方法讲授法:讲解响应式网页设计的理念与技术展示法:展示响应式网页设计案例,分析其设计要点实践操作法:学生动手实践,尝试创建响应式网页布局6.4 教学步骤引入响应式网页设计概念:解释响应式网页设计的目的与优势讲解媒体查询:介绍媒体查询语法与用法,演示如何适应不同屏幕尺寸实践响应式布局:学生通过实际操作,使用CSS媒体查询实现响应式布局课堂练习:学生设计一个响应式网页布局,测试其在不同设备上的显示效果6.5 作业布置要求学生完成一个响应式网页布局设计,包括媒体查询的使用,适应手机、平板、桌面电脑等不同设备。

《网页设计》教案

《网页设计》教案

教案:《网页设计》一、教学目标1.让学生了解网页设计的基本概念和重要性,掌握网页设计的基本原则和方法。

2.培养学生的审美观和创新能力,提高他们的网页设计水平。

3.使学生掌握网页设计的基本工具和技术,能够独立完成简单的网页设计任务。

二、教学内容1.网页设计的基本概念网页设计是指使用网页制作技术,通过视觉设计、交互设计和内容组织,将信息以网页的形式展现给用户的过程。

网页设计是网站建设的重要组成部分,它直接关系到网站的用户体验和访问效果。

2.网页设计的基本原则(1)用户导向原则:网页设计应以用户的需求为导向,关注用户体验,提高用户满意度。

(2)简洁明了原则:网页设计应简洁明了,避免过多的装饰和繁琐的布局。

(3)一致性原则:网页设计应保持一致性,包括颜色、字体、布局等方面的一致性。

(4)可访问性原则:网页设计应考虑不同用户的需求,提供良好的可访问性。

3.网页设计的基本方法(1)需求分析:了解用户需求和网站目标,明确网页设计的目标和方向。

(2)信息架构:组织网站内容,构建清晰的信息架构,方便用户浏览和查找信息。

(3)视觉设计:运用色彩、图像、字体等元素,创造美观、专业的视觉效果。

(4)交互设计:设计用户与网站的交互方式,提高用户体验。

(5)页面制作:使用网页制作工具和技术,实现网页设计的具体效果。

4.网页设计的基本工具和技术(1)网页制作软件:如AdobeDreamweaver、MicrosoftExpressionWeb等。

(2)图像处理软件:如AdobePhotoshop、Fireworks等。

(3)网页编程语言:如、CSS、JavaScript等。

三、教学安排1.教学时间:共计20学时。

2.教学方法:采用理论教学和实践操作相结合的方式,注重培养学生的实际操作能力。

3.教学步骤:(1)第1-2学时:介绍网页设计的基本概念和重要性。

(2)第3-4学时:讲解网页设计的基本原则和方法。

(3)第5-6学时:讲解网页设计的基本工具和技术。

计算机应用技术专业Web前端开发课程优秀教案范本网页设计与交互效果制作

计算机应用技术专业Web前端开发课程优秀教案范本网页设计与交互效果制作

计算机应用技术专业Web前端开发课程优秀教案范本网页设计与交互效果制作一、课程概述Web前端开发是计算机应用技术专业中的一门重要课程,它涵盖了网页设计与交互效果制作的内容。

本教案范本将介绍一种优秀的教学方式,以帮助学生系统学习Web前端开发技术,掌握设计和制作具有良好交互效果的网页。

二、教学目标1. 理解Web前端开发的基本概念和原理;2. 掌握HTML、CSS和JavaScript等Web前端开发的核心技术;3. 能够设计并实现具有良好交互效果的网页;4. 培养学生的创新思维和团队合作能力。

三、教学内容与方法1. 教学内容本课程将分为以下几个模块进行教学:- HTML基础:介绍HTML的结构、标签和常见元素,包括文本、链接、表格、表单等;- CSS样式设计:讲解CSS基础知识,包括样式选择器、盒模型、布局等,以及常见的样式效果;- JavaScript编程:介绍JavaScript的语法、变量、函数、对象等基本概念,以及与HTML和CSS的交互;- 响应式设计:讲解网页的自适应设计原理和技术,使网页能够在不同设备上良好显示;- 网页交互效果制作:介绍一些常见的网页交互效果制作方法,如轮播图、下拉菜单等。

2. 教学方法本课程将采用以下教学方法:- 理论讲授与实践结合:每个模块的教学将既包括理论知识的讲解,又包括实际案例的分析和实践操作;- 项目实践:学生将有机会参与到实际的网页设计和开发项目中,通过实践掌握相关技能;- 团队合作:鼓励学生以小组为单位进行项目开发,培养合作意识和团队协作能力;- 提供学习资源:为学生提供相关的学习资料、在线教程和实践案例,帮助他们更好地学习和实践。

四、教学评估与反馈机制教学评估是教学中必不可少的环节,它能够帮助教师了解学生的学习情况,及时调整教学方法和内容。

本课程的教学评估与反馈机制包括以下几个方面:1. 日常作业与实践项目:通过布置日常作业和实践项目,检验学生对所学知识的掌握程度和应用能力;2. 期中与期末考试:定期进行考试,考察学生对整个课程的理解和掌握情况;3. 学习总结与报告:要求学生进行学习总结并撰写学习报告,反思自己的学习过程和收获;4. 课堂互动与讨论:鼓励学生积极参与课堂互动和讨论,提供即时的反馈和指导。

网页设计与制作教程教学设计

网页设计与制作教程教学设计

网页设计与制作教程教学设计背景及目的随着信息技术的不断发展,更加强调学习者的自主学习和批判性思维,同时对于学生的专业技能素质要求也越来越严格。

为了适应市场的变化,让学生更好的适应工作所需的技能,本文旨在设计一份网页设计与制作的教程教学方案。

教学目标针对不同层次的学生,我们设计了不同的教学目标:•初级目标:熟悉 HTML、CSS 的基础语法及其慣用法,掌握网页布局及DOM操作的基本方法。

•中级目标:掌握更高级的 HTML 和 CSS 技能,能够制作更加复杂的效果,并熟悉 JavaScript 的基础知识和使用方法。

•高级目标:能够独立制作更加复杂的网页效果,掌握jQuery 等前端框架的使用,理解网站性能优化和前后端交互的知识。

教学方式本教程采用学习与实践相结合的教学方式,通过实践和项目驱动,帮助学生掌握网页前端技能,让学习更具可操作性。

课程设计如下:阶段一:HTML & CSS 基础学习基础的HTML标记与CSS样式表,理解页面结构和样式布局;任务列表:1.制作一个静态网页,页面包含文章、图片等元素,并使用样式表控制页面布局和样式;2.初学者参考模板制作简单的网页,包含导航、轮换图、图片等常见元素;阶段二:网页布局与JavaScript基础学习更高级的HTML和CSS技能,理解DOM和布局的基础知识,并获得基础JavaScript编程能力;任务列表:1.制作一个网页布局Demo,动态展示常用的网页布局方式;2.使用原生JavaScript制作一个简单的动态效果,比如MouseOver展示图片等。

阶段三:常用框架与性能优化进一步学习网页制作及优化技巧,掌握各种常用框架的使用方法,并学会进行性能优化。

任务列表:1.使用Bootstrap完成一个页面布局,并使用Less预处理;2.使用jQuery实现一个动态效果,让学生掌握框架的使用方法;3.了解前后端交互的基础知识,采用Ajax技术实现一个动态效果;4.理解网站性能优化的基本原则,做到核心页面的dom size控制在10KB以内,并优化网页加载速度。

《第7节 制作网页》教学设计教学反思-2023-2024学年初中信息技术北师大版八年级上册

《第7节 制作网页》教学设计教学反思-2023-2024学年初中信息技术北师大版八年级上册

《制作网页》教学设计方案(第一课时)一、教学目标1. 知识与技能:学生能够了解网页的基本构成元素,掌握网页的基本制作方法。

2. 过程与方法:通过实践操作,学生能够掌握网页的制作技巧,提高信息处理能力。

3. 情感态度价值观:培养学生的创新精神,激发学生对信息技术学科的兴趣。

二、教学重难点1. 教学重点:掌握网页的基本制作方法,能够独立完成网页的制作。

2. 教学难点:根据主题,合理规划网页布局,提高网页的美观度。

三、教学准备1. 制作一个简单的网页模板,供学生参考;2. 准备相关素材,如图片、文字、视频等;3. 确保教学环境良好,网络通畅,设备齐全。

四、教学过程:(一)导入新课1. 展示几个不同类型网页,请学生观察并描述网页的外观。

2. 引导学生思考网页制作需要哪些元素,如文字、图片、视频等。

3. 引出本节课的主题——制作网页,并介绍网页的基本观点和构成元素。

(二)任务驱动1. 安置任务:让学生制作一个简单的个人网页,包括姓名、年龄、爱好等信息。

2. 引导学生讨论如何实现这个任务,并列出实现步骤:(1)确定网页主题和风格;(2)规划网页布局;(3)收集素材并上传到网页;(4)设置网页链接和动态效果。

(三)新课教学1. 传授网页制作的基本工具和软件,如Word、PowerPoint等,以及如何应用这些工具制作网页。

2. 讲解网页的构成元素,如标题、段落、图片、超链接等,并示范如何应用这些元素制作网页。

3. 引导学生实践操作,遇到问题及时解答和指导。

(四)合作探究1. 将学生分成若干小组,每组共同完成一个网页的制作任务。

2. 鼓励学生互相合作、交流和探讨,共同解决问题。

3. 展示优秀作品,并给予表扬和鼓励。

(五)教室小结1. 总结本节课的重点和难点,强调网页制作的基本知识和技能。

2. 引导学生思考如何将所学知识应用到实际生活中,培养他们的创新认识和实践能力。

3. 鼓励学生课后继续探索和实践,提高自己的信息技术水平。

网页设计与制作教案

网页设计与制作教案

网页设计和发布流程第一步是对站点进行规划第二步是创建站点的基本结构第三步即可开始具体的网页创作过程最后一步是站点的发布第一节站点的规划与创建【计划课时】:3课时【授课班级】:计算机应用一班【教学目的与要求】【教学方法与手段】多媒体教学:借助多媒体手段,进行课堂理论教学;启发式教学:教学活动关注的重点从结果转向过程。

激发思维,师生互动,增强学生学习的主动性、积极性和创造性;【教学重点与难点】:基础知识:。

重点知识:【教学组织过程】1.上讲回顾2.教授新知【授课内容】一、规划站点Web站点是一组具有共享属性(如相关主题、类似的设计或共同目的等)的链接文档。

本地站点:是本地硬盘中存放远程网站所有文档的地方(文件夹)。

建立网站的通常做法是:在要地硬盘中建立一个文件夹用来存放网站的所有文件,往后就在该文件夹中创建和编辑文档。

待网页设计和测试好之后,再把它们拷贝到网站上供浏览者浏览。

1、规划站点结构注:规划站点的结构之前应先用笔绘出站点的结构图(如下图所示是一个典型的学校站点的结构图)2、规划站点的浏览机制一般可采用以下的方法:●创建返回主页的链接●显示网站专题目录●显示当前位置●搜索和索引●反馈(将网页创作者或网站管理员公布在网页上,或创建一个E-MAIL超级链接,以使用户能快速地将信息反馈到网站中)二、创建一个站点步骤:1、单击“文件”---“新建”---“站点”命令(或单击常用工具栏中“新建网页”按钮的下拉箭头,从打开的下拉菜单中选择“站点”命令)2、选择一种站点模板或向导3、单击“确定”按钮三、站点的基本操作1、打开站点:“文件”---“打开站点”2、删除站点:方法一:在Windows资源管理器中删除一个站点方法二:在FrontPage中删除站点,在“文件夹”视图或“网页”视图的“文件夹列表”中,右击站点所对应的目录,在快捷菜单中单击“删除”命令3、站点的设置“工具”----“站点设置”,有“常规”、“参数”、“高级”、“语言”、“导航”、“数据库”六个选项卡【课程小结】【作业】1.5 课后练习书本课后练习作业第二节利用表格进行网页布局【计划课时】:3课时【授课班级】:计算机应用一班【教学目的与要求】【教学方法与手段】多媒体教学:借助多媒体手段,进行课堂理论教学;启发式教学:教学活动关注的重点从结果转向过程。

相关主题
  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

网页模板的应用课程教学设计
新课教学二、展开探究,实施学习任务
1、布置学习任务
任务一:建立模板
2、教师演示操作步骤
(1)在D盘建立站点mysite101及其目录
(2)新建模板,命名为“”(容易混淆的地
方,是此处要新建的模板空模板-HTML模板——布局为无,学生容易搞成别的地方)
(3)修改页面属性,参考P229页的参数。

字体大小为9点,文本颜色为#333333,上下左右边距为0
(4)制作页面的导航栏。

插入1行2列的表格,宽度为980像素,分别制作logo和导航栏部分。

(5)利用嵌套表格,制作左侧栏目内容。

(6)按照相同的步骤插入2行1列的表格,完成版权栏的制作。

至此完成了模板页面的制作。

3、教师现场指导
4、创建模板的三种方法:
(1)直接创建模板
(2)从文件菜单新建模板
(3)将普遍网页另存为模板

示、

析、










材、



导、


1、学
生按教师
演示实践
本任务的
操作;
2、小
组合作,快
速完成的
同学必须
帮助旁边
未完成的
同学。

3、观
看制作视
频,重新回

Drea
mweaver
软件、作
品《钟高
青少年体
育俱乐
部》模板
页面的效
果文件、
制作视频
及相关素
材。

三、拓展延伸,巩固加强
1、展示实例——个人博客案例,请学生欣赏并分析观察;
2、布置任务二:制作实例:个人博客的模板
3、教师现场巡视指导操作



品、




1、学
生根据刚
才所学的
创建模板
知识完成
拓展案例
的制作。

作品
《个人博
客》效果
文件、网
页效果
图。

相关文档
最新文档