当前位置:文档之家› 网页的基本操作教案及说课

网页的基本操作教案及说课

网页的基本操作教案及说课
网页的基本操作教案及说课

韩城镇中学教师备课用纸(首页)

教学过程:

《网页的基本操作》说课

一、教材内容分析

本节课内容为《信息技术》第二册第一章第二节内容,它是进行网页制作的基础。八年级学生经过七年级信息技术课的学习,已经具备了一定的知识基础和操作技能,尤其对office比较熟悉,也有足够的兴趣去学习新知识。但由于电脑课在中学相对偏少,不少学生仍对Windows的操作不熟练,对获取计算机中和网络上的资源不熟练,这有待在课堂指导上加以辅导。为了学生能顺利完成任务,获得成就感,本节课事先为学生提供了素材,供学生使用。

二、教学目标及重、难点

《中小学信息技术课程标准》初中阶段教学目标指出:“能够与他人协作或独立解决与课程相关的问题,完成各种任务”。根据初中学生心理、智力发展水平以及他们的知识经验和情感需求,我确定了本节课的三维教学目标:

【知识与技能】

1、插入文字、图片并设置其格式

2、了解嵌入式文件,会保存嵌入式文件

3、会设置网页标题、背景、水平线、滚动字幕

【过程与方法】

通过直观演示、任务驱动、分层教学和评价的影响,使学生熟练掌握制作网页的方法。【情感态度与价值观】

1、通过对材料的观察,对学生进行爱国主义教育,增强学生的民族自豪感

2、培养学生创新和团结协作的精神,培养学生的审美情趣和对他人作品正确地评价,促进同学之间的友谊。

教学重点:是插入文字、图片并设置其格式,保存嵌入式文件

教学难点:是保存嵌入式文件

教学过程:

《网页制作教学设计》教案

《网页制作》教学设计 法、说学法、说教学过程、说板书设计。 一、说教材: (一)教材分析:本节内容是省编《信息技术》全一册第六章 网络与INTERNET基础知识第五节的内容(2000年版为第八章第四节内容,2001、2002版教材第六章第五节内容)。虽然在这一节内容在新版教材变更为拓展模块,但针对现在网络快速发展,广大的学生接触,使用INTERNET的机会也大大增加,学生在使用网络获取信息时,更多的是通过浏览网页这一方式,我认为上好这节课是非常必要的,这对学生进一步认识、使用INTERNET更有益处,同时通过网页制作这一过程也利于学生对计算机常用素材的类型有更深入的了解,在一定程度上也起着培养学生运用综合知识能力作用,所以我认为这节课是非常值得我们去研究上好的,考虑这节课的内容及教法、学法的需要,我把这节分为两课时,第一时:学生自学,自练Word制作网页的基本方法;第二课:让学生自己构思创意一个内容丰富,页面美观的网页。 (二)教学目标:根据对教材的分析及学生实际情况,制定如 下的教学目标: (1)知识目标:1、有关网页文件的说明 2、熟悉用Word制作网页的基本方法 3、超级链接是网页实现互相链接的基本方法 (2)能力目标:1、培养学生的自学能力 2、创意构思能力 3、能制作出具有多重链接、多种素材、内容 丰富的网页。 (3)情感目标:1、教育学生正确认识和理解信息技术相关文 化,伦理和社会问题,负责地使用信息技术。 (三)教学的重、难点:根据对教材的分析及网页制作过程中的 实际情况,我认为要出制作内容丰富的网页,关键是要知 道网页间互相链接的方法,所以我把超级链接做为本节的

Dreamweaver网页制作教案

认识Dreamweaver 一、学习目的 了解Dreamweaver,学会利用Dreamweaver制作网页。 二、学习内容 Dreamweaver的基本知识。 【学习步骤】 1、 Dreamweaver的功能 Dreamweaver可以像普通的字处理软件一样编辑Internet上以HTML格式保存的所有文件, 也就是网页;它支持动态HTML,可以在网页中产生动画;还可以在网页中插入各种插件,以产生特殊效果。 Dreamweaver可用于管理站点,它像文件夹一样创建和打开站点,用不同的方式查看站点中各个网页之间的关系,调整站点的组织结构,使整个站点条理清晰。 2、 Dreamweaver的窗口 (1)标题栏 (2)菜单栏 (3)工具栏 (4)视图栏 (5)文件夹列表 (6)工作区 3.网页工作区的三个视图方式选项 它们分别是“普通”、“HTML”“预览”,它们之间的相互切换十分容易实现的。 普通视图方式是Dreamweaver对网页所见即所得编辑方式的最佳体现,在此方式下,可以 像在Word中那样直接进行各种编辑操作,实现网页编辑的所有功能。

HTML视图实际上是一个文本编辑器,其中给出了普通视图方式下所件网页的HTML代码。在这里可以用菜单命令进行复制、粘贴、删除、查找等操作。对于HTML语言中的不同成分均用不同的颜色显示,这样比较容易区分各种语法成分。 为了在制作网页过程中能够随时查看网页的实际效果,Dreamweaver提供了预览视图方式。 4.安装dreameaver的方法 安装及注册 5.关闭dreameaver 6.保存网页的方法 三、小结 Dreamweaver的基本知识

网页设计——网页设计概述教案

第一讲网页设计概述 使学生对网站及网页有一定的认识,激发学生学习网页设计的兴趣。 【教学内容】 讲解网页设计的相关术语及网站制作的基本流程。 【教学重点】 网页设计中的若干术语。 【教学难点】 理解网页设计中的若干术语。 【教学方式】 讲授式、讨论式、案例分析式。 【教学参考】 1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。 2、《Internet 网页工场》Wittime工作室重庆出版社。 3、《WEB网站设计》Joel Sklar著高等教育出版社。 4、《HTML网页制作教程》材义语编著铁道出版社。 【新课内容】 1.1 WWW和URL 1.1.1 Web的起源 Web是World Wide Web的简称,一般也称之为WWW或3W 1.1.2 Web的特点和结构 Web最大的特点是使用了超文本(Hypertext) WWW采用C/S(客户机/服务器)工作模式 在浏览器和服务器之间应用HTTP(Hyper Text Transfer Protocol,超文本传输协议)作为网络应用层通信协议 1.1.3 URL URL的完整格式 协议://主机名或IP地址:端口号/路径名/文件名

1.2 IE5的使用 Web浏览器是浏览Internet资源的客户端软件 在Windows环境下使用的浏览器主要有Internet Explorer、Netscape Navigator、Mosaic等 1.2.1 IE5的界面 1.2.2 IE5的使用 1.3 网页中所使用的技术 1.3.1 HTML语言和XML语言 1、HTML语言 ?HTML只使用SGML中很小一部分标记 ?HTML语言(Hyper Text Markup Language 超文本标记语言) ?HTML是纯文本的语言,其源代码可以用各种文本编辑工具进行编辑,常用的网页制作软件如FrontPage、Dreamweaver等实际上是自动生成HTML源代码的工具 2、XML语言 XML(eXtensible Markup Language) 1.3.2 动态网页 1.3.3 多媒体技术的应用 1.3.4 Web服务器端程序 1.4 制作网页的基本方法 1.4.1 制作网页的基本步骤 1、确定网页的内容 2、设计网页的组织结构 3、资料的收集与整理 4、选择网页的设计方法 1.4.2 制作网页时要注意的问题 1、网页的标题要简洁,明确。 2、在文本中要使用水平线,以分割不同部分。 3、对重点段落要强调显示。 4、网页中插入的图片要尽量的小。

最新网页制作基础课程标准资料

《网页基础制作》课程标准 1.前言 1.1.课程的性质 本课程是中等职业学校计算机应用专业网页设计与制作门化放 向的一门专业基础核心课程。其功能在于培养学生具备从事网页设 计与制作的基本职业能力,使学生达到相应的网页设计制作人员能 力的基本要求。 1.2.设计思路 本课程标准的设计以计算机应用专业学生的就业为导向,邀请 行业专家对计算机应用专业所涵盖的职业群进行任务和职业能力分析,以此为依据确定本课程的工作模块和课程内容,本课程以任务 引领型为框架,把课程按递进方式设计成项目,并以项目为单元足 迹教学,使学生由浅入深,以点到面全面掌握网页设计与制作的职 业技能。 2.课程目标 通过任务引领型和项目活动形式,使学生熟练制作简单网页, 能熟练创建本地站点并能对网页进行各种找链接,能制作网页动画,掌握网页设计与制作技巧,具备网页设计与制作的基本职业能力, 能基本胜任网页制作工作,为学生发展专门化方向的职业能力奠定 基础。 职业能力目标:(1)能熟练制作简单网页 (2)能创建本地站点并能对网页进行各种超链接 (3) 能对网页进行创意的美化

(4) 能制作有创意的网页动画 (5) 能掌握网页设计与制作相关技巧 (6) 能跟踪和学习网页制作的新知识和新技术3.课程内容与要求

4.实施建议 4.1.教材编写 (1)教材要以岗位职业能力分析和职业技能考证为指导,以 《网页制作基础》课程标准为依据进行编写; (2)教材要以岗位任务引领,以工作项目为主线,强调理论与 实践相结合,按活动项目组织编写内容;教材内容从“任务”着手,设计完成“任务”的方法与步骤的空间;教材要体现以解决实际问 题来带动理论的学习和应用软件的操作,让学生在完成“任务”的 过程中掌握知识和技能,培养学生提出问题、分析问题、解决问题 的综合能力。任务的设置应该体现针对性、综合性和实践性。 (3)项目教学任务的设计,应该体现中等职业教育的特征和与 社会实际的联系。所设计的“任务”是学生毕业后就业上岗就能遇 到并解决的问题,而不是围绕着知识和技能的展开而设置的。

网页设计与布局教案.docx

《HTML+CSS 网页设计与布局》课程教案 授课教师:授课班级:地点:周课时: 5 课时网页设计基础知识 章节内容 教学目标重点难点教学Dreamweaver软件介绍及其基础操作 HTML 基础知识及常用标记 1)使学生了解网页设计的相关基础知识; 2)使学生熟悉 Dreamweaver 软件界面的基本操作方法。 1)了解网页设计相关概念和网页的类型; 2)熟练掌握 Dreamweaver 软件创建和管理站点的方法。课堂讲授、案例讲解与指导 方法 教学 计算机机房 环境 时间 教学过程及内容提要备注分配 一、引入 约 15 分钟 教 1 、相互认识,提出与本学科相关的知识,介绍本门课程情况、教学内 学 容及总学时数进度安排,宣讲本课程教学纪律,鼓励学生营造一种 过 学习氛围,尊重同学,互帮互学,真正达到学以致用; 程 2 、提出问题:上过网吧有谁自学过网页设计听说过HTML或者CSS 设 这两个概念吗 计 约 35 分钟学生理解3、

二、告知学生课堂任务 本次课所学习的主要内容是HTML相关基础知识和 Dreamweaver软件基础操作; 三、逐步演示讲解分析教学内容 1、网站和网页的区别: 2、( 1 )网页是Internet基本元素; 3、( 2 )网站由网页组成; 4、静态网页和动态网页: 5、静态网页:纯粹HTML语言格式的网页通常被称为静态网页,静 态网页的后缀名通常为.htm 、.html 、 .shtml 、 .xml 。 6、动态网页:许多人认为网页会动就是动态网页,这是个错误的观点, 在静态的网页中也可以含有动态的图片,这仅仅是视觉上的动态罢 了。真正的动态网页是指实际上并不是独立存在于服务器上的网页 文件,只有当用户请求时服务器才返回一个完整的网页。也就是说, 它是返回到了客户端上的网页。例如网页文件是以ASP 、PHP 、JSP、 ASPX 为结尾就是动态的网页了。 约 20 分钟学生熟记 7、静态网页的特点: 8、( 1 )内容相对稳定,容易被搜索引擎检索到; 9、( 2 )没有数据库支持,在网站制作和维护方面工作量大; 10 、(3)交互性差,在功能方面有很大的限制。 11 、动态网页的特点: 12 、(1)以数据库技术为基础,可大大降低网站维护的工作量;

《网页设计与制作》课程说课稿

《网页设计与制作》课程说课稿 一、课程定位 《网页设计与制作》课程是我院计算机应用技术专业、计算机网络技术专业及电子商务专业的重要专业基础技能课程,该课程不仅实用性强、应用面广,而且与岗位的联系非常密切,仅仅就这一门课程的学习,学生毕业后就可以从事相关网页设计与制作的工作,考取相关的网页设计与制作员的资格证书,如果将此作为技能基础,继续学好后续基于网络编程的动态网页设计技术,学生还可以从事网络软件的设计与开发,进行商务网站的设计与制作,同时也可以考取网页设计师、网络软件工程师等相关国家职业资格证书。该课程的开设,正好满足我校关于“高素质、技能型人才”培养目标的需求,通过该课程的教学,可以培养出一批优秀的、能够在一线工作岗位上从事网页设计与制作、网站规划、管理与维护的工作人才。基于该课程的主要工作岗位有:网站管理与维护人员、网页设计与编辑人员、网站策划人员及网页美工人员等。 二、课程教学设计的过程与思路 在教学过程中,结合职业岗位对人才的需求(一线工作岗位上从事网页设计、制作、编辑,网站规划、维护和管理的人员)、我校对人才培养的目标(培养高素质、技能型、应用型人才)及本课程对人才培养的目标(能够独立完成一个网站的建设,毕业后能够从事企事业单位的网页设计与制作、网站维护与管理等工作的人才),我们将培养学生熟练的网页设计与制作操作技能作为培养重点,在具体课程教学设计中,应用“工学结合”的教育思路、实施“建构主义”的教学方法,采取“小组协作学习”的学习方式完成整个课程的教学与学习。 在“工学结合”的教育思路下,主要以“工作导向——项目导向——任务驱动——知识学习”的一个架构来完成教学。 具体给大家阐述如下: 老师教学之前的教学设计:根据知识点——设计任务——组合项目——达成一项工作 老师教学中的教学设计:给学生布置一项工作(工作导向)——将工作转化为项目(项目导向)——将项目细化为每一个任务(任务驱动)——通过任务引出知识点(知识学习)

网页制作教案

课堂任务快速建站技术—模板的应用 课程名称:利用模板快速建站 课时数:4 教学目标: 知识与技能:了解模板的定义,模板的可编辑区域的定义。 过程与方法:掌握在网页中创建模板的三种方法; 掌握模板的可编辑区域的定义、建立和取消; 掌握模板的应用和取消; 掌握如何将模板从网页中分离出来; 掌握使用模板快速建站; 情感与价值观:培养学生主动思考问题的习惯和自主学习的能力。 教学重点: 在DreamWeaver8中创建模板和应用模板。 教学难点: 学会模板的可编辑区域的定义、建立和取消。 教法: 任务驱动法 学法: 记录关键步骤,积极动手练习。 课前准备: 第三章第三节素材和实例,视频教程:快速建站技术-模板的应用.WMV,快速建站技术-模板的应用(快速更新).WMV。 教学过程设计: (一)导入设计: 我们制作一个网站时,会发现许多网页的版面和元素都是相同的,在设计一个新页面时,我们还可以用复制原来做过页面来减轻工作量。但是如果一个网站有几十、上百张页面都基本相同,这时修改或更新网页的共同元素如网站标志时,会发现工作量实在太大!而使用Dreamweaver 软件中的模板功能来创建新网页,可以大大提高更新和修改的工作效率,网站的维护工作会轻松很多。本节主要内容如下。(二)新课讲解设计: (1)请学生带着以下问题阅读P110~115知识预读,问题如下: A、模板的定义? B、模板创建的三种方式?了解资源面板的使用方式。 C、学会模板的可编辑区域的定义、建立和取消; D、学会模板的应用和取消; E、学会如何将模板从网页中分离出来; (2)教师提问,请学生一一回答以上问题。期间对回答问题的同学要多多表扬,如“你真棒”。增强学生对教师的亲和力。 (3)教师在学生回答问题的同时,总结评价并补充相关要点。 (4)教师展示完成后的模板网站作品,与学生共同讨论分析该网站制作过程。 (5)教师演示建立模板,创建可编辑区域,应用模板等部分操作(详见教材任务一)。

网页制作的教学设计

网页制作的教学设计 一、教学目标 1 、知道站点、主页的概念,能在指定位置建立只有一个网页的站点; 2 、认识FRONTPAGE 的界面; 3 、掌握在主页中插入文字、图片、水平线; 4 、掌握页面文件与图片的保存。 二、教学重点 1 、能在指定位置建立只有一个网页的站点(难点) 2 、能在页面中插入文字、图片、水平线 3 、掌握页面文件与图片的保存(难点) 三、学情分析 学生已经学习了WORD 、POWERPOINT 与上网浏览信息,对计算机的基本操作(WORD 中文档的编辑,网页的浏览等)比较熟练。这使得学生主动探索、自主学习成为可能。每位学生必须完成基本任务,有能力的学生还可以完成提高篇的学习,以充分发挥学生的积极性与自主性。 四、教学方法 在教学中,一方面采用比较教学的方法,促进学生知识的迁移;另一方面,提供学生一个导学课件,让学生根据这个网络环境下的课件自己探索学习,以满足不同层次学生的需求。 五、教学过程设计 教师活动:1 、引入课题:(激发兴趣,活跃气氛) 同学们喜不喜欢上网?经常上新浪、西祠胡同等,有没有同学知道新浪、西祠胡同称做什么?(网站) 浏览新浪网站,浏览的第一个页面称为什么?(主页) 我们还可以浏览其它的页面,点击超链接浏览,当鼠标变成手指的形状时有超链接。 问题1 :网站是不是就是网页?用自己的语言描述一下网站的概念(网站包含多个网页,

通过超链接把不同的页面链接起来) 问题 2 :网页是不是就是主页?( 第一个页面称为主页, 网站设计者可以确定哪一个是主页, 主页的文件名一般为:index.htm, 主页也是网页) 设计网站一般必须经过两个步骤,首先是在计算机里做好,然后发布在internet 上,让所有的人访问浏览。 今天我们学习用Frontpage 建立站点,制作一个主页。 先来研究一下没有发布的网站, 打开教师做的网站 问:同学们看到了什么?(文件夹) 总结: 可以这样理解网站:在资源管理器里,网站表现为一个文件夹,里面存放的是所有与网站相关的文件。 打开主页,浏览页面,这是老师做的一个导学课件,将帮助大家完成学习任务。 请学生浏览教师课件,了解学习任务 2 、新建站点 FP 的启动 问:与word 比较,有什么不同? (增加了视图区,编辑区有三个窗口) 总结: 视图区:多种视图模式是为了方便网站的管理。制作网页时,必须在网页视图中编辑页面 普通窗口:鼠标在闪动,可编辑、修改页面,所见即所得的方式 预览窗口:浏览器中出现的效果,与PowerPoint 中的“放映幻灯片”类似。 Html 窗口:编写HTML (超文本标记语言,它是描述网页内容和外观的标准。) 打开导学软件,根据步骤,示范建立只有一个网页的站点,强调新站点的位置、路径的正确输入,站点的名称。

《网页设计基础》教案

《网页设计基础》教案 总学时:32 教师:贺苗苗

第一章第一节网站界面设计的认识 一、网站的主题定位 1、网站的主题选择 企业的性质决定网站的风格,企业的内容决定网站的主题。 2、网站题材选择的原则 ①主题要小而精②题材最好是自己擅长或者喜爱的内容 ③题材不要太滥或者目标太高 3、题材类别 二、页面的功能模块设计 1、网站名称(Logo) 2、广告条(banner) 3、主菜单(menu) 4、新闻(news) 5、搜索(search) 6、友情链接(links) 7、邮件和地址(mailand address) 8、版权(copyright)

首页的设计步骤:①确定首页的风格和功能模块 ②设计首页的版面布局 ③处理技术上的细节 三、网页界面设计(web interface design)------美观、用户便利、网站流程顺畅! 界面:字典上解释为两者间的界限、接点、共有连接的领域。例子:人与车直接接触的空间,方向盘(即界面);再如:人和门,门把手(即界面)。过大过小都不好。 界面设计最重要的两点:①使用的便利性②美学的层面 四、界面设计相关用语 1、UI ( User Interface, 用户界面 ) 即使用者界面的意思。实现互动是用户界面最主要的目的。 2、HCI ( Human-computer Interaction,人与计算机的交互作用 ) 即,以人怎样做能更容易的掌握计算机的使用技术为目标,结果可以使界面技术得到飞跃和发展。 3、GUI ( Graphical User Interface,图形用户界面 ) 图形用户界面是相对于纯文本而言,通过图形构成用户与系统间的界面来实现的。 例如:在windows之前的DOS必须输入纯文本,而现在则不用。

《HTML5+CSS3网站设计基础教程》_教学大纲

《HTML5+CSS3网站设计基础教程》课程教学大纲 (课程英文名称) 课程编号:201601210011 学分:5学分 学时:76学时(其中:讲课学时:47 一、课程的性质与目标 《HTML5+CSS3网站设计基础教程》是面向计算机相关专业的一门专业基础课,涉及网页基础、HTML标记、CSS样式、网页布局、变形与动画等内容,通过本课程的学习,学生能够了解网页web发展历史及其未来方向,熟悉网页设计流程、掌握网络中常见的网页布局效果及变形和动画效果,学会制作各种企业、门户、电商类网站。

二、课程设计理念与思路 课程设计理念:高职教育的集中实践教学环节需明确必要的理论知识的生化与知识层面的拓展,不能局限 于单纯的技能训练。单纯的技能训练不是提高高等职业教育的理想课程。以能力的培养为重点,以就业为导向,培养学生具备职业岗位所需的职业能力,职业生涯发展所需的能力和终身学习的能力,实现一站式教学理念。 课程设计思路:基于工作过程开发课程内容,以行动为导向进行教学内容设计,以学生为主体,以案例 (项目)实训为手段,设计除理论学习与技能掌握相融合的课程内容体系。教学整体设计“以职业技能培养为 目标,以案例(项目)任务实现为载体、理论学习与时间操作相结合”。 开发工具:DreamweaverCS6 第一章初识HTML5

第二章HTML5页面元素及属性

第四章CSS3选择器

e g o o d f o 背景与图片不透明度的设置 √ 设置背景图像平铺√ 设置背景图像的位置√ 设置背景图像固定√设置背景图像的大小√设置背景的显示区域√设置背景图像的裁剪区域√设置多重背景图像√背景复合属性√线性渐变√径向渐变√重复渐变 √ 第七章表单的应用

网页制作基础知识 教案

网页制作基础知识教案 教学目标: 了解网页的组成元素及常用的网页制作工具。了解网页制作的一些基础知识,如网站和网页的区别、网页的类型、网页的构成元素等,然后在了解的基础上再通过练习来巩固。 教学重点难点: 在深刻了解概念的基础上把理论转化成实际的应用。 教学过程: 在制作网页之前,首先要了解一些关于web网页的基本知识,了解一下构成一个网站的基本元素等。 网页的基本元素 文本:基本组成部分 图像:更加直观准确地表达某些信息,并且可以起到美化网页,吸引读者注意力的作用 超链接:可以方便地转入其他网页进行浏览。 网页的其他元素:音乐表格表单 美化网页,丰富网页的内容,增强网页的功能。 网页的实质 网页相当于刊物中所发表的一篇篇文章,但与纸上的文章相比,它增加了多媒体信息和网上交互的功能。 网页的实质 = 表格+文本+图片+动画+声音+超级链接+…… ◆网站相当于发行到全世界的期刊。 ◆网站的实质 = 服务器上的文件夹 ◆主页相当于期刊的封面。 ◆主页的实质 = 打开网站的第一个网页 网页和网站的分类 从网页是否执行程序来分,可分为静态网页和动态网页这两种类型。 什么是静态网页、动态网页? ◆所谓静态网页,指的是网页从服务器传到客户端时,网页的内容是“固定 不变”的,也就是说,服务器只是把所存储的网页的内容原封不动直接传递给客户端浏览器,这种网页一般是标准的HTML代码。 静态网页一般以.htm或.html为后缀结尾的,俗称html文件。本课程就是制作静态网页的课程。 ◆所谓动态网页,它在由服务器传递给客户端的时候必须由服务器把它转换 成相应的HTML格式,而且会根据用户的要求和选择在在服务器端做出相应的改变和响应。 动态网页一般要用专门的脚本语言编写,如ASP、https://www.doczj.com/doc/7f7026004.html,、PHP、JSP等等

《网页制作》教学设计(优质课比赛优秀设计)

《网页制作》教学设计(优质课比赛优秀设计)《网页制作》教学设计 一、教材或教学内容分析 本章内容在本教材中的位置处于第五章,是在文字处理(Word2000)和网络基础及因特网应用两章之后。学生所学的文字处理软件Word和将要学习的网页制作软件Frontpage同是Microsoft公司的产品,在软件的使用上有很多的共通之处,所以在学习frontpage的时候,很多内容可以让学生自学,而不必面面俱到地在课上讲授。而第四章网络基础及因特网的应用又为学生对网页的理解奠定了基础,学生对网页中的基本元素——文字、图片、动画、声音等都有所了解,而网页的制作就是将这些元素重新组合到网页上,学生要学的就是这种组合的方法。所以说,虽然大多数学生以前都未接触过网页的制作,但有了以上这些基础,学起来就轻松多了。 本章内容按照学生已有的基础,我对教学内容分了一下类,也为教学的组织工作打下一点基础。本章内容主要由网页基础知识、网站的建立和管理、网页的制作、创建超链接、图片的处理、网页框架。 重点是网页的制作和创建超链接,学会了这些就可以开始简单的网页制作了。 难点是网页框架,这部分相互之间关系比较复杂,必要时,老师在对各组个别辅导时,可以给予分别讲解。 这个分类可以为组长安排各个组员的任务提供参考,使分工更加合理。 二、教学对象的分析 第 1 页共 6 页 信息技术课虽然已经成为初中的必修科目,但是城乡学生之间掌握情况的差异却相当大,条件好一点的初中学生不仅已经熟练掌握了课本上的内容,还对一些常

用软件有所了解;而差一点的可以说是从高中开始才正式接触到信息技术知识的学习,他们需要多锻炼、多指导,所以协作学习对学生的学习帮助很大。 三、教学策略的选择及媒体的使用 在教学策略的选择上,我使用的是任务驱动和协作学习相结合的方法。 任务驱动就是要求本章内容学习完之后,每个小组都要完成自己班级网站的制作,并在全班进行评比,选择最好的作为班级主页挂到学校主页上去,这有助于激发学生参与学习的积极性。 协作学习则是让学生在学习过程中互帮互助,用较短的时间、教少的精力学到更多的东西,完成一个集体项目,让他们在学习之后获得成就感。因此在媒体的选择上,我们使用的是TOP2000系统。TOP2000系统有利于教师进行分组教学和学生作品的点评及成果的展示。教学过程开始之前,教师把学生按座位分成四组,每个组都按学生对计算机的掌握程度平均分配,保证每个组都有计算机操作方面比较突出的,也有相对比较差的,使其形成能够互帮互助的学习小组。并由他们自己选出组长各一名,然后由组长根据组员的情况,确定在班级主页制作过程中主要完成什么任务,也就是说起到一个组织者的作用。做过网页的人都知道,做网页是一项比较费时的工作,而要学生在较短的时间内制作出像样的网页是比较困难的,而在这个过程中,网页的设计占去了相当多的一部分时间,组长把任务分到各组员头上以后,组员就可根据自己要完成的任务相对集中的做某方面的工作,做完以后,组员之间进行经验交流,告诉组员自己的网页是如何制作出来的,在完成自己的网页后,再重复一遍制作过程花费的时间的不多的。这样,其他组员就可在较短的时间之内 第 2 页共 6 页 掌握比较先进的网页制作方法,而不必再花那么多时间去探索。因为每位组员都必

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

《网页设计与制作》课程教案 一、课程定位 本课程是计算机应用技术专业的一门专业基础课程,该课程的学习能够提升他们对网页制作的兴趣,让他们学习网页制作的基本技能,为后继课程打下基础,同时扩展其就业面,为就业做好准备。 本课程的目的和任务是让学生学会Dreameaver CS6、Flash和Fireworks 的使用方法,并能够使用这3款软件制作出美观实用的网页。 二、课程总目标 掌握网页制作的基本方法和技能,掌握网站建设的流程,能够运用所学知识建设常用的网页和网站,同时能够美化网页,设计人性化、艺术化的网站静态页面部分。 (一)知识目标: 1.熟悉网页制作的基本元素; 2.掌握Dreamweaver CS6软件的基本操作方法; 3.掌握在网页中插入文字、图片、声音、flash等的方法; 4.掌握常见的网页布局方法,学会使用CSS美化网页; 5.掌握在网页中使用表单和制作网页特效的方法; 6.掌握简单图形图像的处理,能够制作符合网页主题的图片和简单动画 并巧妙地和网页中内容搭配起来。 7.掌握建设一个功能相对完善的网站的方法并能制作常用的网站的静 态页面部分。 (二)职业能力培养目标 1. 能够根据网站开发需求,去寻找网页设计和网站开发所需要的文字、 图片、动画、声音、视频等素材并作美化处理; 2.能够制作出符合主题色彩的网页,网页要求美化、被绝大多数浏览 者接受和喜爱;

3.能够设计企业网站、政府门户网站、学校网站等常见网站的基本静态 页面。 (三)素质目标 1.具有勤奋学习的态度,严谨求实、创新的学习精神; 2.具有良好的心理素质和职业道德素质; 3.具有高度责任心和良好的团队合作精神; 4.具有运用理论知识发现问题、分析问题并解决问题的能力,同时能够 不断学习,不断创新,让自己的设计越来越完善,有止于至善的精神。(四)职业技能证书考核要求: 可以根据自身情况考取“全国计算机信息高新技术资格证”,“网页设计制作员”,“网页设计师”等职业技能证书。 三、重点、难点章节及内容 1.重点章节: 1.2 网页、网站相关术语简介 1.6 网站建设的基本流程 2.3 Dreamweaver CS6的工作环境 3.2 创建本地站点 3.4 使用站点 3.5 网页设计中的规范 4.1 网页文件的基本操作 4.3 插入文本 4.4 插入水平线 4.5 插入其他基本元素 4.6 创建列表 5.1 超级链接概述 5.2 创建超级链接 5.3 使用dw制作各种超级链接

网页设计说课稿

《动态网页制作实例教程—Dreamweaver ASP与SQL》说课稿 单位: 姓名:

各位专家评委、老师好!我今天说课的课题是动态网页制作实例教程,下面我将从说人才培养方案及专业培养目标、说教学大纲、说教材、说教法和学法、说学情及学生学习方法指导、说教学过程、说板书设计七个方面来对本课程进行说明。 一、说人才培养方案及专业培养目标 潍坊工商职业学院的办学目标:以就业为导向,培养适应生产、建设、管理、服务第一线需要的高素质技能型人才,为地方区域经济发展服务。突出职业教育办学的实践性、职业性的特色。 本专业的培养目标:具有计算机硬件、软件的基础理论知识和计算机系统的实际应用与维护能力,理解计算机的基本原理,熟练掌握微机和计算机网络的基本操作、信息管理系统软件开发和维护能力、网页网站开发等技能的面向工作一线的高素质技能型人才。 二、说教学大纲 1、课程定位 《动态网页制作实例教程-Dreamwearver ASP与SQL》是一门研究动态网页及网站设计与构建的基本原理和基本方法的课程;是计算机类专业必修的一门专业课;是具有系统的网络技术、数据库技术、软件编程技术和网站构建方法与技术,实践性很强的课程。本课程是学生学习后续课程和完成课程设计与毕业设计不可缺少的重要基础,是日后从事技术工作的重要工具。 本课程的主要内容包括:网络技术、网页技术、数据库技术与Internet技术的基本知识;动态网站设计与构建的基本原理;面向对象分析、设计与实现的基本思想和方法等。根据培养对象的层次特点,本课程在开发学生综合应用能力、和创新能力的培养有着重要的地位;为培养面向工程的应用型人才以及学生就业奠定了基础。 课程的考核方式为平时表现占10%,作业占10%,理论考试占50%。 2、课程目标 通过本门课程的学习,使学生具有初步设计能力、软件编程能力、综合应用能力,具备构建动态网站的实际技能。对于本门课程有如下三个教学目标:(1)知识目标:掌握网站开发的一般流程和步骤,对动态网页制作有系统全面地认识和了解。 (2)能力目标:对所要建设网站的初步分析能力;独立制定所要完成功能的分析、设计及制定实施方案;完成学生信息管理系统的开发;对所开发的网站进行简单的功能测试;提高口头与书面表达能力、人际沟通能力。 (3)素质目标: 提高团队精神和协作精神、艰苦奋斗意识、心理素质和克服困难的能力。 希望通过本课教学,使学生在知识的理解和掌握,能力的锻炼与提高、情感

简单网页制作教学设计

《简单网页制作》教学设计 一、设计意图: 目前网络对学生的吸引力很大,学生上网都会浏览网页内容,对网页的制作也有很大的兴趣,想知道一个网页是怎样制作成功的。但是网页的制作相对复杂,对于一些的代码的编辑学生也较难理解,因此本课选择了FrontPage网页制作工具,引导学生简单的了解网页制作的过程,采用了所见即所得的形式避开代码的繁琐,调动学生自行设计的积极性,对网页制作有一个简单的入门了解。 二、教学目标 1、知识目标 (1)理解网页制作的简单步骤。 (2)学会用FrontPage的制作简单网页。 2、技能目标 (1)掌握的FrontPage的背景添加的操作。 (2)掌握FrontPage的文字编辑、艺术字、图片的插入的操作。 (3)知道HTML的简单编码。 3、情感目标 (1)培养学生的口头表达能力、操作和分析概括能力。 (2)培养学生展示自我、表现自我的能力。 (3)培养学生独立思考问题、解决问题的能力和团结协作精神。 (4)在网页制作的过程中,提高学生对FrontPage的认识。三、重难点、问题预测及对策

1、重难点 (1)重点:FrontPage的基本操作。 (2)难点:HTML的理解。 2、问题预测 本节课是网页制作的第一节内容,需要学生掌握的技能并不困难。由于在学习网页制作的过程中,需要培养学生的制作网页的积极性,才能引发学生对网页制作的兴趣,实现自主学习,自主开发。 3、对策 以制作班级自己的主页引起学生注意,引发学生的兴趣。让学生运用FrontPage的插入、背景修改等工具,通过作品展示激发学生的动力。 在教学过程的设计上,通过自主设计自己的个人主页来达到解决一个个知识点的目的,同时通过学生自己创作,引导学生正确的审美情趣和创作激情。 四、课前准备 精美网站、优秀班级主页、素材图片等。 五、教学流程 1、情感导入:通过优秀班级主页欣赏,引发学生兴趣,跃跃欲试。 2、自主学习:引导学生做自己班级的主页。 3、示范教学:学生归纳总结,老师帮助、提醒,使学生掌握正确的操作步骤。

网页设计与制作教案46186

[章节名称]:网页设计入门基础 [课堂类型]:理论■实训□练习■测试□ [学时安排]:2课时 [目的要求] 1.了解网络的基本知识,网页设计的基础知识,网页的分类,动态网页的原理及 技术 2.了解网页的基本构成及最简单的html代码 3.了解网页设计的流程 [重点] 了解网页设计的流程,掌握最基本的网页的构成及最简单的网页html代码 [难点] 掌握最基本的网页的构成及最简单的网页html代码 [教法学法] 1.采用教授法进行教学讲解,结合疑难点师生互动交流方式进行。 2. 练习采用学生自主安排,教师给与个别辅导的方式进行。 [参考资料] 《Dreamweaver CS5网页设计与制作——DIV+CSS版》吴丰,丁欣主编 清华大学出版社 《动态网页制作教程》(第二版)刘梅彦徐英慧编著清华大学出版社 [教学过程] 环节一:结合PPT课件的内容,讲解网络和网页的基本知识。了解网页的分类,网页运行的原理,介绍网页设计的工具,动态网页的技术。 环节二:介绍网页的构成,并对一个网站进行实例分析说明。编写最简单的html 代码。 环节三:了解网页设计的流程 主要有以下几个步骤: 一. 网站规划 二. 素材资源收集

三. 选择开发工具 四. 站点建立与规划 五. 分模块进行网页设计 六. 网页源代码测试与特效添加 七. 申请域名与空间 八. 网页源代码上传 九. 定期的维护 环节四:对本节课的内容进行复习,让学生练习html的代码。并进行疑难解答

[章节名称]:html基础与应用1 [课堂类型]:理论■实训□练习■测试□ [学时安排]:2课时 [目的要求] 了解html语言的基础知识,结构,掌握html语言设置网页的背景音乐,背景图片,字体的方法。 [重点] Html语言设置网页的背景音乐,图片,字体 [难点] Html语言设置网页的方法 [教法学法] 1.采用教授法进行教学讲解,结合疑难点师生互动交流方式进行。 2. 练习采用学生自主安排,教师给与个别辅导的方式进行。 [参考资料] 《Dreamweaver CS5网页设计与制作——DIV+CSS版》吴丰,丁欣主编 清华大学出版社 《动态网页制作教程》(第二版)刘梅彦徐英慧编著清华大学出版社 [教学过程] 环节一:复习网页设计的基础知识,介绍如何利用Dreamweaver开发工具,记事本编辑网页的源程序,介绍网页站点的创建及注意事项。 环节二:讲解html语言的结构,特点,设置网页页面的背景音乐,图片,字体1. 设置背景颜色 2. 背景图片 3. 背景音乐 背景音乐和上边介绍的两个有很大的不同,它的代码是放在页面的头部

全国计算机类说课大赛一等奖:CSS样式表的使用教学设计

一课时 本次课设计课时为2课时。 二教材分析 (一)知识内容分析 本课内容选自高等教育出版社的《网页设计与制作(HTML+CSS+JavaScript)》,第四章《CSS 的应用》,设计课时为2个课时。本章在整个课程体系里起到承上启下的作用,它既是对前面的基础章节的综合深化,又开启了后续DIV+CSS知识对接。在本课之前,学生基本掌握网页制作的主要知识点,有一定的代码基础。而本课内容CSS样式表的使用是学生进行网页设计的基础和提高。学生通过理解CSS样式、选择器的概念,掌握应用外部CSS样式表、修改CSS选择器属性的方法来设计和美化网页,并能对所设计的作品进行评价,培养学生的设计、审美能力及职业素养和创新精神。本次教学活动对学生的网页制作与设计起着基础、提高作用。 (二)我对教材的处理方法 1、把教材所涉及的知识点进行分层,使学生由简入深理解和掌握CSS样式表的使用。 2、对教材内容进行二次处理,制作原创案例,使内容更加适合我班学生学习。 3、由CSS样式表的使用引导学生对网页界面设计的分析。 三学生分析 教学对象为我校计算机应用专业中职二年级的学生。学生学习网页制作已有一个学期,对这节课之前的学生情况分析如下: (一)学生知识能力分析 1、学生能熟练使用Dreamweaver软件 2、对于静态页面的设计有一定的基础 3、学生有简单的代码基础 4、在以往的学习过程中有简单接触过嵌入式的CSS样式 5、学生缺乏动手能力 6、对作品的评价缺乏系统的认识和理解 7、学生技能水平出现分化现象 (二)学生自学能力分析 我在课堂教学过程中,注重在学生认知水平能够承受的前提下安排一些适合自学的内容让学生自己掌握,从中培养学生的自学能力。开始自学的内容简单,等学生认为自学不是一件很难的事情

网页制作教案

网页制作教案 IMB standardization office【IMB 5AB- IMBK 08- IMB 2C】

课堂任务快速建站技术—模板的应用 课程名称:利用模板快速建站 课时数:4 教学目标: 知识与技能:了解模板的定义,模板的可编辑区域的定义。 过程与方法:掌握在网页中创建模板的三种方法; 掌握模板的可编辑区域的定义、建立和取消; 掌握模板的应用和取消; 掌握如何将模板从网页中分离出来; 掌握使用模板快速建站; 情感与价值观:培养学生主动思考问题的习惯和自主学习的能力。 教学重点: 在DreamWeaver8中创建模板和应用模板。 教学难点: 学会模板的可编辑区域的定义、建立和取消。 教法: 任务驱动法 学法: 记录关键步骤,积极动手练习。 课前准备: 第三章第三节素材和实例,视频教程:快速建站技术-模板的应用.WMV,快速建站技术-模板的应用(快速更新).WMV。 教学过程设计: (一)导入设计:

我们制作一个网站时,会发现许多网页的版面和元素都是相同的,在设计一个新页面时,我们还可以用复制原来做过页面来减轻工作量。但是如果一个网站有几十、上百张页面都基本相同,这时修改或更新网页的共同元素如网站标志时,会发现工作量实在太大!而使用Dreamweaver 软件中的模板功能来创建新网页,可以大大提高更新和修改的工作效率,网站的维护工作会轻松很多。本节主要内容如下。 (二)新课讲解设计: (1)请学生带着以下问题阅读P110~115知识预读,问题如下: A、模板的定义? B、模板创建的三种方式?了解资源面板的使用方式。 C、学会模板的可编辑区域的定义、建立和取消; D、学会模板的应用和取消; E、学会如何将模板从网页中分离出来; (2)教师提问,请学生一一回答以上问题。期间对回答问题的同学要多多表扬,如“你真棒”。增强学生对教师的亲和力。 (3)教师在学生回答问题的同时,总结评价并补充相关要点。 (4)教师展示完成后的模板网站作品,与学生共同讨论分析该网站制作过程。(5)教师演示建立模板,创建可编辑区域,应用模板等部分操作(详见教材任务一)。(6)请一位学生上台操作,其他学生完成相同操作。可以参考视频快速建站技术-模板的应用.wmv。教师巡视指导。 (7)教师总结评价学生完成情况。

全国“创新杯”计算机类说课大赛一等奖作品:《DIV+CSS布局网页》教学设计方案

网页设计与制作—— 使用DIV+CSS布局网页

《网页设计与制作——网页布局》 教学设计 【课题】网页布局——使用DIV+CSS布局网页 【教材】《网页设计与制作》 【授课班级】中等职业学校网络专业二年级 【教时】 4课时 【教材分析及学情分析】 本次课采用的教材是国家十二五规划教材《网页设计与制作》,其中DIV+CSS布局网页是重要的教学单元。本教材内容通俗易懂、图文并茂,并且包含有丰富的信息化实训案例。 本次课的教学对象为中职学校二年级学生,他们未来主要从事网页前端设计师的工作,要求具备网页前端设计的能力。在本次课之前,我们的学生已经掌握了Dreamweaver网页设计的相关知识,具备了网页美工的基础,学生学习热情较高,喜欢团队合作的探究学习方式,但学生自主创新能力不足,学习代码编写有一定困难,因此本课重点讲解如何使用DIV+CSS布局网页的知识内容。 【教学目标】 依据本教材的内容,结合学生的学情分析,本着提高学生的知识水平及分析处理能力为宗旨,我制定了知识目标、技能目标、情感目标相结合的三维教学目标:知识目标: (1)学会DIV+CSS网页布局方式 (2)掌握DIV+CSS布局的定位方法 技能目标: (1)能熟练使用CSS对网页中对象的位置精确排版; (2)灵活应用DIV+CSS进行网页布局; 情感目标: (1)培养学生团队合作意识;

(2)提高学生责任感和职业素养; 【教学重点与难点】 ●教学重点:DIV+CSS网页布局方式、方法。 ●教学难点:灵活使用DIV+CSS布局定位。 【教学设计】 课前利用该课程的学习网站和微课资源库让学生自主预习。课中采用信息化的混合式教学法、项目驱动法等多种方法相结合的形式来激发学生的学习兴趣,并且利用微课资源库来突破教学难点;在教学效果上采用多元评价检测方法,让学生体验成功的乐趣;最后老师进行归纳总结,进行知识拓展,延伸学生的知识面。使学生在不知不觉中实现知识的传递、迁移和融合。 【学法分析】 学生是学习的主体,教师是组织者和引导者,引导学生学会学习的方法,才能构建有效的课堂。在教学过程中我注重学生自主学习能力、体验探究能力和总结反思能力的培养,转变学生的学习方式,由之前的‘我学会’变成现在的‘我会学’。 【教学过程---课前预习】 随着互联网的普及和信息化技术在教育领域的应用日益广泛,为了更好的突出学

HTML基础设计教案

教案编写日期:20XX年11月20日授课时间:20XX年11月21日-25日授课班级:高二3-8班授课地点:高中微机教室 第六章HTML代码基础 §1.1 HTML语言 指导思想与理论依据:HTML语言基础广西科学技术出版社《信息技术高中第三册》第一单元第六章——“了解一点HTML”的入门知识,HTML语言是超文本标记语言的缩写(HyperTextMarkupLanguage) ,它是网页设计中应用最广泛的一种语言,也是网页制作中学生感到最头疼难学的一个内容。掌握html语言基础会让动态网页制作的学习事半功倍,因而本部分知识显得非常重要,因此在本节课程的教学中,结合新课标及教材的特点,采用多种教学法结合方式(启发式教学法、任务驱动法、演示法等等...),激发学生学习兴趣,尤其是注重对学生的引导,采用任务驱动方式教学,引导学生通过自主学习平台自主学习从而提高学生的学习效率,本节内容是在学生已经掌握了利用FRONTPAGE制作普通网页的基础上,对网页语言的深入学习。 学情背景分析: 本节之前,学生已经学习了如何利用FrontPage进行网页以及网站的制作,但是对于网页的认识还知识停留在页面的直观设计上,缺少对HTML代码的认识。本节课主要对学生讲述HTML的基本概念,为学生培养良好的代码结构意识打下基础。 在本节课程的教学中,结合新课改的理念,采用创设情境演示教学的方法,激发学生学习兴趣,采用任务驱动方式教学,引导学生通过自主学习平台自主学习从而提高学习效率。 教学目标 1、掌握HTML基本概念、格式,理解其与网页的关系; 2、掌握基本的HTML 标签的作用与用法; 过程与方法:通过对简单网页html代码的观察对和html语言的基本结构进行自我概括,掌握HTML文件的基本结构,能够明确HTML语言的结构和特点,并能在实验的过程中尝试自我修改。 情感态度价值观:本课主要锻炼学生分析能力,语言构成能力。在相应的实验中,还能提升学生自主探究、自我学习的能力。 教学重点:HTML标签的基本用法及其意义 教学难点:HTML主要标签属性的具体意义及使用 教学方法:任务驱动法(引导学生自主学习)、演示法(激发学生学习兴趣)、上机操作实习法(精讲多练)、联系对比法(化难为易,照葫芦画瓢) 教学媒体:教材、多媒体课件、电脑等

相关主题
文本预览
相关文档 最新文档