教案模板【经典】_第1页
教案模板【经典】_第2页
教案模板【经典】_第3页
教案模板【经典】_第4页
教案模板【经典】_第5页
已阅读5页，还剩1页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

《网页设计与制作》教学设计教学对象16.1、16.2教学时间90分钟教学课题常用标签设计理念.HTML是一门静态网页的设计语言，学好它对后面学习动态网页的开发提供了保障。.让学生学会常用的标签。.以案例的方式来教学，能让学生举一反三，融会贯通。教材分析网页的本质是使用标签语言编写一篇“文章”，它通过浏览器的解析能够将页面中的元素表示出来，那么作为网页的设计者就必须对这种标签语言有所了解。教学目标知识通过教师讲解、师生互动等方式，使学生掌握八士山1常用标签的用法，并能够把握静态网页的整体结构。技能通过老师的讲解与总结使学生能够运用html标签进行静态网页的开发。情感、态度价值观目标通过学习，引导学生对网页开发产生兴趣，让学生熟悉静态网页的结构以及今后网页开发的方向。教学重点1.html常用标记的用法2.HTML文档结构与基本语法教学难点1.表单标签与表单设计。教学方法.任务驱动法：给学生一个小的题目，让学生通知刚学的知识来完成任务，编写程序；.案例教学法：用设计案例的方式，让学生能熟练运用所学知识。教学后记

教学流程教学内容与时间分配教师行为学生行为教学理念（设计意图）导入（1~3分）【PPT1】：HTML教师：HTML是一种标签语言，而不是一种编程语言，这种语言的结构很简单，只要明白了各种标签的使用方法便学懂了HTML。HTML是一种用于描述网页文档的超文本标记语言。【PPT2】：HTML文档教师：HTML文档的扩展名为“.htm”或“卜31”，两者并无差别。【PPT3】HTML标签教师：标签（tag，也称标记）是用一对尖括号“<“和”>“括起来的单词或单词缩写，它是HTML文档的主要组成部分。每个标签都有特定的描述功能，HTML文档就是通过不同功能的标签来控制Web页面内容的。【PPT4】HTML的结构教师：HTML文档结构很简单，由最外层的<html>标签组成，里面是文档的头部和主体。在Dreamweaver中新建一个HTML文档可以清晰看到」其基本结构，如图2-2所示。学生思考学生回答

教学内容与时间分配教师行为学生行为教学理念（设计意图）正文讲授【PPT5】XHTML教师：XHTML是TheExtensibleHyperTextMarkupLanguage（可扩展超文本标识语言）的缩写，它是一种标记语言，不需要编译便可直接由浏览器执行，表现方式与超文本置标语言（HTML）类似。在XHTML文档中必须进行文件类型声明（DOCTYPE一、什么declaration），必须存在html、head、body元素，而且title元素是HTML还要位于head元素中。文档，及其掌握文档类型声明部分、名字空间、head元素＞title兀让学生定义素、匕腐丫元素对HTML文【PPT6】：XHTML的语法规则档的结构有（4~16分）教师：所有的标签都必须关闭，即便是空标签也必须关闭；个总体的把所有标签的属性必须是小写；所有标签的属性值必须用英握文格式的双引号括起来；所有标签都必须合理嵌套；明确属性值，且不能简写。【PPT7】：HTML5教师：HTML5是对HTML标准的第五次修订，其主要的目标是将互联网语义化，以便更好地被人类和机器阅读，并同时降低Internet程序（RIA）对Flash、Silverlight和JavaFX一类浏览器插件的依赖，以便提供更好地支持各种媒体的嵌入。【PPT8】：XHTML的结构教师：＜header＞标签：用来描述一节或一个完整Web页面的介绍性信息，该标记可以包括所有的通常放在页面头部的标志。＜nav＞标签：用于放置主站点的导航信息。＜section＞标签：描述一个有主题的内容组，如章节、页眉、页脚或文档中的其他部分。＜article＞标签：article元素是将section进行打包形成一个文档或网站独立的部分，例如一篇杂志或报纸文章，或一篇博客文章。【PPT9】：HTML5特性教师：实现Web应用程序；更好地呈现内容学生思考学生倾听学生回答多媒体技术的有效运用

教学内容与时间分配教师行为学生行为教学理念（设计意图）正文讲授二、HTML标记的用法（4~16分）正文讲授三、列表标签的用法【PPT10】：网页文件的创建过程使用记事本创建网页、保存网页、启动浏览器进行浏览【PPT11］：常用标签教师：标题标签:<h#></h#>段落标签：<p></p>换行标签：<br/>超链接标签:<a></a>图像标签:<img/>列lj表标签:<ul><li></li><li></li></ul>表单标签：<form></form>【PPT13］：表格标签教师：：<table></table>在HTML中表格由table元素以及一个或多个tr、th或td元素组成，可以将任何东西（如图像、表单，甚至另一个表格）放进表格内。讲解表格标签的示例，如图2-31所示。学生思考学生讨论回答用例子的方式来区分有序列表和无序列表

教学内容与时间分配教师行为学生行为教学理念（设计意图）（二）超链接【PPT15］：表单标签教师：表单让HTML和XHTML真正具有互交性，使用表单可以创建用来获取和处理用户输入数据的文档，同时还可以生成个性化的回应，特别是在电子商务网站应用方面，表单更具有无限的潜能。<form>标签用于为用户输入创建HTML表单。在文档主体中，表单可以被放置于任何位置，只要将表单的元素都放在<form>标签与<f。皿>结束标签中就可以，此外form元素是块级元素，其前后会产生换行。Action属性说明了接收和处理表单数据的应用程序的URL，通常Web管理员将表单处理应用程序放在Web服务器上名为“cgi-bin"目录下。Method属性用于规定使用何种方法发送表单数据，共有两种方法POST方法和GET方法。Id属性和name属性：id属性允许用户使用一个唯一的字符串来标记控件，这样程序或者超链接就可以直接引用它们。Name属性就是控件的名称，可以重复。【PPT16］：<input>标签教师：<input>标签用于定义表单控件，根据不同type的属性值，输入字段拥有很多种形式。【PPT17】：HTML5新增标签教师：video标签：HTML5视频标签video是新增元素之一。该标签将改善用户Web体验，让用户在轻松愉快的民用情况下观看视频。<video>标签支持的视频格式，在不同浏览器中的兼容性见表2-2。对学生进行学练结合的方式进行讲解音频格式IE9Firefox3.5Opera10.5Chrome10Safari3.0Ogg///MPEG4///WebM///表2-2音频标签:HTML5规定了一种通过audio元素来包含音频的标准方法，与video元素类型类似，audio元素能够播放声音文件或者频流。

课堂小结（18—19分）【PPT18］：小结教师：（注意速度，和学生一起回顾）今天我们所学的三个问题：是什么，为什么，怎么样。着重掌握如何HTML文档中常用标签的用法的结构，特别是HTML5中视频标签＜video＞和音频标签＜audio＞【PPT19】：教师：最后再送大家一句话，”天才是等于1%的智商加上99%的汗水”学生：回答略多次强调教学重难点，给学生良好的暗示。德育渗透教学内容与时间分配教师行为学生行为教学理念（设计意图）延伸阅读及作业设计（19—20分）【PPT21】：延伸阅读教师：关于HTML文档中如何创建漂亮的表格，我们下一节课再做进一步的了解。，请同学们结合我们的延伸阅读

人人文库> 全部分类> 行业资料 > 信息产业

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论