当前位置:文档之家› 静态网页制作教案

静态网页制作教案

静态网页制作教案
静态网页制作教案

授课教案安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

安徽商贸职业技术学院教师授课教案

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

《网页制作》教学设计 法、说学法、说教学过程、说板书设计。 一、说教材: (一)教材分析:本节内容是省编《信息技术》全一册第六章 网络与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的基本知识

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

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

网页制作公开课教案.doc

教学科目授课日期节次教学内容 教学目标 教学重点与难点教学方法 教学资源 公开课教案 网页制作授课班级10 计 4授课教师徐彬2011.06. 12课型任务驱动授课学时 1 课时下午第二节授课地点图书馆动漫机房 有趣的拼图 通过讲解、演示、实践,让学生掌握在网页中运用层制作拼图游戏。 知识目标技能目标态度目标 通过讲解让学生 1. 提高学生分析问题、解决问1、培养学生的观察能力及掌握在网页制作中题的能力勇于探索、勇于创新的精层的特点,学会添加2.锻炼学生的表达能力和协神 “拖动层”行为。并作、沟通能力2、培养学生的团队精神且了解相应的事件。3.提高学生的动手实践能力, 能运用层制作有趣的拼图 教学重点:层的特点、“拖动层”行为。 教学难点:“拖动层”行为。 综合(讲授、启发、引导、演示示范、观察、比较、实践等) 多媒体计算机、多媒体教学软件 本节是《网址制作 DreamweaverMX2004》中层的应用中的内容,是操作实践课。 本节采用情景导学与任务驱动相结合的教学法帮助学生消化吸收新知识, 教学 引起学生的学习兴趣,激起学生的求知欲望,发挥学生的主体作用,体现教师设计 的主导作用。通过兴趣与任务使学生学习到相关的计算机基础知识和操作技 能,进而培养学生的自学能力与动手实践能力。

教学过程设计 教学环节与主要内容具体教 学目标 教学活动 【复习导入】 ( 一 ) 导入(学时分配: 2 min ) 创设情境,打开“趣味拼图”网页,请 同学玩一玩拼图游戏。 ( 二 )复习知识点(学时分配: 2 min )1、你觉得我们玩的拼图游戏有什么特点? 这种特点是利用了什么技术实现的?2、拼图游戏利用了层的什么特点?1、激发学生学习兴 趣。 2、导入新课 教师:帮助学生回顾复习 层的特点。 学生:回顾并实践复习已 学知识 教师:根据实例,提问诱 导,导入课堂任务 学生:观察、讨论、思考 ( 三 ) 明确学习目标(学时分配:1min) 1、层的特点。 2、“拖动层”行为。教师:明确学习目标 3、 onLoad 事件。 【任务分析与制作】 (一)任务初分析(学时分配: 5min)让学生理解理解掌教师:讲解、示范、演示打开趣味拼图网页,引导学生分析制作此网握层的特点。学生:观看操作演示、学页所需的技术:习领会 1、网页布局:表格。 2、图片素材的添加:插入图片(拓展)。通过练习巩固所学学生:实践,完成练习 3、拼图图片的移动:表格转换为层。知识内容。 教师:巡视、评价、辅导(二)任务初制作(学时分配: 15min) 学生制作趣味拼图网页并调试。 (三)任务再分析(学时分配: 5min )让学生理解理解掌教师:讲解、演示、示范请同学们汇报自己作品的调试成果。握“拖动层”行为以学生:观察、学习、领会针对调试作品所发现的问题进行再分析。及事件的用法。 1. “拖动层”行为。 2. 事件。

《HTML CSS JavaScript网页制作案例教程》_教学大纲讲解

《HTML+CSS+JavaScript网页制作案例教程》课程教学大纲 (课程英文名称) 课程编号:201509210011 学分:5学分 学时:64学时(其中:讲课学时:45 上机学时: 19 ) 先修课程:计算机基础、计算机网络、计算机应用 后续课程:UI设计、 JavaScript网页特效 适用专业:信息及其计算机相关专业 开课部门:计算机系 一、课程的性质与目标 《HTML+CSS+JavaScript网页制作案例教程)》是面向计算机相关专业的一门专业基础课,涉及网页基础、HTML标记、CSS样式、网页布局、JavaScript 编程基础与事件处理等内容。通过本课程的学习,学生能够了解HTML、CSS及JavaScript语言的发展历史及未来方向,熟悉网页制作流程、掌握常见的网页布局效果、学会制作各种企业、门户、电商类网站。 二、课程的主要内容及基本要求 第一章网页那点事(2学时) [知识点] 认识网页 常见的互联网专业术语 Web标准 HTML简介 CSS简介 JavaScript简介 常用浏览器介绍 Dreamweaver 工具的使用

使用Dreamweaver创建第一个页面 [重点] Web标准 Dreamweaver工具的使用 [难点] Web标准 Dreamweaver工具创建第一个页面 [基本要求] 了解Web标准,明确HTML、CSS及JavaScript在其中的作用。 熟悉Dreamweaver工具的基本操作,能使用Dreamweaver创建简单的网页。第二章从零开始构建HTML页面(4学时) [相关案例] 【案例1】简单的网页: 【案例2】新闻页面: 【案例3】图文混排: [知识点] HTML文档基本格式

网页制作教案

课堂任务快速建站技术—模板的应用 课程名称:利用模板快速建站 课时数: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 (超文本标记语言,它是描述网页内容和外观的标准。) 打开导学软件,根据步骤,示范建立只有一个网页的站点,强调新站点的位置、路径的正确输入,站点的名称。

静态网页设计-教学大纲

《静态网页设计》教学大纲 课程类别:专业基础课 课程属性:必修课 学分/学时: 4学分/64学时 制订人:课题组 适用专业:信息技术相关专业 一、课程的性质 “静态网页设计”是信息技术类专业学生的专业基础课之一。属于必修课范畴。同时它是一门针对性、实践性较强的课程。主要是培养学生静态网页设计的基本知识和静态网页设计制作的基本技能。 二、与其它课程的关系

三、教学目标 1.知识目标 (1)网站、网页、网页设计等的基本概念; (2)理解HTML语言中的各种文本格式、段落设置、列表等标记知识; (3)理解和掌握基本的DIV+CSS技术知识; (4)理解和掌握表格的基本知识; (5)理解和掌握数据表单的基本知识; (6)理解和掌握基本的框架网页知识; (7)理解和掌握网页图像、动画等多媒体应用知识; (8)理解和掌握网页超级链接知识; (9)掌握基本的动画制作知识; (10)了解网页美工相关知识; (11)了解网站的测试、发布与维护的基本知识; (12)掌握网站制作流程 2.能力目标 (1)能运用HTML语言设置和编辑网页元素; (2)会使用Dreamweaver等网页设计工具制作网页; (3)能使运用基本的CSS技术设置网页风格; (4)能在网页中嵌入图像、动画、视频等多媒体元素; (5)能运用表格布局并设计网页; (6)能正确运用文字超链接、图像超链接技术设计网页; (7)掌握框架制作网页的方法,会使用框架设计网页; (8)掌握制作表单的方法,会利用表单建立交互式页面; (9)能看懂基本的HTML网页源代码。

(10)会设计网页线框图,并能运用PS进行网页效果图设计 (11)掌握切片的基本原则和基本方法,综合运用网页排版技术进行切片素材排版 (12)熟悉网站项目工作流程,能独立进行中小型网站设计。 3.素质目标 (1)具有信息资料收集与整理能力; (2)具备简单的需求市场分析能力; (3)具有一定的语言表达、沟通和协调能力; (4)具有良好的心理素质和责任意识,能及时完成任务的能力; (5)具有踏实肯干的工作作风; (6)具有一定的创新意识和艺术设计素质 四、内容结构与目标任务

初中信息技术《网页的制作》说课稿附点评

网页的制作 一、教学目标 1、知道站点、主页的概念,能在指定位置建立只有一个网页的站点; 2、认识 FRONTPAGE 的界面; 3、掌握在主页中插入文字、图片、水平线; 4、掌握页面文件与图片的保存。 二、教学重点 1、能在指定位置建立只有一个网页的站点(难点) 2、能在页面中插入文字、图片、水平线 3、掌握页面文件与图片的保存(难点) 三、学情分析 学生已经学习了 WORD、POWERPOINT 与上网浏览信息,对计算机的基本操作(WORD 中文档的编辑,网页的浏览等)比 较熟练。这使得学生主动探索、自主学习成为可能。每位学生必须完成基本任务,有能力的学生还可以完成提高篇的学习, 以充分发挥学生的积极性与自主性。b5E2RGbCAP 四、教学方法 在教学中,一方面采用比较教学的方法,促进学生知识的迁移;另一方面,提供学生一个导学课件,让学生根据这个网络环 境下的课件自己探索学习,以满足不同层次学生的需求。p1EanqFDPw 五、教学过程 设计 教师活动:1、引入课题:(激发兴趣,活跃气氛) 同学们喜不喜欢上网?经常上新浪、西祠胡同等,有没有同学知道新浪、西祠胡同称做什么?(网站) 浏览新浪网站,浏览的第一个页面称为什么?(主页) 我们还可以浏览其它的页面,点击超链接浏览,当鼠标变成手指的形状时有超链接。 问题 1:网站是不是就是网页?用自己的语言描述一下网站的概念(网站包含多个网页,通过超链接把不同的页面链接起来)
DXDiTa9E3d
问题 2:网页是不是就是主页?(第一个页面称为主页,网站设计者可以确定哪一个是主页,主页的文件名一般为:index.htm,主 页也是网页)RTCrpUDGiT 设计网站一般必须经过两个步骤,首先是在计算机里做好,然后发布在 internet 上,让所有的人访问浏览。5PCzVD7HxA 今天我们学习用 Frontpage 建立站点,制作一个主页。 先来研究一下没有发布的网站,打开教师做的网站 问:同学们看到了什么?(文件夹) 总结: 可以这样理解网站:在资源管理器里,网站表现为一个文件夹,里面存放的是所有与网站相关的文件。 打开主页,浏览页面,这是老师做的一个导学课件,将帮助大家完成学习任务。 请学生浏览教师课件,了解学习任务 2、新建站点 FP 的启动 问:与 word 比较,有什么不同? (增加了视图区,编辑区有三个窗口) 总结: 视图区:多种视图模式是为了方便网站的管理。制作网页时,必须在网页视图中编辑页面 普通窗口:鼠标在闪动,可编辑、修改页面,所见即所得的方式

教你制作静态网页的方法

教您制作静态网页的方法 一、网页设计基础 1、熟悉Dreamweaver 8的工作环境 2、创建新站点 创建本地站点:站点----管理站点----新建----站点(前三步也可直接从“新建站点”进入下面的设置向导对话框)----跟随向导设置直至完成 3、网页文件的基本操作 a、创建、打开与保存网页文件 创建:文件----新建----创建 打开:文件---打开----选择欲打开的文件 或者在右边的文件浮动面版中选择打开 保存:文件---保存或另存为 b、设置网页的页面属性 修改---页面属性---然后设置(标题、背景、背景图像、文本等) c、设置网页对象的颜色 网页对象,如页面背景、文字、链接都经常需要设置颜色。 可在各自对应的属性面版中设置。 d、网页文本的输入与属性设置 文本可键入、导入、粘帖 文字可设置字体、大小、颜色、格式等。 键入空格的方法:1、汉字输入法设置为全角方式,按空格键即可输入。2、属性面版格式中:预先格式化的 换行:ENTER、SHIFT+ENTER 实例练习: 1、输入以下文字 书签夹在诗集里, 落叶夹在深秋里。 喜悦夹在生活里, 追求夹在人生里。 2、第一次设置格式为“无”,字体为“华文行楷”,字体颜色为“红色”,字号为“5号”,添加项目符号。然后保存、预览。 3、第二次设置格式为“标题一”,字体为“楷体”,字体颜色为“蓝色”,字号为“5号”,添加项目符号,对齐方式为“居中”。然后保存、预览。 比较两次设置的效果。 e、网页图片的插入与属性设置 插入图片,在对话框中选择图片。(最好在建立站点时将欲用的图片素材复制到本地站点目录中) 插入图像占位符,在图片准备好后再加入图片。加入方法:1、双击图像占位符;2、点“属性面版”中的“指向文件”,拖到右边文件中要插入的文件处。

简单生活网上买菜系统静态网页设计与制作毕业设计论文

四川交通职业技术学院毕业设计论文 设计(论文)题目: 简单生活网上买菜系统静态网页设计与制作 入学年月 姓名 学号 专业计算机应用技术 指导教师 完成日期 2015 年 5 月 15 日

【摘要】计算机和计算机网络的飞速发展,人们对计算机网络的依赖是越来越大。人们在网上聊天交友,在网上请教问题,查阅资料,还在网上听音乐。除此之外,人们还会在网上进行商务交易、下载信息,有着众多的使用者。尤其是电子商务大大的减少了人们对周围环境的依赖,无论是哪里的网友,都可以浏览到世界各地的各类信息,非常的方便,由于以上的优势,各类网站如雨后春笋般的出现,这也就是我的毕业设计的实际意义。本文就个人网站的规划与建设,以软件工程的方法对过程经行了分析与研究。本文的主要工作集中在:对web页进行概述,主要是对Internet的历史和发展作了回顾,在web页的定义而后特性上进行阐述。而Web设计的健康发展依靠web标准的采用,没有web标准就不会有真正的可访问性和连贯的设计。不用web标准,就跟不上时代。在这样的标准时代,我们需要网页更加容易扩展,适合自动数据交换,并且更加规整。而css,则实现了页面内容与样式分离。鉴于web标准,本论文着重对div+css 布局静态网页进行了讨论。并对网站开发过程中使用的开发工具和技术作了简要的介绍。 对网站建设中提及到术语进行了解释,并对个人网站的由来和发展经行了讨论;对自己的个人网站从规划建设经行了详细的分析;使用Html、Css、Photoshop 等技术实现了个人网站的各种功能并且就网站建设提出了自己的观点与建议。 【关键词】网页设计div+css Photoshop 简单生活网上买菜

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

《网页制作》教学设计(优质课比赛优秀设计)《网页制作》教学设计 一、教材或教学内容分析 本章内容在本教材中的位置处于第五章,是在文字处理(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制作各种超级链接

网页的制作说课稿

网页的制作说课稿 【教材分析】 网页的制作在网络技术应用的第四章起着承上启下的作用。学生使用表格进行网页布局是网页制作的基本方法,同时也是极为枯燥难学的技能,学会它不仅是学会一项技能,更重要的是用它来正确、美观的表达处理信息。本节课的重点是运用表格进行网页布局,插入图文素材到表格。难点是表格布局多元化,表格与图文素材的关系。 【学情分析】 学生在幻灯片学习中会使用插入图片,部分学生熟悉表格操作,大部分学生表格概念较差,操作不够熟练。课堂上学生不喜欢教师过多的讲解,更想亲自操作;喜欢通过活动、比赛之类的形式进行学习与交流。 【新课目标】 1、认识网页制作的一般步骤;运用表格进行布局;学会插入网页图文素材到表格的基本方法。 2、利用教学网站、小组等进行学习与交流;充分运用多种资源达成学习目标。 3、树立团队意识;培养爱国情操与积极向上的价值观。 【总体思路】 以一场分组式的网页制作大赛为主线,分四个阶段性任务逐步推进。以“虎门销烟启思录”首页为题,从简单的表格制作到网页菜单着色,最后用填充或自创的方式完成作品。 【教学方法】 1、阶段与层次结合的任务驱动法:它是指根据学生对内容的熟悉程度不同,把任

务分解成几个阶段以适应不同层次的学生,并以此进行任务驱动的方法。其实现的关键是阶段性任务不但要适应层次,还要有密切联系。本课中围绕表格布局分三个阶段,第一阶段建立1行2列的表格,这是一个很基本的任务,简单但操作要领相同。几分钟后教师抛出第二阶段任务,“进行1行8列网页菜单表格着色”,此时先完成者一方面进入二阶段任务,同时又可以帮助未完成的学生,激发未完成学生的追赶意识。在此后的第三阶段优生可以自己创建复杂的表格,差生则可以进行简单的填充网页素材。这样一来,任务与任务是有序推动,学生与学生之间更是相互照应。 2、因势利导法:所谓因势利导,就是根据学生的需要和特点,利用并调动积极因素,使学生扬长避短,健康成长。在本例中学生喜欢比赛,那我们就以比赛的形式激发他们的热情,用规则来促进他们的互动。在小组比分落后,学生信心有所下降时,我们让低分组进行抢答比赛,以此倍增他们的信心。这样一来不但全体学生从操作上升到理性认识,还以多姿的形式活跃了课堂。当然演示法与讲解法的结合无疑会强化教学重点、难点。 【学生学法】 1、任务式的小组学习:学生在几个阶段的任务均采用了任务式小组学习,本课中是按机号原则进行分组的,可能有的人认为有违学生自愿,但我认为这样分组学习利大于弊:学生之间可能有几分陌生,不过他们是为了一个共同的任务而进行交流学习,这不正是我们现实工作中的情况吗?很显然这种学习是一种能力的锻炼与体现,是以后协调工作的一种演练。同时陌生学生之间进行交流与沟通无疑增强了团队意识。 2、探究型学习:是指在教师的指导下,学生对问题主动进行研究,以解决问题的学习活动。本课主要在后阶段采用了该方法。特别对于表格中边框、颜色、插入图片尺寸过大等问题,教师不直接告诉答案,而是让他们通过上网、同学交流去进行研究以找到方法。这样一来学生不是单一的学习技能知识,还是一个寻求解决问题的思维过程。

教你制作静态网页的方法

教你制作静态网页的方法 一、网页设计基础 1、熟悉Dreamweaver 8的工作环境 2、创建新站点 创建本地站点:站点----管理站点----新建----站点(前三步也可直接从“新建站点”进入下面的设置向导对话框)----跟随向导设置直至完成 3、网页文件的基本操作 a、创建、打开和保存网页文件 创建:文件----新建----创建 打开:文件---打开----选择欲打开的文件 或者在右边的文件浮动面版中选择打开 保存:文件---保存或另存为 b. 设置网页的页面属性 修改---页面属性---然后设置(标题、背景、背景图像、文本等) c. 设置网页对象的颜色 网页对象,如页面背景、文字、链接都经常需要设置颜色。 可在各自对应的属性面版中设置。 d. 网页文本的输入和属性设置 文本可键入、导入、粘帖 文字可设置字体、大小、颜色、格式等。 键入空格的方法:1、汉字输入法设置为全角方式,按空格键即可输入。2、属性面版格式中:预先格式化的 换行:ENTER、SHIFT+ENTER 实例练习: 1、输入以下文字 书签夹在诗集里, 落叶夹在深秋里。 喜悦夹在生活里, 追求夹在人生里。 2、第一次设置格式为“无”,字体为“华文行楷”,字体颜色为“红色”,字号为“5号”,添加项目符号。然后保存、预览。 3、第二次设置格式为“标题一”,字体为“楷体”,字体颜色为“蓝色”,字号为“5号”,添加项

目符号,对齐方式为“居中”。然后保存、预览。 比较两次设置的效果。 e. 网页图片的插入和属性设置 插入图片,在对话框中选择图片。(最好在建立站点时将欲用的图片素材复制到本地站点目录中) 插入图像占位符,在图片准备好后再加入图片。加入方法:1、双击图像占位符;2、点“属性面版”中的“指向文件”,拖到右边文件中要插入的文件处。 在图像属性面版中设置 f. 插入层 方法: 1、点击插入面版中的“描绘层”;2、在网页编辑器窗口中按住鼠标左键拖画出定位用的层; 3、可以随意移动层的位置; 4、可在层中插入图像、文字等。 g. *插入表格,用表格定位 方法: 1、先用鼠标点至欲插入表格的位置; 2、点插入面版中的“表格”—“插入表格”; 3、确定行数、列数后确定即将表格插入到选定位置了; 4、可在表格中任何单元格里插入图像、文字等。 h. 建立超链接 方法: 1、选中要建立超链接的文字或图像; 2、点右键“创建链接”打开的窗口或在属性的链接栏里,填入链接的目标。(如:本网站另一个网页,或外部网页如https://www.doczj.com/doc/5310643407.html,,或电子邮件如:mailto:zdhwangji@https://www.doczj.com/doc/5310643407.html,) 3、在页面属性里修改链接的属性:修改--页面属性(链接、活动链接、访问过链接) 二、制作实例1

网页设计说课稿

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

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

静态网页制作

静态网页制作 一、网页设计基础 1、熟悉Dreamweaver 8的工作环境 2、创建新站点 创建本地站点:站点----管理站点----新建----站点(前三步也可直接从“新建站点”进入下面的设置向导对话框)----跟随向导设置直至完成 3、网页文件的基本操作 a、创建、打开和保存网页文件 创建:文件----新建----创建 打开:文件---打开----选择欲打开的文件 或者在右边的文件浮动面版中选择打开 保存:文件---保存或另存为 b. 设置网页的页面属性 修改---页面属性---然后设置(标题、背景、背景图像、文本等) c. 设置网页对象的颜色 网页对象,如页面背景、文字、链接都经常需要设置颜色。 可在各自对应的属性面版中设置。 d. 网页文本的输入和属性设置 文本可键入、导入、粘帖 文字可设置字体、大小、颜色、格式等。 键入空格的方法:1、汉字输入法设置为全角方式,按空格键即可输入。2、属性面版格式中:预先格式化的 换行:ENTER、SHIFT+ENTER 实例练习: 1、输入以下文字 书签夹在诗集里, 落叶夹在深秋里。 喜悦夹在生活里, 追求夹在人生里。 2、第一次设置格式为“无”,字体为“华文行楷”,字体颜色为“红色”,字号为“5号”,添加项目符号。然后保存、预览。

3、第二次设置格式为“标题一”,字体为“楷体”,字体颜色为“蓝色”,字号为“5号”,添加项目符号,对齐方式为“居中”。然后保存、预览。 比较两次设置的效果。 e. 网页图片的插入和属性设置 插入图片,在对话框中选择图片。(最好在建立站点时将欲用的图片素材复制到本地站点目录中) 插入图像占位符,在图片准备好后再加入图片。加入方法:1、双击图像占位符;2、点“属性面版”中的“指向文件”,拖到右边文件中要插入的文件处。 在图像属性面版中设置 f. 插入层 方法: 1、点击插入面版中的“描绘层”;2、在网页编辑器窗口中按住鼠标左键拖画出定位用的层; 3、可以随意移动层的位置; 4、可在层中插入图像、文字等。 g. *插入表格,用表格定位 方法: 1、先用鼠标点至欲插入表格的位置; 2、点插入面版中的“表格”—“插入表格”; 3、确定行数、列数后确定即将表格插入到选定位置了; 4、可在表格中任何单元格里插入图像、文字等。 h. 建立超链接 方法: 1、选中要建立超链接的文字或图像; 2、点右键“创建链接”打开的窗口或在属性的链接栏里,填入链接的目标。(如:本网站另一个网页,或外部网页如https://www.doczj.com/doc/5310643407.html,,或电子邮件如:mailto:zdhwangji@https://www.doczj.com/doc/5310643407.html,) 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、示范教学:学生归纳总结,老师帮助、提醒,使学生掌握正确的操作步骤。

《网页设计》课程教学大纲

《网页设计》课程教学大纲 一、课程说明: 课程类别:选修课 适用专业:工商管理、电子商务专业、信息管理与信息系统专业和计算机相关专业、艺术设计专业等。 计划学时:60学时(讲课24学时,上机实验36学时) 学分:4 先修课程:计算机基础 执笔: 审阅: 二、课程的教学目的 以培养应用型人才为目标,充分考虑远程教育学生的学习基础和学习特点。简单介绍HTML语言、CSS样式、javascript语言,全面介绍与网页设计制作有关的知识,通过对Web页制作技术和制作工具的学习,使学生对于网页设计中所涉及的相关知识有一个全面的了解。并使学生具有解决一般网页制作问题的能力。掌握运用Dreamweaver CS6网页制作软件制作网页的方法,掌握运用Fireworks CS6、photoshop cs6图像处理软件进行网页中图形制作版式设计及切片的应用。掌握运用flash CS6动画制作软件设计网页中动画的方法,进而掌握将这四个软件互相配合,完成网页设计与制作任务的方法。为今后从事网页设计与制作工作打下基础。 三、课程教学基本要求: 1、课程重点 掌握网页制作三剑客Dreamweaver、Fireworks、flash及photoshop在网页设计过程中的应用,使学生具备网站策划、网页设计与制作、效果图设计与制作等方面的技能,提高学生分析解决问题能力和项目实施能力,注重学生在学习和实践过程中职业素质的养成。通过学习,使学生熟练掌握运用Dreamweaver网页制作软件制作网页,掌握运用Fireworks、Photoshop图形图像处理软件进行网页中图形图像的设计与制作,掌握运用flash动画制作软件设计网页中动画的方法。 2、课程难点 (1)理解HTML语言各种文本格式、字符格式、段落设置、列表、标记的作用; (2)理解CSS样式表中属性单位的作用和意义; (3)理解javascript语言脚本程序的工作方式; (4)深入理解超级链接、图形图像各种功能和应用; (5)深入理解表格、AP Div、框架、表单的作用; (6)深入理解模板、库、行为和脚本的高级应用; (7)理解网站测试的目的和测试方法; (8)深入理解“切片”和“热点”的涵义和应用; (9)深入理解动画的组成“时间轴”、“场景”、“帧”的涵义及各种动画的制作; (10)理解使用图像设计软件进行版式设计的方法。 3、能力培养要求 (1)了解HTML语言的基本内涵。理解基本标记的用法; (2)掌握在网页中添加CSS样式的方法。熟练使用CSS设置网页格式和列表的格式; (3)熟练掌握网页中文本的输入、特殊字符的插入及字符格式的设置方法; (4)掌握在网页中嵌入图象和多媒体的方法;

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