《网页制作》项目式教案

合集下载

网页制作教案

网页制作教案

网页制作教案网页制作教案一、教学目标1. 能够了解网页制作的基本概念和流程。

2. 能够掌握HTML语言的基本标签和常用属性。

3. 能够运用CSS样式进行网页的美化和排版。

4. 能够使用JavaScript语言进行简单的交互效果制作。

二、教学重点1. HTML标签和属性的使用。

2. CSS样式的运用。

3. JavaScript的基础应用。

三、教学内容与步骤1. 网页制作概述- 介绍网页制作的基本概念和流程。

- 分享一些优秀的网页设计案例,并引导学生分析其特点和优点。

2. HTML语言的学习与应用- 了解HTML语言的基本标签和作用。

- 学习常用的HTML标签的使用方法,并编写简单的HTML 页面。

- 进阶学习HTML标签的属性和使用方法。

3. CSS样式的学习与应用- 了解CSS样式的基本概念和作用。

- 学习CSS样式的使用方法,并为HTML页面添加样式。

- 进阶学习CSS样式的选择器和常用属性,实现更丰富的网页样式。

4. JavaScript语言的学习与应用- 了解JavaScript语言的基本概念和作用。

- 学习JavaScript语言的基本语法和常用事件。

- 进阶学习JavaScript的DOM操作和常用函数,实现网页的简单交互效果。

5. 实践与综合应用- 引导学生运用所学知识,制作一个完整的网站页面。

- 学生自行选择主题和内容,完成网站页面的设计、制作和优化。

- 学生之间进行评比,分享自己的作品和经验。

四、教学方法1. 预习导入法:通过分享和分析优秀的网页设计案例,激发学生的学习兴趣。

2. 讲授法:通过讲解和演示,系统地介绍HTML、CSS和JavaScript的语法和应用。

3. 实践法:通过设计和制作网页的实践活动,巩固学生所学知识。

5. 合作学习法:鼓励学生之间的互动和合作,通过分享和交流,促进学生的学习和提高。

六、教学评价方式1. 学生的作品评比:对学生制作的网站页面进行评比,评选出最佳作品。

《网页制作》项目式教案

《网页制作》项目式教案

长汀职业中专学校教案科目:《电商网页制作》计算机组:张开秀班级:15电商3、4班项目一初始dreamweaver8和建立站点项目二制作网站首页任务描述:上一个项目中,创建了“幽幽我心的个人网站”。

本项目将在这个站点中进行首页内容的制作,学习如何在网页中添加文本和图像,使用CSS设置文本、图像和页面的样式。

任务完成后效果如图所示:本项具体的教学过程共分为以下五个方面的任务:任务一添加首页文本(4课时)任务二编辑文本样式(4课时)任务三添加图像(4课时)任务四创建与应用CSS美化网页(4课时)任务五使用代码制作图文网页(4课时)任务一添加首页文本一、提出任务1.任务目标完成首页文本内容。

2. 解决的问题通过完成本任务学习修改网页标题,在网页中添加文本,分段换行和段内换行,输入连续空格,保存和预览网页等知识。

3. 本任务所涉及原有知识要点完成本任务所涉及原有知识要点有:使用站点管理功能创建站点,在文件面板中创建和打开首页文件。

二、教学目标1. 知识目标⑴掌握修改网页标题。

⑵掌握输入网页文本内容的方法。

⑶掌握网页编辑中三种不同换行方式的区别。

⑷了解在文档窗口中输入连续空格的几种方法。

⑸熟悉保存和预览网页的方法。

2. 能力目标掌握添加和编辑网页文本的基本操作,能够根据具体需求添加网页文本内容;通过参加科学探究活动,具有初步添加和编辑网页文本的能力,并加深对网页文本重要性的理解。

3. 情感目标通过分组完成任务,提高自主学习和协作学习的能力,培养团队精神。

三、教学分析与准备1. 教学重点⑴修改网页标题。

⑵输入网页文本内容的方法。

⑶在文档中对文本分段换行和段内换行,输入连续空格。

2.教学难点⑴网页编辑中三种不同换行方式的区别。

⑵在文档窗口中输入连续空格的几种方法。

3. 教学方法任务驱动学习和协作学习、探究学习相结合。

4. 课时安排4课时。

5. 教学环境多媒体网络教室。

四、教学过程(组织课堂、复习知识、教师引领完成任务占1学时;举一反三占3学时。

网页制作教案

网页制作教案

网页制作教案课程名称:网页制作教学目标:1.了解网页制作的基本概念和原则。

2.掌握网页设计的基本技巧和工具。

3.培养学生的创造力和团队合作能力。

4.通过实践项目,提高学生的问题解决和解决方案设计能力。

年级水平:初中高中课时数:10课时教学材料:1.计算机或笔记本电脑2.网页设计软件(如Adobe Dreamweaver)3.网页制作教材或参考书籍4.案例分析和示例网站课程安排:第一课:网页制作基础(1课时)- 介绍网页制作的定义和目的- 解释HTML和CSS的基本概念- 示范如何创建HTML文件并在浏览器中查看第二课:网页布局与设计(1课时)- 解释网页布局的重要性和原则- 演示如何使用CSS创建简单的网页布局- 强调网页设计的可读性和美观性第三课:文本和图像处理(1课时)- 讲解HTML中文本和图像标签的用法- 指导学生如何在网页中插入文本和图像- 鼓励学生使用样式和对齐技巧来提高页面的可视化效果第四课:超链接和导航(1课时)- 介绍超链接的概念和作用- 演示如何创建内部和外部链接- 引导学生设计网站导航菜单第五课:多媒体和互动元素(1课时)- 解释如何在网页中嵌入音频和视频- 演示如何创建表单和添加交互元素- 鼓励学生设计交互式网页元素以增加用户体验第六课:响应式网页设计(1课时)- 解释响应式网页设计的概念和原则- 演示如何使用媒体查询和流式布局创建响应式网页- 强调在不同设备上测试和优化页面的重要性第七至八课:案例分析与实践项目(2课时)- 分析和讨论一些成功的网站案例- 指导学生进行网页设计项目,包括规划、设计和实施阶段- 提供指导和反馈,帮助学生改进他们的网页设计技能第九至十课:项目呈现与总结(2课时)- 学生展示他们的网页设计项目- 分享项目中的挑战和解决方案- 提供指导和建议以进一步完善他们的设计作品- 结束课程时,总结学生的学习成果和进步评估方法:1.课堂参与和表现评估2.项目成果评估3.网页设计作品展示和评估备注:以上教案仅供参考,具体的教案内容和安排可根据实际情况进行调整和优化。

《制作网页》教学设计(精选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制作首页(欢迎页)到表格页的超链接。

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

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

《网页制作》教学设计(5篇)作为一名优秀的教导工,通常会被要求编写教学设计,借助教学设计可以提高教学质量,收到预期的教学效果。

则写教学设计须要留意哪些问题呢?下面是我收拾的《网页制作》教学设计〔精选5篇〕,欢送阅读与收藏。

《网页制作》教学设计1一、教材或教学内容分析本章内容在本教材中的位置处于第五章,是在文字处理(Word2000)和网络根底及因特网应用两章之后。

学生所学的文字处理软件Word和将要学习的网页制作软件Frontpage同是Microsoft公司的产品,在软件的使用上有无数的共通之处,所以在学习frontpage的时候,无数内容可以让学生自学,而不必面面俱到地在课上讲授。

而第四章网络根底及因特网的应用又为学生对网页的理解奠定了根底,学生对网页中的根本元素——文字、图片、动画、声音等都有所了解,而网页的制作就是将这些元素重新组合到网页上,学生要学的就是这种组合的办法。

所以说,虽然大多数学生以前都未接触过网页的制作,但有了以上这些根底,学起来就轻巧多了。

本章内容根据学生已有的根底,我对教学内容分了一下类,也为教学的组织工作打下一点根底。

本章内容主要由网页根底学问、网站的建设和管理、网页的制作、创立超链接、图片的处理、网页框架。

重点是网页的制作和创立超链接,学会了这些就可以开场容易的网页制作了。

难点是网页框架,这局部互相之间关系比拟冗杂,必要时,教师在对各组个别辅导时,可以赋予分离解说。

这个分类可以为组长支配各个组员的任务提供参考,使分工越发合理。

二、教学对象的分析信息技术课虽然已经成为初中的必修科目,但是城乡学生之间控制状况的差别却相当大,条件好一点的初中学生不仅已经娴熟控制了课本上的内容,还对一些常用软件有所了解;而差一点的可以说是从高中开场才正式接触到信息技术学问的学习,他们须要多锻炼、多指导,所以配合学习对学生的学习帮忙很大。

三、教学策略的挑选及媒体的使用在教学策略的挑选上,我使用的是任务驱动和配合学习相结合的办法。

网页制作教学设计

网页制作教学设计

网页制作教学设计(经典版)编制人:__________________审核人:__________________审批人:__________________编制单位:__________________编制时间:____年____月____日序言下载提示:该文档是本店铺精心编制而成的,希望大家下载后,能够帮助大家解决实际问题。

文档下载后可定制修改,请根据实际需要进行调整和使用,谢谢!并且,本店铺为大家提供各种类型的经典范文,如工作总结、实习报告、职业规划、职场语录、规章制度、自我介绍、心得体会、教学资料、作文大全、其他范文等等,想了解不同范文格式和写法,敬请关注!Download tips: This document is carefully compiled by this editor. I hope that after you download it, it can help you solve practical problems. The document can be customized and modified after downloading, please adjust and use it according to actual needs, thank you!Moreover, our store provides various types of classic sample essays, such as work summaries, internship reports, career plans, workplace quotes, rules and regulations, self introductions, insights, teaching materials, complete essays, and other sample essays. If you want to learn about different sample formats and writing methods, please pay attention!网页制作教学设计网页制作教学设计(通用5篇)作为一名老师,时常要开展教学设计的准备工作,教学设计是实现教学目标的计划性和决策性活动。

网页制作第一节教案

网页制作第一节教案

【第六章第一节网页制作】教案一、【教学目标】1、理解网页与网站的概念3、掌握页面文件与图片的保存二、【教学重点】三、【难点、关键】1.建站点的位置2.页面文件与图片的保存四、【教学方法】演示、任务驱动法五、【课时安排】3课时六、【教学环境】多媒体教育广播系统,Dreamweaver软件七、【教学过程】第1课时1.导入新课师:上节课已经讲了信息集成(也就是网站建设)的一般过程包括四个阶段,现在请同学们回顾一下。

生:学生作答。

师:同学们平时都有喜欢上网,那大家知道网站与网页的区别吗?概念:网页:通常我们在WWW上所能看到的每一个页面都称之为网页,它能够形象地比喻成一篇文章.网站:网站是多个网页的集合,即由多个网页通过彼此相连而构成的一个整体,能够形象地比喻成一本杂志或一本书.下面我们来学习如何用Dreamweaver这个软件制作网页。

2.新课讲述在制作个人网站之前,应先确定网站的主题。

2008奥运会即将来临,这是中国政治,经济等综合国力提升到另一台阶的盛事,我们中学生也得供献一分锦力本节课的主题是围绕“心系奥运”,资料(包括文字、图片、动画)等我已经为大家收集好,内容分类,网站的结构也规划好了,利用Dreamweaver这个工具来完成“心系奥运”这个网站的建设一、启动Dreamweaver,理解其工作界面“开始”-“程序”-“Macromedia Dreamweaver 8”Dreamweaver工作界面包括:菜单栏插入栏编辑窗口属性面板浮动面板组1.菜单栏(包括10个菜单项)符号所表示的含意黑色命令:表示该命令当前是可用的灰色命令:表示该命令当前是不可用的,需要满足一定的条件后才能使用。

带有复选标记√的命令:表示该命令是一种可选择命令,若前面出现√标记,表示该命令正在使用;若没有√标记时,表示该命令没有被使用。

带有三角形▼的命令:表示在该命令下还有下一级子菜单命令。

带有省略号的…的命令:表示选择命令后会弹出一个相关的对话框。

《网页制作》项目式教案

《网页制作》项目式教案

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

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

3. 能够独立完成一个简单的网页制作项目。

二、教学内容1. 网页制作基本概念:网页、网站、HTML、CSS、JavaScript等。

2. HTML基本语法及应用:创建网页结构、添加图片、、表格等。

3. CSS基本语法及应用:设置字体、颜色、布局、样式等。

4. JavaScript基本语法及应用:实现动态效果、交互功能等。

5. 网页制作流程:需求分析、设计、编码、测试、发布等。

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

2. 示范:展示实际操作过程,让学生跟随操作。

3. 练习:学生独立完成练习题,巩固所学知识。

4. 项目实践:学生分组完成一个简单的网页制作项目。

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

2. 教学素材:教案、PPT、示例代码、练习题、项目任务书等。

3. 学生设备:电脑、编程环境(如VS Code、Sublime Text等)。

五、教学安排1. 课时:20课时(每课时45分钟)。

2. 教学进度安排:第一课时:介绍网页制作基本概念和流程。

第二课时:讲解HTML基本语法及应用。

第三课时:讲解CSS基本语法及应用。

第四课时:讲解JavaScript基本语法及应用。

第五课时:讲解网页制作流程。

后续课时:学生分组完成项目实践,教师辅导。

六、教学评价1. 课堂参与度:观察学生在课堂上的发言和提问情况,评估学生的参与度。

2. 练习题完成情况:检查学生完成练习题的情况,评估学生对知识的掌握程度。

3. 项目实践:评估学生在项目实践中的表现,包括网页设计、编码、测试等环节。

4. 小组合作:观察学生在小组合作中的角色和贡献,评估学生的团队合作能力。

七、教学反思1. 课堂讲解:反思教学过程中是否清晰、生动地讲解知识点,是否及时解答学生的疑问。

2. 实践环节:反思项目实践的设计和指导是否合理,是否能够激发学生的创新和解决问题的能力。

《网页的制作》教案【优秀3篇】

《网页的制作》教案【优秀3篇】

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

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

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

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

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

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

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

请学生浏览教师课件,了解学习任务2、新建站点FP的启动问:与word比较,有什么不同?总结:预览窗口:浏览器中出现的效果,与PowerPoint中的“放映幻灯片”类似。

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

《网页制作》课程教学设计

《网页制作》课程教学设计

《网页制作》课程教学设计一、教材分析《网页制作》是我校学生的主修科目。

在这之前,学生已经学习了《网络应用基础》,已初步掌握了因特网信息的浏览、检索、下载及电子邮件的使用等基本操作技能。

因此,学生已经具备了获取信息的能力,《网页制作》的教学则侧重培养学生对信息的组织和表达能力,这对于加强学生的信息意识,提高信息处理能力有着重要作用;网页设计给学生提供了展示个性、自主创新的舞台;网页评价使学生了解内容编排的原则,页面布局和色彩搭配的重要性,提高他们的艺术修养和审美情趣。

教学过程中使用的网页制作软件是Dreamweaver8。

由于Dreamweaver8采用了图形化的操作界面,并且可以根据用户创建的网页对象自动生成HTML代码,所以,在整个教学过程中,可以采用“任务驱动”的教学模式;学生通过“小组协作”的学习方式,在教师的指导下自主学习新知识和掌握新技能。

二、设计思想1、任务驱动“任务驱动”的教学原则是:学生的学习活动与大的任务或问题相结合,以探索问题来引发和维持学习者的学习兴趣和动机;创建真实的教学环境,让学生带着真实的任务去学习,在整个过程中,学生拥有学习的主动权,教师不断引导和激励学生前进,从而使学生真正掌握所学的内容,并通过此任务举一反三,收到更好的学习效果。

《网页制作》可以将创建一个“班级网页”作为教学的主线,教师通过创设情境,激发学生的创作欲望,把总任务划分到每个单元知识的学习中去,按照学生的制作进程来布置和调整子任务,使学生在教师的引导下逐步达成教学目标。

由于整个任务是以学生的学习生活为题材,相关的信息来自学生生活的班集体,所以能够激发学生的学习兴趣和创作欲望,使他们的学习态度从“要我学”到“我要学”发生巨大转变,从而顺利地完成学习任务。

2、小组协作协作学习是指学生以多人为单位分组协作学习,以培养协作精神和提高学习效率。

在协作学习过程中,个人学习的成功与他人学习的成功是密不可分的,学习者之间保持融洽的关系和相互协作的态度,共享信息和资源,共同负担学习责任,完成学习任务。

《网页制作》项目式教案

《网页制作》项目式教案

《网页制作》项目式教案第一章:网页制作基础知识1.1 教学目标让学生了解网页制作的基本概念和流程。

让学生掌握HTML和CSS的基本语法和用法。

1.2 教学内容网页制作的基本概念和流程。

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

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

1.3 教学活动讲解和演示网页制作的基本概念和流程。

通过示例让学生动手编写HTML和CSS代码,加深理解。

1.4 教学评价检查学生对网页制作基本概念的理解程度。

评估学生对HTML和CSS代码的编写能力。

第二章:网页布局与设计2.1 教学目标让学生了解网页布局的基本方法和技巧。

让学生掌握常用的网页设计原则和技巧。

2.2 教学内容网页布局的基本方法和技巧,如固定布局、百分比布局、浮动布局等。

常用的网页设计原则和技巧,如对齐、间距、颜色搭配等。

2.3 教学活动讲解和演示网页布局的基本方法和技巧。

通过示例让学生动手实践,设计出美观的网页布局。

2.4 教学评价检查学生对网页布局方法和技巧的理解程度。

评估学生对网页设计原则和技巧的运用能力。

第三章:网页动画与交互3.1 教学目标让学生了解网页动画和交互的基本概念和实现方法。

让学生掌握JavaScript和CSS动画的基本语法和用法。

3.2 教学内容网页动画和交互的基本概念和实现方法,如动画原理、交互事件等。

JavaScript和CSS动画的基本语法和用法,如动画函数、过渡效果等。

3.3 教学活动讲解和演示网页动画和交互的基本概念和实现方法。

通过示例让学生动手编写JavaScript和CSS动画代码,实现网页动画和交互效果。

3.4 教学评价检查学生对网页动画和交互基本概念的理解程度。

评估学生对JavaScript和CSS动画代码的编写能力。

第四章:网页优化与推广4.1 教学目标让学生了解网页优化的基本方法和技巧。

让学生掌握网页推广的基本方法和技巧。

4.2 教学内容网页优化的基本方法和技巧,如代码优化、图片优化、加载速度优化等。

《网页制作》项目式教案

《网页制作》项目式教案

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

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

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

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

2. HTML的基本语法和常用标签。

3. CSS的基本语法和常用样式。

4. JavaScript的基本语法和常用函数。

5. 网页设计的原则和技巧。

三、教学方法1. 讲授法:讲解网页制作的基本概念、HTML、CSS和JavaScript的基本语法。

2. 案例分析法:分析经典网页案例,引导学生掌握网页设计的原则和技巧。

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

四、教学环境1. 计算机教室:每台计算机都安装有网页制作相关软件。

2. 网络环境:教室内的计算机可以正常连接互联网。

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

2. 课后作业:学生完成的网页设计作品。

3. 实践操作能力:学生在课堂上的实际操作表现。

六、教学资源1. 教材:《网页制作教程》2. 课件:教师准备的PPT3. 案例库:收集的各种经典网页设计案例4. 在线资源:互联网上的网页制作相关教程和素材5. 辅助工具:网页制作软件(如HTML编辑器、CSS预处理器等)七、教学安排1. 课时:本课程共计32课时,每课时45分钟。

2. 教学计划:第1-4课时:讲解网页制作的基本概念和流程第5-8课时:学习HTML的基本语法和常用标签第9-12课时:学习CSS的基本语法和常用样式第13-16课时:学习JavaScript的基本语法和常用函数第17-20课时:分析经典网页案例,掌握网页设计的原则和技巧第21-24课时:实践操作,制作一个简单的网页第25-28课时:学生作品展示和评价八、教学步骤1. 引入:通过展示经典网页案例,引发学生对网页制作的兴趣。

2. 讲解:详细讲解网页制作的基本概念、HTML、CSS和JavaScript的基本语法。

《网页制作》项目式教案

《网页制作》项目式教案

《网页制作》项目式教案一、教学目标1. 知识与技能:了解网页制作的基本概念和流程。

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

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

2. 过程与方法:通过案例分析和实践操作,培养学生的创新思维和团队协作能力。

学会使用网页制作工具,如网页编辑器和浏览器开发者工具。

学会利用网络资源,进行网页素材的搜索和整理。

3. 情感态度与价值观:培养学生的信息技术素养,提高他们对网络文化的认识和理解。

培养学生热爱科学、勇于探索的精神风貌。

培养学生团队协作、共同进步的合作意识。

二、教学内容1. 网页制作基本概念和流程网页的定义和特点网页制作的流程和步骤网页编辑器和浏览器开发者工具的使用2. HTML基本语法和应用HTML标签的概念和作用常用的HTML标签及其属性表格、表单和图片标签的使用3. CSS基本语法和应用CSS的选择器和语法结构常用的CSS属性和值盒子模型和布局控制4. JavaScript基本语法和应用JavaScript的概念和作用基本数据类型和运算符条件语句和循环语句5. 网页素材的搜索和整理网络资源的获取方法素材的选择和处理技巧素材的版权和合法使用三、教学重点与难点1. 教学重点:HTML、CSS和JavaScript的基本语法和应用。

网页制作的基本流程和步骤。

网页素材的搜索和整理方法。

2. 教学难点:JavaScript编程逻辑和函数的运用。

响应式网页设计和浏览器兼容性问题。

网页美化和创意设计。

四、教学方法与手段1. 教学方法:项目式教学法:以实际项目为主线,引导学生全程参与,培养实际操作能力。

案例教学法:通过分析典型案例,使学生更好地理解和掌握知识。

任务驱动法:布置具体的任务,让学生在完成任务的过程中学习和进步。

2. 教学手段:利用多媒体教室,进行PPT讲解和屏幕演示。

使用网络资源和教学平台,进行案例分析和在线交流。

利用网页制作工具和开发者工具,进行实践操作。

《网页制作》教案

《网页制作》教案

《网页制作》教案第一章:网页制作基础知识1.1 教学目标让学生了解网页制作的基本概念让学生掌握HTML和CSS的基本语法让学生了解网页制作的基本流程1.2 教学内容网页制作基本概念介绍HTML和CSS的基本语法介绍网页制作的基本流程介绍1.3 教学方法讲授法:讲解网页制作的基本概念、HTML和CSS的基本语法演示法:演示网页制作的基本流程1.4 教学评估课堂练习:让学生编写简单的HTML和CSS代码课后作业:让学生完成一个简单的网页制作任务第二章:HTML基本标签2.1 教学目标让学生掌握HTML的基本标签及其使用方法2.2 教学内容文本标签:`<p>`、`<h1>` ~ `<h6>`、`<br>`等图片标签:`<img>`标签:`<a>`列表标签:`<ul>`、`<ol>`、`<li>`、`<dl>`、`<dt>`、`<dd>`2.3 教学方法讲授法:讲解各个标签的作用和基本属性练习法:让学生通过练习掌握各个标签的使用方法2.4 教学评估课堂练习:让学生编写含有文本、图片、和列表的HTML代码第三章:CSS样式设计3.1 教学目标让学生掌握CSS的基本语法和使用方法让学生了解常用的CSS选择器和属性3.2 教学内容CSS基本语法:选择器、属性、值、注释内联样式:`style`属性内部样式表:`<style>`标签外部样式表:`.css`文件常用的CSS选择器和属性:`id`、`class`、`tag`、`attribute`等3.3 教学方法讲授法:讲解CSS的基本语法和常用选择器、属性练习法:让学生通过练习掌握内联样式、内部样式表和外部样式表的使用方法3.4 教学评估课堂练习:让学生编写含有内联样式、内部样式表和外部样式表的HTML代码第四章:布局与设计4.1 教学目标让学生掌握HTML和CSS的布局与设计方法4.2 教学内容盒模型:`margin`、`padding`、`border`、`width`、`height`等浮动布局:`float`、`clear`等定位:`position`、`top`、`right`、`bottom`、`left`等响应式设计:媒体查询、`max-width`、`min-width`等4.3 教学方法讲授法:讲解盒模型、浮动布局、定位和响应式设计的基本概念和用法练习法:让学生通过练习掌握各种布局与设计方法4.4 教学评估课堂练习:让学生编写一个具有多种布局与设计效果的网页代码第五章:网页特效与交互5.1 教学目标让学生掌握HTML和CSS实现简单网页特效与交互的方法5.2 教学内容鼠标悬停效果:`:hover`伪类动画与过渡:`animation`、`transition`等事件处理:`onclick`、`onmouseover`、`onmouseout`等JavaScript基础:变量、函数、条件语句、循环语句等5.3 教学方法讲授法:讲解鼠标悬停效果、动画与过渡、事件处理和JavaScript基础练习法:让学生通过练习掌握各种网页特效与交互的实现方法5.4 教学评估课堂练习:让学生编写一个具有鼠标悬停效果、动画与过渡、事件处理和简单交互的网页代码第六章:表单与数据验证6.1 教学目标让学生掌握HTML表单的基本用法让学生了解CSS在表单设计中的应用让学生学会使用JavaScript进行数据验证6.2 教学内容表单标签:`<form>`、`<input>`、`<textarea>`、`<select>`等表单属性:`type`、`name`、`value`、`placeholder`等CSS在表单设计中的应用:`label`、`fieldset`、`legend`等数据验证方法:正则表达式、JavaScript函数6.3 教学方法讲授法:讲解表单标签、属性和CSS在表单设计中的应用演示法:演示数据验证的实现方法练习法:让学生通过练习掌握表单和数据验证的实现方法6.4 教学评估课堂练习:让学生编写一个具有表单和数据验证功能的网页代码第七章:多媒体与嵌入式内容让学生掌握HTML中多媒体和嵌入式内容的基本用法7.2 教学内容音频和视频标签:`<audio>`、`<video>`图片标签:`<img>`嵌入式内容:`<iframe>`、`<embed>`、`<object>`多媒体属性:`src`、`controls`、`autoplay`、`loop`等响应式多媒体:`max-width`、`height`、`srcset`等7.3 教学方法讲授法:讲解多媒体和嵌入式内容的标签和属性练习法:让学生通过练习掌握多媒体和嵌入式内容的实现方法7.4 教学评估课堂练习:让学生编写一个含有音频、视频、图片和嵌入式内容的网页代码第八章:JavaScript进阶8.1 教学目标让学生掌握JavaScript的基本语法和高级特性让学生学会使用JavaScript进行复杂交互设计8.2 教学内容基本语法:变量、函数、条件语句、循环语句等对象和数组:`document`、`window`、`Array`、`Object`等事件处理:`addEventListener`、`attachEvent`等高级特性:闭包、原型链、异步编程(Promise、async/awt)等讲授法:讲解JavaScript的基本语法和高级特性练习法:让学生通过练习掌握JavaScript编程方法8.4 教学评估课堂练习:让学生编写一个利用JavaScript实现复杂交互功能的网页代码第九章:网页优化与性能提升9.1 教学目标让学生了解网页优化的重要性让学生掌握网页优化的方法和技巧9.2 教学内容代码优化:减少代码体积、提高代码效率资源优化:图片压缩、雪碧图、CSS Sprites、CDN等性能检测工具:浏览器开发者工具、PageSpeed Insights、Lighthouse等响应式设计:媒体查询、`max-width`、`min-width`等9.3 教学方法讲授法:讲解网页优化方法和技巧实践法:让学生使用性能检测工具进行实际网页性能分析9.4 教学评估课后作业:让学生分析并优化一个实际存在的网页性能问题第十章:网页制作项目实战10.1 教学目标让学生学会将所学知识应用于实际项目培养学生独立完成网页制作的能力10.2 教学内容项目选题:选择一个实际网页制作项目项目分析:分析项目需求、功能模块、技术选型等项目实施:按照分析结果进行网页制作项目评价:评价项目的完成情况、性能、可维护性等10.3 教学方法讲授法:讲解项目选题、分析和评价的方法实践法:让学生独立完成实际项目10.4 教学评估课后作业:让学生提交完成的实际项目并进行评价重点和难点解析1. 第五章:网页特效与交互2. 第六章:表单与数据验证3. 第八章:JavaScript进阶4. 第九章:网页优化与性能提升5. 第十章:网页制作项目实战全文总结和概括:本文针对《网页制作》教案中的五个章节进行了重点和难点的解析。

《网页制作》项目式教案

《网页制作》项目式教案

《网页制作》项目式教案一、教案简介本教案以项目式教学法为主线,通过一系列实践项目,让学生掌握网页制作的基本知识和技能。

学生将学习HTML、CSS、JavaScript等前端技术,并能运用这些技术制作出功能丰富、界面美观的网页。

二、教学目标1. 了解网页制作的基本概念和流程。

2. 掌握HTML、CSS、JavaScript三种前端技术的基本用法。

3. 能够独立完成一个简单的网页制作项目。

三、教学内容1. 网页制作基本概念:网页、网页元素、网页结构等。

2. HTML基本语法:标签、属性、注释等。

3. CSS样式表:选择器、属性、优先级、盒模型等。

4. JavaScript基本语法:变量、数据类型、运算符、函数等。

5. 网页布局与设计:浮动、定位、响应式设计等。

四、教学方法1. 项目式教学:以实际项目为载体,让学生在实践中学习。

2. 案例分析:分析经典案例,让学生了解实际应用。

3. 课堂讲解与练习:讲解理论知识,配合课后练习巩固所学。

4. 小组讨论与合作:培养学生团队协作能力,共同解决问题。

五、教学环境1. 硬件环境:计算机、投影仪、白板等。

2. 软件环境:文本编辑器(如Notepad++)、浏览器(如Chrome、Firefox)、网页设计软件(如Dreamweaver、Sublime Text等)。

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

2. 课后作业:评估学生完成的课后作业的质量,包括对HTML、CSS和JavaScript 的掌握程度。

3. 项目完成情况:评估学生在项目制作过程中的表现,包括网页设计、布局和功能实现。

4. 小组合作:评估学生在小组合作中的表现,包括团队协作能力和解决问题能力。

七、教学计划1. 第1周:网页制作基本概念和HTML基本语法。

2. 第2周:CSS样式表和网页布局与设计。

3. 第3周:JavaScript基本语法和案例分析。

网页制作教案

网页制作教案

网页制作教案一、教学目标:1.了解网页制作的基本概念和流程。

2.学会使用HTML标签进行网页布局和设计。

3.掌握常用的CSS样式设置方法。

4.能够制作简单的静态网页。

二、教学重点:1.HTML标签的使用和常用标签的属性设置。

2.CSS样式的设置和应用。

三、教学难点:1.CSS样式的排列和选择器的使用。

2.布局和设计的规范和技巧。

四、教学方法:1.讲授相结合的教学法。

2.示范演示和实操练习相结合。

五、教学内容和步骤:1.网页制作的简介和基本概念(10分钟)教师简要介绍网页制作的定义、作用和流程,让学生了解到网页制作的重要性和应用领域。

2.HTML标签和基本布局(20分钟)教师讲解HTML标签的概念和常用标签的语法和属性设置方法,如标题标签、段落标签、链接标签等。

并结合实例演示如何使用这些标签进行网页布局。

3.CSS样式设置(30分钟)教师讲解CSS样式的概念和设置方法,包括内联样式、内部样式和外部样式的使用。

并结合实例演示如何设置字体样式、颜色、背景等。

4.网页设计规范和技巧(15分钟)教师介绍一些常用的网页设计规范和技巧,如页面整体布局、导航栏设计、图片使用等。

并结合实例演示如何运用这些规范和技巧进行网页设计。

5.实操练习(30分钟)学生结合所学的知识,自行设计和制作一个简单的静态网页。

教师提供必要的指导和帮助。

六、教学资源和工具:1.电脑、投影仪和互联网连接设备。

2.教材和教学PPT。

3.HTML和CSS的编辑器,如Sublime Text、Visual Studio Code等。

七、教学评价与反思:1.课堂小测,检查学生对于HTML标签和CSS样式的掌握程度。

2.学生的实操练习作品评价,包括布局、样式和设计的规范和创意程度。

3.学生的课后作业,巩固和深化所学内容。

4.教学结束后,进行反思和总结,发现不足和改进的地方,为下一次教学做准备。

《网页制作》教案

《网页制作》教案

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

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

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

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

网页制作的目的是什么?网页由哪些基本元素组成?网页制作的流程是怎样的?2. HTML的基本语法和用法。

HTML是什么?如何编写一个简单的HTML文件?HTML的基本标签有哪些?3. CSS的基本语法和用法。

CSS是什么?如何为一个元素添加CSS样式?CSS的基本选择器有哪些?4. JavaScript的基本语法和用法。

JavaScript是什么?如何编写一个简单的JavaScript文件?JavaScript的基本语法有哪些?5. 制作并发布一个简单的网页。

如何使用HTML、CSS和JavaScript制作一个简单的网页?如何将网页发布到互联网上?三、教学方法1. 讲授法:讲解网页制作的基本概念和流程,HTML、CSS和JavaScript的基本语法和用法。

2. 实践法:引导学生动手实践,制作并发布一个简单的网页。

3. 问答法:通过提问和回答的方式,帮助学生巩固所学知识。

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

2. 软件环境:文本编辑器(如Notepad++或Sublime Text),网页浏览器(如Chrome或Firefox),FTP客户端(如FileZilla)。

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

2. 作业完成情况:检查学生完成的网页制作作业,评估其对HTML、CSS和JavaScript的掌握程度。

3. 期末考试:设置一道关于网页制作的题目,测试学生对所学知识的综合运用能力。

六、教学资源1. 教材:推荐使用《HTML与CSS设计与构建网页》等权威教材。

2. 案例库:收集一些优秀的网页设计案例,用于分析和学习。

3. 在线资源:提供一些优秀的在线教程和工具,如w3schools、MDN Web Docs等。

《网页制作》项目式教案

《网页制作》项目式教案

《网页制作》教案科任:王贤全班级:高二(8)班课时:10节×4周=40节作业:40次时间:2010.11.1——2010.11.26项目四制作“心情日记”网页本项目通过“创建框架集”、“使用链接控制框架内容”和“制作媒体日记页面”三个任务完成“幽幽我心的个人网站”中“心情日记”栏目的制作,学习如何使用框架结构来布局页面及如何在网页中插入多媒体文件,任务完成后效果如图:本项目具体的教学过程共分为以下四个方面的任务:任务一创建框架集(4课时)任务二使用链接控制框架内容(4课时)任务三制作媒体日记网页(4课时)任务四使用代码制作框架网页(4课时)任务一创建框架集一、提出任务1.任务目标创建“心情日记”页面的框架结构。

2. 解决的问题本任务通过在“心情日记”页面创建框架集并设置属性,学习创建框架集以及设置框架集和框架属性的知识。

3. 本任务所涉及原有知识要点完成本任务所涉及原有知识要点有:创建网页、在网页中添加内容、添加超链接等。

二、教学目标1. 知识目标⑴了解框架的含义。

⑵掌握框架集的创建。

⑶掌握框架的选择。

⑷掌握框架集的选择。

⑸掌握框架属性设置。

⑹掌握框架集属性设置。

2. 能力目标能够利用框架布局页面,设置框架属性。

3. 情感目标培养学生不怕困难、积极探索的优良作风,增强学生审美能力,给学生以成功的体验。

三、教学分析与准备1. 教学重点⑴框架的含义。

⑵创建框架集。

⑶设置框架属性。

⑷设置框架集属性2.教学难点⑴显示框架边框。

⑵设定框架的滚动格式。

⑶框架的边框样式。

3. 教学方法任务驱动学习和协作学习、探究学习相结合。

4. 课时安排4课时。

5. 教学环境多媒体网络教室。

四、教学过程(组织课堂、复习知识、教师引领完成任务占1. 5课时;举一反三占2.5课时。

)4.创建如下图所示的框架集网页“practice4-3.html”。

任务二使用链接控制框架内容一、提出任务1.任务目标在“心情日记”页面创建链接,使用链接控制框架内容。

网页制作教学计划(优秀7篇)

网页制作教学计划(优秀7篇)

网页制作教学计划(优秀7篇)网页制作教学计划篇一新学期开始,本学期我将担任11级计算机网络班《网页制作》的教学,为了有效地培养学生学习网页制作课程的兴趣,使学生逐步具备利用所学知识进行网页制作的能力,以适应信息社会的学习、工作和生活的需要;为了规范教学,我特制订教学计划如下:一、教学指导思想:本学期我将认真做好所教课程的各项工作。

认真学习中职计算机学科的教学大纲和网页制作的相关教材,明确教学任务和教材体系,力争“教书”与“育人”贯穿始终。

全面贯彻教育部关于中职教育的大政方针,努力探索计算机教学规律,在激发和培养学生的学习兴趣,养成良好的学习习惯,提高动手能力的同时,着力培养学生树立正确的荣辱观和人生观,积极推进素质教育。

在教学中要充分利用计算机来培养学生的信息素养,有效地提高教育教学水平。

促进学生创新精神和实践能力的培养,充分考虑学生的发展需要,强调学生自主学习,发挥教师的主导作用,学生主体作用,以学生个体发展为目标,不断提高教育教学质量。

二、学生情况分析:上学期学生已经初步学习了部分课程,对此可能有了一定的了解,但是中职学生整体素质层次不齐,绝大多数学生学习目标明确,但也有少数学生对微机在当前和末来社会中作用认识不够。

虽然有基础但是通过一个假期之后,很多知识需要巩固。

但总体来看本课程学生们的学习兴趣还是很好的。

三、教材分析我们选用的是电子工业出版社出版的《网页制作》第二版教材。

本教材的编写打破了传统的学科体系,以项目为中心,一个个小任务为实例,以范例网站的建设为主线,不强求理论体系的完整性,以够用为度,以是否实用为标准。

整个项目统筹考虑实训的设计,循序渐进,逐步完善,着重培养学生独立思考问题和主动解决问题的能力,力求在学习的过程中积累实际工作的经验,从而突出职业技术教育的特色。

本书共8章,前面已学习了前三章,本学期主要学习后五章。

第四章打造企业留言板本章的教学重点和难点是插入表单对象的基本方法及设置表单及表单对象属性的方法。

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

长汀职业中专学校教案科目:《电商网页制作》计算机组:张开秀班级:15电商3、4班项目一初始dreamweaver8和建立站点项目二制作网站首页任务描述:上一个项目中,创建了“幽幽我心的个人网站”。

本项目将在这个站点中进行首页内容的制作,学习如何在网页中添加文本和图像,使用CSS设置文本、图像和页面的样式。

任务完成后效果如图所示:本项具体的教学过程共分为以下五个方面的任务:任务一添加首页文本(4课时)任务二编辑文本样式(4课时)任务三添加图像(4课时)任务四创建与应用CSS美化网页(4课时)任务五使用代码制作图文网页(4课时)任务一添加首页文本一、提出任务1.任务目标完成首页文本内容。

2. 解决的问题通过完成本任务学习修改网页标题,在网页中添加文本,分段换行和段内换行,输入连续空格,保存和预览网页等知识。

3. 本任务所涉及原有知识要点完成本任务所涉及原有知识要点有:使用站点管理功能创建站点,在文件面板中创建和打开首页文件。

二、教学目标1. 知识目标⑴掌握修改网页标题。

⑵掌握输入网页文本内容的方法。

⑶掌握网页编辑中三种不同换行方式的区别。

⑷了解在文档窗口中输入连续空格的几种方法。

⑸熟悉保存和预览网页的方法。

2. 能力目标掌握添加和编辑网页文本的基本操作,能够根据具体需求添加网页文本内容;通过参加科学探究活动,具有初步添加和编辑网页文本的能力,并加深对网页文本重要性的理解。

3. 情感目标通过分组完成任务,提高自主学习和协作学习的能力,培养团队精神。

三、教学分析与准备1. 教学重点⑴修改网页标题。

⑵输入网页文本内容的方法。

⑶在文档中对文本分段换行和段内换行,输入连续空格。

2.教学难点⑴网页编辑中三种不同换行方式的区别。

⑵在文档窗口中输入连续空格的几种方法。

3. 教学方法任务驱动学习和协作学习、探究学习相结合。

4. 课时安排4课时。

5. 教学环境多媒体网络教室。

四、教学过程(组织课堂、复习知识、教师引领完成任务占1学时;举一反任务二编辑文本样式一、提出任务1.任务目标完成首页文本样式设置,添加水平分隔线与列表。

2. 解决的问题本任务通过设置首页文本样式,学习文本样式设置与应用,修改文本样式,添加水平分隔线与列表知识。

3. 本任务所涉及原有知识要点完成本任务所涉及原有知识要点有:输入文本内容的方法,段内换行与划分段落方法,输入连续空格的方法。

二、教学目标1. 知识目标⑴掌握文本样式设置与应用。

⑵掌握修改文本样式。

⑶掌握重命名文本样式。

⑷掌握添加水平分隔线与列表。

2. 能力目标能够根据具体需求进行文本各种属性及样式的编辑与设置,并提高学生自主学习、协作学习和知识迁移的能力。

3. 情感目标通过教师引导学生主动参与学习,使学生学会使用探求性学习方法获取新知识,激发学习本课程的兴趣,增强学好本课程的信心。

三、教学分析与准备1. 教学重点⑴文本样式的设置、应用及修改。

⑵添加水平分隔线与列表。

2.教学难点文本样式的设置、应用及修改。

3. 教学方法任务驱动学习、协作学习和探究学习相结合4. 课时安排4课时。

5. 教学环境多媒体网络教室四、教学过程(组织课堂、复习知识、教师引领完成任务占2学时;举一反三占2学知识总结举一反三任务目标启发思路分组完成任务学生自评或互评应用样式(为“自我介绍”设置的样式)2.样式重命名引导学生观察并总结出样式默认命名形式为STYLE+N。

一个网页中可能会定义许多样式,而这些样式不一定全是文本类型的,为了方便使用样式,最好对样式进行重命名,使名称能表示样式含义。

演示为“幽幽我心的个人网站”中的文本样式重命名的方法,并按照课本P37页表格要求,设置“青春寄语”与“立志飞翔”中的文本样式并重命名。

3.修改文本样式提出如何修改文本样式让学生思考,学生们可能有说通过属性面板修改样式的,教师可以演示通过属性面板不能修改样式。

演示修改title2样式:单击“样式”列表旁的按钮,打开“CSS样式”面板。

对样式“title2”进行编辑,在面板当中修改颜色值为“#FF6600”。

让学生观察应用了“title2”样式的文本颜色是否会发生相应的变化。

4.插入列表与水平线选中“自我介绍”部分的文本内容,选择“属性”面板中的“项目列表”,为选中文本插入项目列表。

将光标插入到“青春寄语”标题之前,将“插入”栏切换到“HTML”类别,选择其中的“水平线”按钮,在“自我介绍”内容和“青春寄语”内容之间插入一条水平线,起到分隔的作用。

通过完成本任务学习了文本样式设置与应用,修改文本样式,添加水平分隔线与列表知识,设置文本样式时最好一气呵成。

依据前面学习的知识与掌握的专业技能,引导学生完成类似的任务,教师作为组织者和引导者,着重启发学生寻找完成任务的思路,养成利用“书籍”、“帮助”、“网络”等自学的好习惯。

将本单元素材“举一反三”文件夹中的网页教师启发思路,学生自己动手完成。

提醒学生使用帮助功能找到答案。

任务三添加图像一、提出任务1.任务目标为首页添加图像内容。

2. 解决的问题本任务通过为首页添加图像内容,学习在网页中插入图像和编辑图像的方法。

3. 本任务所涉及原有知识要点完成本任务所涉及原有知识要点有:在网页中输入文本内容。

二、教学目标1. 知识目标⑴掌握使用插入栏插入图像。

⑵掌握使用菜单栏插入图像。

⑶掌握使用Ctrl+Alt+I组合键插入图像。

⑷掌握使用文件面板插入图像。

⑸掌握编辑图像的方法。

2. 能力目标能够根据具体情况在指定位置灵活高效地插入图像并进行必要的编辑。

3. 情感目标通过教师引导学生主动参与学习,使学生学会使用探求性学习方法获取新知识,激发学习本课程的兴趣,增强学好本课程的信心。

三、教学分析与准备1. 教学重点⑴插入图像的各种方法。

⑵图像的编辑操作。

2.教学难点图像编辑的方法。

3. 教学方法任务驱动学习、协作学习和探究学习相结合。

4. 课时安排4课时。

5. 教学环境多媒体网络教室四、教学过程(组织课堂、复习知识、教师引领完成任务占2学时;举一反三占2学知识总结举一反三任务目标启发思路分组完成任务学生自评或互评教师点评总结任务目标启发思路分组完成任务学生自评或互评教师点评总结布置作业定位插入点到“立志飞翔”的第三段文字前,选择“插入”栏“常用”类别中的按钮,插入“flying.gif”图像文件并设置对齐方式为“右对齐”。

C.使用Ctrl+Alt+I组合键插入图像定位插入点到“立志飞翔”的第五段文字前,使用Ctrl+Alt+I组合键,插入“flying.gif”图像文件并设置对齐方式为“左对齐”。

4.介绍图像属性面板完成图像的编辑。

概括本课插入图像的四种方式。

1.将本单元素材文件夹中的“jyfs1.jpg”插入到一个新建页面“practice2-7.html”中,裁剪后宽度为200像素,高度为100像素,并设置边框宽度为5,完成后预览页面。

插入后选中该图像并通过属性面板完成。

把不同层次的学生分在一组中,鼓励同学积极研究探索完成任务。

组织不同组的同学互相评论对方完成任务的优缺点。

教师对每组同学完成任务情况进行总结,对完成任务的表扬,对没有完成任务的鼓励,并帮助他们分析没有完成的原因。

2.新建网页“practice2-8.html”,插入本单元素材文件夹中的“jyfs2.jpg”,尝试使用Dreamweaver 8的图像编辑功能修改图像的亮度并进行锐化设置。

插入后选中该图像并通过属性面板完成。

把不同层次的学生分在一组中,鼓励同学积极讨论完成任务的方法组织不同组的同学互相评论对方完成任务的优缺点。

教师对每组同学完成任务情况进行总结,对完成任务的表扬,对没有完成任务的鼓励,并帮助他们分析没有完成的原因。

可以根据每组任务完成情况结合自评与互评情况给出每组的成绩。

入图像的经验让学生尝试进行,尝试失败的可以查找“帮助”或通过网络获得答案。

教师启发思路,学生自己动手完成。

任务四创建与应用CSS美化网页一、提出任务1.任务目标使用CSS美化网页。

2.解决的问题本任务通过为对首页进行美化,学习应用CSS样式。

3.本任务所涉及原有知识要点完成本任务所涉及原有知识要点有:在网页中输入文本内容、插入图像及水平线。

二、教学目标1. 知识目标⑴了解CSS样式的作用与特点。

⑵掌握使用CSS设置文本样式。

⑶掌握使用CSS设置背景样式。

⑷掌握使用CSS设置列表样式。

⑸掌握使用CSS设置水平线样式。

2. 能力目标能够使用CSS样式面板进行样式的设置,区分使用“类”样式与“标签”样式。

通过帮助或搜索引擎等查询学习过程中出现的的概念和定义,掌握获得相关信息的方法。

3. 情感目标正确看待自己,合理评价他人。

三、教学分析与准备1. 教学重点⑴CSS样式的设置。

⑵“类”样式与“标签”样式的区别。

2.教学难点“类”样式与“标签”样式的区别。

3. 教学方法提出任务并带领学生进行分析,通过分析形成解决问题的思路,通过提醒化解解决问题过程中遇到的问题,通过举一反三拓展对知识点的认识与理解。

4. 课时安排4课时。

5. 教学环境多媒体网络教室。

四、教学过程(组织课堂、复习知识、教师引领完成任务占2学时;举一反三占2学时。

)任务五使用代码制作图文网页一、提出任务1.任务目标使用HTML代码制作一个图文网页“唐诗赏析”。

2. 解决的问题通过完成本任务,学习使用HTML代码为网页添加图像、文本等元素并设置其属性。

3. 本任务所涉及原有知识要点完成本任务所涉及原有知识要点有:在设计视图中为网页添加文本、图像等元素并设置属性。

二、教学目标1. 知识目标⑴掌握使用HTML代码在网页中插入文本。

⑵掌握使用HTML代码在网页中插入列表。

⑶掌握使用HTML代码在网页中插入图像。

⑷掌握使用HTML代码在网页中插入水平线。

⑸掌握使用HTML代码在网页中创建CSS样式。

⑹掌握使用HTML代码设置文本等元素的属性。

2. 能力目标能够使用HTML代码制作图文网页,并学会使用HTML代码设置图像、文本、水平线的属性。

3. 情感目标培养学生勤于探索、主动学习的意识,树立将来成为网页制作专业技术人员的信心。

三、教学分析与准备1. 教学重点⑴使用HTML代码插入文本、图像和水平线。

⑵使用HTML代码设置网页元素属性。

2.教学难点使用HTML代码设置网页元素属性。

3. 教学方法任务引领学习、自主学习、协作学习和探究学习相结合,通过几种教学方法的运用,不仅让学生掌握相关知识,同时提高学生的学习能力。

4. 课时安排4课时。

5. 教学环境多媒体网络教室。

四、教学过程(组织课堂、复习知识、教师引领完成任务占2学时;举一反三占2学时。

)项目三制作“作品展示”网页本项目通过“创建表格”、“编辑表格”、“添加表格内容”和“建立超级链接”四个任务,完成“幽幽我心的个人网站”中的“作品展示”网页的制作,学习如何使用表格来进行网页的布局。

相关文档
最新文档