网页的制作教学设计网页制作教学设计(模板8篇)

1、知识与技能:灵活运用添加超链接和在网页中插入表格方法,根据网页内容进行页面布局,完善网页,掌握网页布局的技能和技巧。

过程与方法:培养学生加工信息和应用信息的能力及培养学生思维能力,规划能力、创新能力、及合作能力。

情感与态度:使学生感受中国源远流长的历史文明,并通过网页传递给世界;帮助学生树立良好的信息道德意识;让学生享受成就感,树立自信心。

2、初中二年级学生感知能力较强,理解能力和抽象思维较弱;学生基本学会使用在网页中插入表格的方法,但分析信息、处理信息和应用信息能力较弱;对教学内容的了解程度较强。

3、

教学重点:利用表格对网页页面进行布局。

教学难点:怎样合理、美观地设计网页页面布局。

此部分教学内容在整个网页设计知识体系中处于综合处理信息的重要部分。

4、

我根据教学主题及其教学目标确定的教学指导思想是以学生为主体,以学生自己的亲身体验展开探究式小组合作学习。本节课采用研究体验式教学法,建构主义模式下的任务驱动式教学法组织教学。首先设计“总任务”,再细分成若干“小任务”,实现教学目标。

整个教学活动,尤其是学习活动,我采用探究式学习法,又称研究性学习,我强调的是学生在教师指导下,根据各自的兴趣、爱好和条件,再结合与自己有相同或相近的兴趣、爱好的同学组成合作伙伴,共同选择西安不同的旅游景点,确定研究课题,借助“表格布局”功能规划七天的旅游行程,独立自主结合小组合作开展研究,进行合理的网页布局设计,达到从中培养创新精神和创造能力及审美能力的一种学习方式,实现“双赢”。建构主义学习理论认为,学习过程不是学习者被动地接受知识,而是积极地建构知识的过程,把学过的网页设计知识综合应用起来,由于建构主义学习活动是以学习者为中心,而且是真实的,并且以完成特定的任务为动力,因而学习者就更具有兴趣和动机,能够鼓励学习者进行批判型思维,能够更易于提供个体的学习风格,展现自己的独特思维,不受现有网页模式的拘束。基于构建主义的探究性学习模式,我的设想是整个教学过程是动态的,学生是学习的主体,教师是学生学习环境的创设者、学习动力的激发者、学习过程的指引者和学生学习的协作者。

信息技术在本次教-学活动有不可替代的功能。利用信息技术中计算机技术进行网页设计,实现教学目标,完成让世界各地的人实现“网上游古都”。在教学中计划通过探究式教学方式,小组合作学习方式和“任务驱动式”教学策略,自主设计网页,发布网页,运用网络使信息技术的这些潜在优势发挥作用并真正促进学生能够结合实际应用,通过自主实践,完成“网上游古都”任务,并同时完成了学习任务,进一步建构了自己的知识体系,并实时地享受到巨大的成就感。

创设情境

激发兴趣

设计一个含有指向各旅游景点网页的超链接的主页。

提供信息活条件,激发起学生的兴趣。

利用“表格”。

为细化任务埋下伏笔;并且激发学生的认知冲突。

学生明确本节课课题,初步了解任务。

出示课题,介绍总任务。

根据对各旅游景点的兴趣及当初搜索信息的分工情况及本节课任务分工,四人一小组。

学生进行分组

为细化任务做准备

出示任务

明确分工

每个组围绕主题,利用表格规划设计旅游行程,并建立好超链接,利用主页展示出来。

学生明确任务

明确总任务

形式:创建并完善主页,并展示整个网站。

分工参考:

内容版式规划

整理七个旅游景点网页

超链接的建立与维护

作品演示解说

学生明确汇报形式,分工参考。

使学生明确各自任务后,通过研究,探讨,操作,通过电脑媒体来完成任务。

学生自由分组后,共同研究选组长,组长进行给组员分配任务。

学生共同研究选组长,并协调分配好任务.

锻炼学生自主协调分工能力。

教师出示作品评价标准:

作品内容:设计含有七个链接网页的主页,资料丰富,内容准确。

技术表现:页面布局设计合理,颜色搭配和谐,主题突出,作品演示运行正常,操作熟练。

创新特色:作品布局规划有独特之处,有新意。

提示学生有三条帮助热线:

1、组长2、邻座学习伙伴3、教师4、自学课件

学生明确要求。

培养学生的创新能力,规划能力,思维能力和合作能力。

学生研究探索合作交流创作作品

播放舒缓音乐,为学生营造自由和谐气氛。

(提示学生利用网上邻居把各组员的作品组合在一起,共同完成此任务。)

学生根据角色分工,按小组形式开始完善网站。

学生体会了超链接的作用,练习了超链接的使用,理解了表格强大的页面布局功能;培养学生处理信息和应用信息的能力;通过学生间交流合作,老师及时点拨与指导,培养学生发现问题和解决问题的能力。

下面请各组派代表,到教师机前展示以下你们的旅游行程。其他同学观察后,可提意见或建议。

由小组代表展示组内作品,并详细说明旅游景点规划的呈现形式,内容选择及整体构思。

锻炼学生口语表达能力和分析说明问题能力。

合作成功展示作品成果汇报交流探讨

教师引导学生探讨页面布局的方法和技巧;谈看完作品后,对其改进意见;进行组间互评和组内自评。

评出“最受欢迎奖”(即如果此网站上传到网上,点击率最高),“最具创意奖”“最佳布局奖”作品。

学生间相互交流探讨。

培养学生合作交流能力。

教师从页面布局,整体规划合理性,创意等几方面进行点评。

学生思考,怎样完善作品。

教师鼓励学生发展创新思维,页面布局规划能力,逻辑思维能力及合作能力。

教师或其他同学提问页面布局的方法。

学生代表演示

及时检测学生对表格的掌握情况。

你受到的最大启示和收到的最大收获?成功经验和失败教训?

学生回答

巩固知识,培养情感

同学们已熟练掌握表格的使用方法,并且加工和应用信息的能力增强。

悠久的历史积淀和丰富的人文资源,使西安居中国六大古都之首,是世界四大文明古都之一,著名的旅游中心城市。希望你们热爱中国博大精深的历史,感受西安古老的魅力!

学生感悟。

全课总结,培养道德情感。

全课总结知识延伸

网站制作好了,怎样让世界各地的人都看到你们的网站呢?

想当我们的故乡—大庆的小导游吗?赶快制作一个“铁人故乡—大庆”的网站吧!

学生思考。

学生课后实践。

为激发下一节课内容(上传主页)的兴趣奠定基础。

让学生可把本课内容应用到实际生活中去。

培养学生自发探究能力。

利用信息技术创设情境,播放一段自拍的录像,内容大体是:一位外国友人,想要来中国四大古都之一“西安”旅游,但想要自助游,想借助因特网,先在网上了解一下西安,并参考一下旅游行程。通过此录像激发学生兴趣并利用信息技术呈现问题,使学生产生认知冲突,培养学生发现问题、分析问题、解决问题的能力。我通过学生利用信息技术完成此项任务,促进学生对基础知识、基本技能的学习。我利用信息技术,尤其是网络提供的有关“西安”丰富的旅游景点介绍资源,帮助和拓展学生的学习。让学生借助信息技术手段开展探索、总结并进行创作。我利用信息技术展示学生自评,学生互评,教师评价的评价表,为学生的学习提供评价、反馈和矫正。我利用网页自学课件和网络教室教学广播系统支持师生间、生生间的交流对话。

本节课主题明确、集中,让学生分成小组,合作探究学习,给出特定的总任务,有利于学习效果评判的可比较性,也便于学生之间的广泛交流和良性竞争。通过利用信息技术规划规划网上西安七日游,对西安七个主要景点的介绍,让世界了解西安,每个学生在共同完成“网上游古都”网站作品后,让每个学生都有完成任务和宣传中国源远流长的文明历史的成就感,并感到自豪。

本节课,在小组合作学习过程中,学生之间互学互教,彼此交流探讨,经历了提出问题、分析问题和解决问题过程,每个学生都承担一定学习任务,防止滥竽充数,促进了学生的参与程度、认知深度,高质量地实现了课程的目标,增强学生的责任感。但个别学生没有认识到合作学习的重要意义,自主探究能力较弱,容易丧失信心。

教学实际实施过程,有学生提出:我对中国的少数民族文化感兴趣,能否制作一个宣传中国五十六个少数民族文化的特色网站?于是我了解到学生对中国的不同文化感兴趣,可在课外活动小组完成此任务或作为课外自主探究性学习课题来探究。

本节课让学生掌握了“表格”的妙用,还提高了加工信息和应用信息的能力,而且使学生感悟到了中国上下五千年的博大精深,对祖国更加热爱。

教学活动在面向全体的同时更注重学生情感的`交流协作意识与因材施教。更注重学生个性培养和创新智能的开发。

学生自主性学习,需要有一个适应的过程,开始阶段,布置任务要明确具体。

学生之间的交流和帮助比较少,自主学习的能力还要不断提高等。

附:学生学习过程及典型成果

第________组组长________作品题目______________

1、让学生掌握在网页中插入表格的方法以及表格的修改

2、学会利用表格来规划网页

3、培养学生创新的能力以及动手操作的能力

利用表格来规划网页,从中培养学生的创新能力

一、情境导入

同学们你们善于观察吗?老师先考考你们,我们一起来看一组图片,你们看看在那里看过呢?学校缓台的窗台上。你们的观察能力真的很强啊,对,这些都是我们学校美术的特色作口,盘画。其实,我们做过很多作品:有手工作品,语文课中的作文、书法等都是作品,这节课我们以绘画作口品为例,做一个学习园地网页,把我们的作品展示到自己的班级网站中,以便我们更好的努力学习。现在我们就一起来制作吧!

二、新知探究

首先我们来打开上节课的班级网站,在这个网站中新建一个网页,并保存成“学习园地”。

教师讲解:如何制作学习园地网页。

1、制作网页的标题:输入文字,并设置文字的格式。

2、插入表格:单击“表格”中的“插入表格”并对表格属性进行设置。如:行、列的操作,对齐方式等。同时讲解什么是行,什么是列,以及单元格的概念。

3、修改表格:调整表格行高和列宽。

4、在学生学会插入表格的基础上,来设计网页,展示作品。并讲解在单元格中可以插入图片、文字。那我们就一起快快去做吧!插入图片,并在图片的上面或下面进行图片的注释。

5、进一步设置单元格的背景,来美化网页。

6、设置超链接:通过导航栏目,设置文字超链接。选中文字,点击右键选择超链接在列表中选择你要链接的网页,单击“确定”按钮。

7、学生在教师的讲解后,学生自己动手操作制作网页。教师进行指导。(伴随音乐)

三、作品评价

1、生评:从网页设计上,美观程度上,知识落实上重点评价。

2、师评:对学生作品进行评价,并对其它学生的评价加以更完整的解释。

四、总结

我们这节课主要是利用了表格来设计网页,以使来美化我们的网页,通过绘画作品的展示,学习更多的知识。

一、教学题目:网页的制作

二、教学目标:

1、知道站点、主页的概念,能在指定位置建立只有一个网页的站点;

2、认识frontpage的界面;

3、掌握在主页中插入文字、图片、水平线;

4、掌握页面文件与图片的保存。

三、教学重点:

1、能在指定位置建立只有一个网页的站点(难点)

2、能在页面中插入文字、图片、水平线

3、掌握页面文件与图片的保存(难点)

四、教学难点:

在教学中,一方面采用比较教学的方法,促进学生知识的迁移;另一方面,提供学生一个导学课件,让学生根据这个网络环境下的课件自己探索学习,以满足不同层次学生的需求。

五、教学过程:

教师活动:

1、引入课题:(激发兴趣,活跃气氛)

同学们喜不喜欢上网?经常上新浪、西祠胡同等,有没有同学知道新浪、西祠胡同称做什么?(网站)

浏览新浪网站,浏览的第一个页面称为什么?(主页)

我们还可以浏览其它的页面,点击超链接浏览,当鼠标变成手指的形状时有超链接。

问题1:网站是不是就是网页?用自己的语言描述一下网站的概念(网站包含多个网页,通过超链接把不同的页面链接起来)

问题2:网页是不是就是主页?(第一个页面称为主页,网站设计者可以确定哪一个是主页,主页的文件名一般为:,主页也是网页)设计网站一般必须经过两个步骤,首先是在计算机里做好,然后发布在internet上,让所有的人访问浏览。

今天我们学习用frontpage建立站点,制作一个主页。先来研究一下没有发布的网站,打开教师做的网站问:同学们看到了什么?(文件夹)总结:

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

2、新建站点

frontpage的启动问:与word比较,有什么不同?(增加了视图区,编辑区有三个窗口)总结:

视图区:多种视图模式是为了方便网站的管理。制作网页时,必须在网页视图中编辑页面。

普通窗口:鼠标在闪动,可编辑、修改页面,所见即所得的方式。

预览窗口:浏览器中出现的效果,与powerpoint中的“放映幻灯片”类似。html窗口:编写html(超文本标记语言,它是描述网页内容和外观的标准。)打开导学软件,根据步骤,示范建立只有一个网页的站点,强调新站点的位置、路径的正确输入,站点的名称。

分析多出的文件夹列表栏,多了一个文件夹,里面有两个子文件夹和主页,图片存放在images文件夹中。

3、编辑主页与保存主页

看效果图,请学生分析主页中的元素

根据导学软件,学生完成任务2:设计主页、保存主页与图片

4、总结反馈

请学生示范,讲解如何插入图片(来自剪贴画与来自文件)、插入水平线,如何保存

总结:必须切换到“普通”窗口下编辑主页的保存中存在问题:

单击“文件”---“保存”或工具栏的“保存”按扭,弹出一个对话框,保存嵌入式文件,改变文件夹,图片必须保存在本站点images文件夹中,便于站点的管理。

5、请学生继续完成自己的主页,有能力的同学完成提高篇

六、小结:

展示学生作品,教师与学生共同评价请学生总结今天的学习内容:建立包含一个页面的站点,主页的设计与保存。

《网页制作》教学是信息基础必修教材中第六章第1节信息集成中网站制作简介的有关内容。编辑网页所使用的是软件是frontpage20xx,该软件的使用与以前所学的word有类似的地方,软件操作具有一定的迁移性。

学生在之前已经学习了word的有关操作,具备网上获取信息和一定的信息处理能力。frontpage20xx的使用与word有很多类似的地方,学生较容易上手。

过程与方法:通过实践体验对比,得出结论。亲历网页制作的过程。情感态度与价值观:在与同伴合作完成简单网页的制作过程中,培养与他人合作交流的意识和习惯,通过设计学校网页,培养学生热爱学校的情感。

教学重点:网页制作中网页元素的应用

教学难点:利用表格布局网页

(一)情境导入

生回答:通过网络发布,需要制作网页(如回答不在话题上,引导)

师:本节课我们就一起来学习制作《美丽的蒲中校园》网页,宣传学校的美。学校将组织评选同学们设计的优秀网页作品,放在学校网站上。

(二)新课讲授

生:文字、图片、动画、声音、超链接等。

师:网页里的这些元素是通过什么工具集成起来的呢?在这里,老师向大家介绍office20xx中的frontpage20xx来制作网页,它具有功能强大、简单易用的特点。

师:刚才同学们的都非常好,在制作网页前,我们先来放松一下,来玩拼图。请同学们打开d盘的《网页制作》学案,完成实践一。

实践一:2个小实验

实验1:启动frontpage后,点击“文件”“打开站点”,找到d盘下的bpzx文件夹。双击文件夹列表里的文件,学生尝试拼凑图形。

学生操作,发现实验1中的图形总有1个无法拖动,拼凑不成功,实验2在表格中拼凑图形成功。

教师启发学生思考,引导学生观察一开始出示的网页,发现图片、文字、动画等网页元素排列整齐。

师:是什么在起作用?

师生共同得出:利用表格布局网页。得出:表格的定位。

师:利用表格的布局功能。表格的'布局功能可以对页面元素进行定位,使网页清晰美观、富有条理。表格中可以包含多种类型的内容,如图像、文本、多媒体文件。

师:在网站文件夹里有一张利用表格布局的“美丽的蒲中校园”网页,今天,老师要请你们当网页设计师,完成“美丽的蒲中”网页制作。制作学校风景,需要什么样的素材?学生回答:图片。老师已经预先把素材准备好了,大家可以打开acde浏览素材,选择合适的素材。

实践二:双击文件夹视图里的。

任务一:请大家从d盘的sucai文件夹中,从7张校园风景图片中挑选其中一张,插入网页表格的适当位置。文字材料直接从sucai文件夹中的word文档中复制。注意页面的保存,保存时要注意:网站中用到的图像、声音、视频文件应有条理地存放到指定文件夹中。当保存图片时,要把图片保存到images文件夹中。

学生自主操作,4人一组合作学习。教师巡回辅导。操作中的操作步骤要点参考《网页制作》学案。

任务二:在单元格中各插入gif图像动画、欢迎字幕和flash动画,,以实现页面的动态效果。注意保存和预览。

可能的问题:1、图片属性设置2、flash动画的插入教师展示一部分学生的作品,点评,小结。学生再次练习完善。

师:刚才,同学们的表现都非常出色,要想使自己的网页更漂亮、更受欢迎吗?

实践三:

任务一:美化页面操作小贴士:

操作右击网页空白处,“网页属性”,“常规”,输入标题。切换到“背景”,设置背景色。设置背景图片:可勾选“背景图片”,“浏览”。

任务二:打开页面,对“美丽校园”创建超链接到。操作小贴士:

创建超链接:选定文字,“插入”、“超链接”,选定超链接的网页。学生合作学习,教师巡回辅导。教师展示学生作品,点评,小结。

教师提醒学生,做好后的网页,在浏览器里预览,发现有边框线,如何解决?学生自主探究。

文档为doc格式

网页的制作教学设计篇五1、知识与技能:

(1)、了解框架结构网页的概念及在网页中的作用,了解它与表格网页的区别。

(2)、掌握框架结构网页的建立、框架结构的拆分、框架的删除等。

(3)、掌握框架中页面设置及保存的方法,如设置初始网页按钮、新建网页按钮等。

2、过程与方法:

(1)、能够区分框架结构属性设置与网页属性设置的不同点。

(2)、通过框架结构网页设计,使学生对网页的整体结构有更进一步的认识。

3、情感态度与价值观:

(1)、能够将表格与框架结构网页结合使用,在创作中体验乐趣。

(2)、培养学生网页设计的审美意识、创新意识。

1、教学重点:

(1)、框架网页的作用和功能,框架的建立与属性设置。

(2)、框架中各个页面之间的关联,每个框中页面的设置方法。

(3)、框架网页的保存方法。

2、教学难点:

(1)、框架结构网页中框架属性与页面属性的设置方法。

(2)、理解框架结构的多页面存储方法及各页面之间的关联。

1、创设情境、导入新课

(1)、教师展示一组表格制作的网页,引导学生找出它们的共同特点。并提问如何快捷地制作这种网页(学生回答:使用复制、粘贴快捷地制作)。

(2)、教师又提问:有没有更好的方法呢?相同的区域我们能否只做一遍呢?从而导入新课——框架网页的制作。

设计意图:通过对比、比较,引导学生思考,激发学生学习的乐趣。

2、任务驱动、自主学习

(1)、教师展示一个框架网页,引导学生理解框架网页的概念。

(2)、出示任务一:框架网页的新建与保存。教师要求学生先阅读教材中的操作步骤,再尝试完成书本第227页的实践学习。

(4)、学生理解框架网页的概念,通过阅读教材中的内容,自学新建框架网页的操作,初步了解“新建网页”和“设置初始网页”两个按钮的不同,并认真聆听教师的讲解,注意观察,按要求模仿操作。

(7)、出示任务三:框架网页属性的设置。学生自主探究学习,有问题可向教师寻求帮助。教师基础扎实的同学完成任务后可进行拓展学习。

(8)、教师请学生示范操作,并说明自己设置的方法和原因。同时鼓励做的比较好的学生。

设计意图:培养学生的自主学习能力,对于课堂教学难点,学生在教师的讲解后模仿操作,有效突破难点。

3、展示作品、课堂小结

(2)、教师点评,并鼓励完成作品比较好的学生。

设计意图:拓展学生的视野,使学生了解框架的应用方法。展示优秀作品鼓励学生,激发学生的创作欲望。

的教学方法。教师可以简单介绍框架结构网页的功能及框架的建立与编辑方法,以及框架属性设置与网页属性设置的方法与区别。然后由学生根据教师提供的学案及演示动画,完成框架网页设计任务。

一、教学目标、知道站点、主页的概念,能在指定位置建立只有一个网页的站点;、认识frontpage的界面;、掌握在主页中插入文字、图片、水平线;、掌握页面文件与图片的保存。

二、教学重点、能在指定位置建立只有一个网页的站点(难点)、能在页面中插入文字、图片、水平线、掌握页面文件与图片的保存(难点)

三、学情分析

学生已经学习了word、powerpoint与上网浏览信息,对计算机的基本操作(word中文档的编辑,网页的浏览等)比较熟练。这使得学生主动探索、自主学习成为可能。每位学生必须完成基本任务,有能力的学生还可以完成提高篇的学习,以充分发挥学生的积极性与自主性。

四、教学方法

五、教学过程设计

教师活动:1、引入课题:(激发兴趣,活跃气氛)

问题2:网页是不是就是主页?(第一个页面称为主页,网站设计者可以确定哪一个是主页,主页的文件名一般为:,主页也是网页)

设计网站一般必须经过两个步骤,首先是在计算机里做好,然后发布在internet上,让所有的人访问浏览。

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

先来研究一下没有发布的网站,打开教师做的网站

问:同学们看到了什么?(文件夹)

总结:

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

请学生浏览教师课件,了解学习任务、新建站点

fp的启动

问:与word比较,有什么不同?

(增加了视图区,编辑区有三个窗口)

视图区:多种视图模式是为了方便网站的管理。制作网页时,必须在网页视图中编辑页面

普通窗口:鼠标在闪动,可编辑、修改页面,所见即所得的方式

预览窗口:浏览器中出现的效果,与powerpoint中的“放映幻灯片”类似。

html窗口:编写html(超文本标记语言,它是描述网页内容和外观的标准。)

打开导学软件,根据步骤,示范建立只有一个网页的站点,强调新站点的位置、路径的正确输入,站点的名称。

(教会学生利用导学课件,根据导学软件完成任务)

任务1:学生根据导学课件,在d:建立自己站点

教师巡视指导

请一位学生示范如何建立站点,教师总结

问:在文件夹列表中看到了什么?

教师巡视指导、总结反馈

总结:必须切换到“普通”窗口下编辑

主页的保存中存在问题:

教师巡视指导、教师与学生共同评价总结

展示学生作品,教师与学生共同评价

请学生总结今天的学习内容:建立包含一个页面的站点,主页的设计与保存。

注:课件中包含每一个操作过程的操作步骤及拓展的知识、基本任务与提高任务的效果图。

点评:

教学课题“网页制作”作为初中阶段的最后一部分内容,难度较大,教学的深度较难掌握。这就要教师在备教材的基础上,同时还要备学生,做到对学生的情况有较为深刻地了解,以便很好地完成教学任务,达到预期的教学效果。根据教材和《中小学信息技术课程指导纲要(试行)》中的精神,本课应以“任务驱动”的方式完成,一方面教会学生了解和熟悉具体软件的基本功能,另一方面又能主动地掌握并深入学习思考。寻着这个思路授课教师在课前作了大量的课前准备制作出了相应的教学课件“网页制作”。

一、调动学生的学习热情,变被动学习为主动学习

整个教学过程张云老师采取了“引导加任务驱动”的模式进行。首先教师进行导入,导入概念,强调概念;再引导学生学习课件的使用,引导他们读懂课件中的第一个任务:建立一个只有一页的网站,(此处若能引导学生,由学生来完成,减少老师的操作,效果会更好),然后让学生模仿第一步的操作进行下面内容的学习,完成导学材料中给出的一个个任务。

二、突出重点,及时点评

张云老师在引导学生进行学习、操作后,就主动地去观察和发现学生中出现的问题,甚至于课前对可能出现的问题,也进行有预见性地准备;发现问题及时点评。(点评分为个别点评和全班点评,点评不等于教师将操作过程演示一遍。张云老师在点评建成的网站时,重点若再突出些,介绍再清楚些,效果会更好。比如:站点中内容说明不够清楚等。)

三、发挥学生的协作学习精神

张云老师在教学过程中,对有困难的学生进行个别辅导,同时还需发挥学生的协作学习的精神,充分调动学生学习的积极性,让学有余力的学生充当“小老师”,从而体会到学习的乐趣。(整个教学过程中,这点做地不够,没有充分地让师生互动起来)

四、重点突出、目标明确

最后,张老师在整个教学过程中,应再突出教学重点,明确本节课的任务。(课前的导入,最好给出教学目标,课后的小结应让学生总结他本堂课学习到哪些知识,所以感觉这节课重点不突出,内容分散。)

五、教学效果较好

由于张云老师在课前对本课作了大量的准备工作,课件制作效果较好,所以学生完成情况很好,教学任务完成情况较好。

山东省昌乐二中滕学梅

【学情分析】

1.在学习网页制作之前,学生进行了网站的规划与设计,还没有就网页制作真正着手练习,对frontpage的使用比较陌生,但是已经有word等软件的操作基础,很多基本的操作可以迁移过来。并且,通过高一的学习与养成,学习小组的整体意识已经建立,组内合作、组间竞争的氛围已经形成,所以可以采用先进行自主练习,然后合作探究,通过各组推荐的作品展示进行评价,在展示的同时也提高了学生的技术水平。

课前准备:提前做好小组座次安排,由学科班长组织大家按组入座。

一、展示导入,明确学习目标(3分钟)

1.展示精彩网页(如北京大学、清华大学网站首页),引导学生简单分析网页风格。2.明确本节课学习目标与主要任务。

二、指导与点拨(3分钟)

三、基本功练习(10分钟)

1.任务:快速“克隆”示例网页。(素材发到桌面“基本功练习”文件夹中)

(2)每组的“技术顾问”完成任务后可下座指导;(3)完成后相互检查超链接的效果。

四、制作主题网页(15分钟)

2.具体要求参看导学案“实践探究”部分;可两人合作,有能力者最好独立完成;

五、作品推选、上传:每组推选一个作品参加组间评选,并将作品文件夹传至ftp。

六、精彩展示(10分钟)各组派一代表向全班展示自己的作品,并简介操作要点。展示前,引导全体学生积极思考以下问题:

1.你从展示作品中学到了什么?有哪些可借鉴之处?

注:1.学生展示过程中,教师要引导大家规范操作,对于重点加以强调。2.提醒学科班长记录参与展示和积极质疑、解答的同学,汇入评价。

七、完善提升:(5分钟)

1.借鉴所展示作品的优秀之处,进一步完善自己的作品;2.根据展示同学的演示,将新学到的操作尝试一遍。

八、总结:

1.网页制作要领:(1)灵活运用基本操作;(2)版面设计清晰、条理,或者有独特之处;(3)配色和谐,给人美感;(4)超链接顺畅、自由,方便使用。2.由学科班长公布本节课评价统计情况。

【教学反思】

1.在学生自主练习过程中,适时指导很重要,但教师一人肯定不能照顾全体学生,所以充分发挥学习小组的“技术顾问”的作用很关键。

2.在“制作主题网页”环节,给学生准备四个不同的主题素材是很有必要的,我们在进行教学设计时要考虑到学生个性、兴趣不同,并加以利用,促进教学。

THE END
1.网页设计网页模板专题模板网页设计网页模板图片素材下载我图网网页设计网页模板专题为您整理了7544个原创高质量网页设计网页模板图片素材供您在线下载,PSD/JPG/PNG格式网页设计网页模板模板下载、高清网页设计网页模板图片大全等,下载图片素材就上我图网。https://so.ooopic.com/sousuo/4665943/
2.网页设计模板手机模板 html5模板 css3模板 企业模板 bootstrap模板 html模板 css模板 商城模板 ecshop模板 后台模板 登录模板 响应式模板 扁平模板 宽屏模板 简历模板 美食模板 酒店模板 旅游模板 wp主题 创意互联网公司业务宣传网站模板 APP开发网页设计服务公司网站模板 UI设计开发工程师简历网页模板 企业登录页设计互联网公司http://sc.chinaz.com/tag_moban/wangyesheji_4.html
3.11个简单的HTML网页制作模板分享给你!1、电商类 HTML 网页制作模板 模板首页使用清晰美观的产品图片和视频,在清楚的展示产品的各个角度和重要细节的同时也可以吸引用户的注意力,模板包括注册、产品展示、页尾设计,页头设计,登录页设计等网页 UI 界面,供大家免费使用。 点击图片,免费使用同款 HTML 网页制作模板 https://js.design/special/article/simple-web-authoring-templates.html
4.分享15个精美的html网页模板,快速建站必备!以上就是本文所分享的Pixso资源社区中的html网页模板免费领取步骤,是不是特别简单?大家可以自己亲手尝试操作一下。那么,接下来就一起来看看这15组网页设计模板吧! 1. NFT市场仪表板 NFT市场仪表板 - 免费领取 这是一组免费的NFT市场仪表板html网页模板,包含浅色与深色2种设计模式,设计风格简约,排版布局清晰,色彩运https://pixso.cn/designskills/html-web-resourcel/
5.80套经典精美网页设计模板html模板打包分享/国内外优秀网页模板/html5我收集的80套经典网页设计模板html模板,Bootstrap扁平化网站模版,并且无密打包分享。里面还有国内外优秀网页模板,可以直接简单的修改就可以作为自己的主页。内容是大气漂亮的html+css网站模板。 不同种类,不同行业、不同风格的网页模板归好类别了,需要网页设计的朋友可以下载借鉴。 里面有博客个人、餐饮美食、单页、地产https://blog.csdn.net/hmz856/article/details/135452867
6.网页设计制作网站模板代码周末简设网页设计制作网站模板代码,周末简设,网页,个人网站,网页设计,站酷网,中国设计师互动平台.文件结构包含了css、fonts、images、js和html,运用html5技术,包括nav标签、header标签和footer标签等,采用bootstrap进行布局https://www.zcool.com.cn/work/ZNTA3MTIzNDg=.html
7.HTML网页模板网页模板网页制作网页设计DW网页设计模板轩创提供大量网站模板,HTML网页模板,网页模板,网页制作,网页设计DW,网页设计模板,代做网页设计,网站个人,联系微信:xuande006688http://www.htmlhot.com/
8.网站模板网页设计网页开发HTML生成工具在线制作网页美观专业的行业网页模板,搭配高效的可视化HTML构建器,免费在线设计网页,兼顾设计师和开发者,无需编程背景,支持可视化拖拽编程,摆脱繁琐的UI布局。高效页面产出,在线网页制作神器 !https://htmlpage.cn/
9.大学生网页设计成品个人网页制作HTML网页作业大学生HTML静态网页设计成品网提供PHP网页毕业设计作品、html css网页设计制作代码、DW网页设计与制作成品下载、网页定制代做,简单个人网页制作等。https://stu.iyuance.com/
10.网页设计彩色简历模板列表(含个人简历范文)简历本是一个免费的简历网站,提供海量彩色教育/传媒/广告行业网页设计个人简历模板,包括教育/传媒/广告行业网页设计彩色求职找工作简历模板、教育/传媒/广告行业网页设计彩色个人简历模板、教育/传媒/广告行业网页设计彩色Word简历模板、教育/传媒/广告行业网页设计彩色英https://www.jianliben.com/muban/tpl_263_caise/
11.网页模板,网站模板免费下载,做网站首选模板无忧模板无忧是国内最具人气的网站模板、网页模板下载站,提供网站模板、网页模板、程序模板下载及建站相关素材、教程资源。众多专业模板设计师,新模板每日更新http://www.mb5u.com/
12.模板王模板王精选上万个网页模板免费下载,提供html模板、个人网站模板、企业网站模板、DIV+CSS模板、响应式网站模板、手机网站模板等免费网页模板下载大全。https://www.mobanwang.com/
13.软件集成公司网站模板整站源码米拓建站为你提供专业的软件集成公司、系统集成等企业网站模板、企业网页模板、企业网站建设、网站设计制作服务,使用米拓企业建站系统轻松搞定电脑+平板+手机+微官网+小程序(微信、百度、支付宝、字节跳动、QQ、360)10合1企业官网,利于SEO优化排名,高端专业,简单易用!常见https://www.metinfo.cn/product/2665.html
14.网页制作模板2012-1 至 2012-2任职网页设计/制作薪资1000-2000元/月 工作职责:负责网页美工、图片的处理与设计制作 教育经历 2009-9 至 2011-10湖南信息科学职业学院计算机网络技术专业 陈笑语言能力 英语:一般 长沙简历模板延伸阅读,教你如何撰写一个优秀的个人简历。 https://www.liuxue86.com/k_%E7%BD%91%E9%A1%B5%E5%88%B6%E4%BD%9C%E6%A8%A1%E6%9D%BF
15.dreamweaver作业静态HTML网页设计模板篮球网页作业制作HTML实例网页代码, 本实例适合于初学HTML的同学。该实例里面有设置了css的样式设置,有div的样式格局,这个实例比较全面,有助于同学的学习,本文将介绍如何通过从头开始设计个人网站并将其转换为代码的过程来实践设计。 二、作品效果 视频演示 https://live.csdn.net/v/embed/239844 https://www.jianshu.com/p/6b36ac7e3f81
16.dw网页制作模板而网页制作,则成为了构建这个数字世界的基础。DW(Dreamweaver)作为一款流行的网页设计软件,其出色的网页制作模板应用让制作网页更为高效、规范化,本文将深入探讨DW网页制作模板的相关内容。 一、DW网页制作模板的概念 DW网页制作模板是基于DW软件开发的一类模板文件,其目的是方便用户快速地创建、设计并生成符合规范的网页https://wenku.baidu.com/view/10bd8d9dfa0f76c66137ee06eff9aef8941e4887.html
17.网页设计分享E都是国外e-webtemplates网站上的网页模板,自己用采集程序把下载链接采集下来的。大概一共159套,样式都很漂亮,每套都含有psd源文件和生成的html。 Simple blue templatePhoto portfolio template 下载地址 下载地址 Coporate designModern theme 下载地址 下载地址 https://www.php.cn/faq/11864.html
18.制作网页教学设计4)要求学生会模仿制作出该网页模板,并能够根据自己确立的主题制作一个网页模板。学生自主完成模板仿制,并自主探究设计一个复合自己设计主题的网页模板。小组内成员可相互交流,教师巡视,随时解决学生在学习过程中遇到的问题,并注意收集有共性的问题,并适时给以学生以点拨。尤其关注一下学困生。 https://www.ruiwen.com/jiaoxuesheji/7555540.html
19.350套html模板个人网页设计制作dw学生静态网页成品作业素材h5350套html模板 个人网页设计制作 dw学生静态网页成品 作业素材h5 昌吉,昌吉设计联盟商城网价:1.00,昌吉设计联盟商城网掌柜:honglovexuan2011,http://changji.witcp.com/shop/c2/t19adee896ba.html
20.东莞网站建设网页设计制作企业网站模板东莞企信网络公司专业为企业提供东莞网站建设、东莞做网站、东莞网站设计、东莞网站制作等企业网站建设、网页设计与制作、企业网站模板建站服务,16年东莞做网站经验,不只是建网站,更提供有价值的思路和整体网络服务。https://www.jzlwz.com/
21.网站设计在线网站制作网站图片模板在线设计平台Canva可画提供了海量的网站设计模板,覆盖绝大多数网站设计场景,只需选择喜欢的模板进行制作,即可轻松在线设计出精美的网站。https://www.canva.cn/create/website/
22.如何基于Dreamweaver模板设计网页了解如何使用 Dreamweaver 模板设计“固定的”页面布局;然后基于模板创建文档,创建的文档会继承模板的页面布局。模板是一种特殊类型的文档,用于设计“固定的”页面布局;然后您便可以基于模板创建文档,创建的文档会继承模板的页面布局。设计模板时,可以指定在基于模板的文档中哪些内容是用户“可编辑的”。使用模板,模板创https://help.adobe.com/zh_CN/Dreamweaver/CS5/Using/WScbb6b82af5544594822510a94ae8d65-7acca.html
23.网页模板设计素材HTMLCSSCMS模板免费下载模板 音效 音效 实录音效实录音效 短视频短视频 影视特效影视特效 UI&提示UI&提示 音效专辑音效专辑 设计练习设计练习 工具 AI配音AI配音 真人配音真人配音 音频编辑器音频编辑器 商用 免费商用 (CC协议)免费商用 (CC协议) 企业商用 (29元/首)企业商用 (29元/首)https://www.aigei.com/ui/web
24.免费学生dreamweaver网页作业知识,网页设计作业成品,学生html网页STU网页设计网站提供大学生HTML静态网页模板下载,PHP网页毕业设计作品及论文,html5网页设计制作代码,DW网页设计与制作成品下载,Dreamweaver网页设计作业免费教程,网页定制代做,简单个人网页制作https://www.stu-works.com/bangzhu/
25.jQuery网页特效最全网页模板和网站模板jQuery代码17素材网主要收集jQuery网页特效、jQuery网页代码、网站模板、网页模板、企业模板、商城模板、图标等素材,为html网站模板开发人员提供高效率的工作方式。https://www.17sucai.com/
26.网页设计与制作课程设计(精选10篇)篇1:网页设计与制作课程设计 一、设计目的 通过一个月的网页设计学习,设计一个简单的网站来检测自己的学习成果,看看哪些东西还没有掌握,需要进一步的去巩固!网页的设计区别于实体化的一些东西,其多为多媒体的存在,意味着它可以容纳更多的信息以及更多的展示形式,网页设计则要求设计者具备一些特殊技能以营造特定浏览情景https://www.360wenmi.com/f/filee6ikb6y3.html
27.网站模板大师网站模板制作网站模板大师专业提供网站模板制作,网页模板开发,网站源码下载,网站制作开发,北京网站建设等相关技术服务。我们致力于打造一个优秀的建站资源共享学习平台。http://www.moban4.com/
28.学生网页设计制作作业网页制作作业成品网页设计作业帮我作业网为有作业需求的大学生和代做作业的个人或商家提供信息交流平台,主要针对计算机方面:网页设计作业,网页制作作业,网页制作成品,计算机毕业设计代做,asp php asp.net c# java jsp动态网页作业,毕业设计论文等专业的课程作业, 期末作业和毕业设计。qq:182681http://www.85work.com/
29.网站设计软件下载网站美化软件网页设计软件网站设计软件里面有很多专业性的软件,有免费版可以进行下载,工具众多功能强大,可以快速设计出需要的网站,制作出有出色使用体验的界面,内部有众多模板可以进行参考,更加方便用户操作,设计更加简单,快来试试吧!http://www.downyi.com/key/wangzhanshejiruanjian/
30.dreamweaver怎么制作网页模板?Dreamweaver教程网页制作对于很多初学网页的人来说,dreamweaver常是首选的编辑软件。制作模板会大大提高网页的重复使用性,那如何使用dreamweaver制作模板网页呢?我这里以建一个唐诗宋词的网页为例。 Adobe Dreamweaver CS5(DW) 简体中文官方完整正式安装版 类型:网页设计 大小:404MB https://www.jb51.net/Dreamweaver/541033.html
31.《网页设计与制作》全套教案.docx全文免费√授课专业计算机信息管理、计算机网络技术、电子商务授课班级 201X级XXXX 班课程任务及目标本课程采用案例教学方法,主要任务是学习使用Dreamweaver创建、发布站点,为网页添加基本元素并进行属性设置,学习Html语言和CSS样式表的基本结构与语法,表格与框架布局、模板、库以及层、行为、插件的使用;掌握动态网页的设计基本知识与https://max.book118.com/html/2019/0805/6050151002002053.shtm
32.dw个人网页制作模板免费,如何用dw制作一个简单个人网页(dw制作好久不见,今天给各位带来的是dw个人网页制作模板免费,如何用dw制作一个简单个人网页,文章中也会对dw制作网页教程进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧! 怎么用dw制作网页 首先下载安装Dreamweaver,打开后,新建一个网页,一般选择“HTML”建立网页。选择“经典”界面,有助于我们更便捷使https://www.kdun.com/ask/33518.html