章 | 第1章 网页制作基础 | |||||||||||||||||||||
节 | 1.2 什么是网页与网站 | |||||||||||||||||||||
教学目标 | 1、了解什么是网页、什么是网站，网页与网站的关系 2、了解网页的种类和网页的基本元素 3、了解什么是HTML语言以及HTML语言的格式 4、学会使用记事本编写源代码的方式来制作一些简单的网页 5、学会用编写源代码方式制作跑马灯效果 | 我爱你的韩文|||||||||||||||||||||
教学重点、难点 | 1、网页的分类和组成网页的基本元素 2、HTML语言标记和格式 3、掌握用记事本编写网页的方法 4、掌握跑马灯效果的制作 | |||||||||||||||||||||
技能培训的目的 | 1、学会用记事本编写源代码的方式来制作一些简单的网页 2、学会MARQUEE标记的用法，制作跑马灯效果。 | |||||||||||||||||||||
教法 | 阅读演示与练习相结合、引发学生学习的兴趣、指导学生自学 | |||||||||||||||||||||
学法 | 记忆、观察、思考与上机实践 | |||||||||||||||||||||
教具使用 | 多媒体投影、多媒体计算机机房 ps字 | |||||||||||||||||||||
教学内容与过程 | ||||||||||||||||||||||
教学内容 | 教师活动 | 学生活动 | 备注 | |||||||||||||||||||
复习提问 | 提问： 1、什么是WWW服务？ 2、访问www.sina识别哪些是超文本链接，哪些是超媒体链接？ | 思考 回答问题 | ||||||||||||||||||||
导入新课 | 同学们都已经能通过浏览器访问Internet上的各类网站和网页，但谁能准确的告诉我什么是网页？网页由哪些元素组成？网站和网页有什么关系？网页是怎么编写出来的？这就是本节要讲解的内容。 | 引发学习兴趣 明确学习内容 | ||||||||||||||||||||
讲授新课 1．什么是网页 2．网页的几种基本组成元素 3．什么是网站 4．HTML语言简介 5．跑马灯效果 6．学生上机操作，复习刚才所学的操作，完成后制作课后的操作题。 | 给出本节课题 1.2 什么是网页与网站 1．什么是网页 网页是WWW服务中最基本的文档。是用HTML超文本标记语言或其他类似的语言（ASP、JSP、PHP等）编写的一种文档，该文档可以通过WWW方式在网上传播，被浏览器识别、以WEB页面形式显示出来。 分类： （1）静态网页（扩展名为htm、html） （2）动态网页（扩展名为asp、aspx、珠夫人斛珠夫人读音jsp、php、cgi等） （3）区别 静态网页与动态网页的区别在于网页是否具有应用程序解释器和后台数据库支持，而不是指网页是否具有动感效果。使用了应用程序解释器和后台数据库的，我们称为动态网页，反之为静态网页。 2．网页的几种基本组成元素 （1）文本 （2）图片 常用图像格式：JPEG和GIF GIF适合：支持透明背景、支持动态效果、适用于颜数比较少的图片（文字特效图片等） JPEG适合：支持1670万种颜，适用颜丰富的画面（风景画、照片等） （3）多媒体元素：音频、视频和动画 音频：WAV和MIDI格式 视频：RM、AVI、WMV格式 动画：SWF（FLASH动画）、GIF格式 （4）超链接 （5）脚本程序（Script） 可以在网页中直接解释的程序语言，有：JavaScript、VBScript两种语言。 3．什么是网站 （1）学生阅读书中第5页中“什么是网站”小节的内容，出以下问题的答案（8分钟）： A、网站、站点、首页、主页的概念与关系 网站：许多相关网页有机结合而形成的一个信息服务中心。又常被为“站点”。 首页：指用户在浏览器地址栏里输入网址后自动打开的默认页面。又称为主页。网站的其他页面都会通过超链接与这个主页相连。这些页面通常称为子页面。由于主页在一个网站的所有网页里处于中心地位，所以经常有人用主页来代替网站的称呼，如个人网站称为个人主页。 B、首页的名称是什么？ 首页的主名一般定义为index或Default，如果首页类型是静态网页，那么首页名称一般为index.htm、Default.htm或index.html、Default.html，如果首页是动态网页类型并是用ASP语言编写的，那么首页名称为index.asp或Default.asp。 C、主页设计的重要性？ 主页是用户访问该网站时第一眼所看到的页面，所以主页的设计就至关重要。主页既要表达出网站的风格、内容，又要美观醒目、吸引用户的注意力。否则，访问者就有可能因为第一印象不好而不再访问该网站。 （2）老师提问，学生回答上述问题 4．HTML语言简介 （1）什么是HTML语言 HTML是Hypertext Markup Language 的缩写，意思为“超文本标记语言”。 HTML就是用于编写网页的统一的语言规范。只有采用HTML制作的网页，浏览器才能正确地阅读和运行。 （2）HTML语言的编写方法 第一种方法：使用记事本之类的工具，输入HTML标记和网页的内容进行直接编写，然后保存为以html或htm为扩展名的网页文件； 第二种方法：使用可视化的网页制作工具根据用户的可视化操作自动生成HTML代码，这样可以使人不需要了解HTML语言也能做出很好的网页。 （3）演示用记事本编写网页：跟我学“我的第一个网页”。 （4）学生上机操作老师演示的实例（5分钟） （5）讲解HTML源代码的一些基本知识 通过刚才的操作，很多同学都制作出了自己的第一个网页，但有些同学还没有，为什么呢？主要是HTML代码输错了，代码出错了，网页就显示不出来了，接下来，我们来学习一些关于源代码的基础知识。 A、标记的写法 HTML语言中所有的标记都要用<>包起来，如<P>，小括号中的标记字母不用区别大小写，<>与标记中间不能用空格隔开。 B、标记的类型 Html语言中的标记可以分为两类：对称标记和单独标记。 对称标记中的HTML标记是对称的，表示方式是：<标记>内容</标记>。其中“<标记>”称为起始标记，表示某种格式功能的开始，而后面的“</标记>”称为结束标记，表示这种格式功能的结束，如上例中的<P>这是我用记事本编写的第一个网页</P>。 对称必须首尾呼应、有头有尾；对称标记允许相互嵌套，但不能交叉嵌套，单独标记中的HTML标记是不成对的，表示方法是：<标记>。标记中只有起始标记没有结束标记，如<BR>标记的作用是换行，功能相当于WORD文档中的回车符。 C、文件标记 (A) 从上例可以看出所有HTML文件都必须用特定的标记“<HTML>”起始，表示这是个网页文件，网页内容一直持续到</HTML>标记结束。 (B) 网页文件内容分为两大部分：<Head>和</Head>对称标记我们称为头部分，主要包含着和网页文件有关的一些头信息，除了标题标记<title></title>外，其他内容不会显示在浏览器中；<Body>和</Body>对称标记我们称为正文部分，里面的内容会显示在IE浏览器中。HTML语言的其他标记都必须写在这两大标记中。 (C) 网页头部分中的<Title>对称标记是标题标记，该标记的作用是在浏览器的标题栏中显示网页的标题。 (D) 网页正文部分中的<P>对称标记是段落标记，该标记的作用是用来划分段落的，在该标记中我们可以输入一段文字。 D、标记参数 (A) 标记中可以加上参数设定，但参数必须加在起始的标记内，如：<font size="+7">欢迎光临！</font> 。 (B) 如果一个标记中有多个参数要设定，那么用空格隔开参数，如：<font size="+7" color="red">欢迎光临！</font>。 5．跑马灯效果 （1）基本语法 <marquee>文字或图片</marquee> 该语法只适用于在IE浏览器中显示，只能放在<Body>标记中使用，作用是实现标记中的内容在页面移动的效果。 （2）演示操作实例1 <HTML> <HEAD> <title>欢迎大家光临</title> 求个好玩的网游 </HEAD> <BODY> <marquee>这是我用记事本编写的第二个网页</marquee> </BODY> </HTML> （3）学生上机操作实例1（5分钟） （4）讲解参数属性表
（5）演示讲解实例2、实例3、实例4，说明参数的使用方法 6．上机操作： （1）继续上机操作老师演示的实例“我的第一个网页”，理解源代码的基本含义 （2快手名字大全）上机操作“跑马灯效果”跟我学的4个实例，掌握跑马灯的制作。 （3）上机操作课后操作题：4.2、4.3、4.4 | 理解记忆 看书、思考、出相关答案 回答问题 观察操作过程 学习具体操作 观察操作过程 学习具体操作 操作，并记录下来 思考 | 教师讲解、启发 教师下台指导学生看书 老师要经常提示，并鼓励有不同的看法 这里先不给学生讲解原理，先满足学生的好奇心，学会依葫芦画瓢做出第一个网页，再讲解源代码的一些基础知识。 结合“跟我学”案例边演示边讲解 教师下台指导学生 也可以采用小组教学的方式，先小组内互帮互学，小组内不能解决的请教老师 | |||||||||||||||||||
小结 | 1、什么是网页、什么是网站，网页与网站的关系 2、网页的种类和网页的基本元素 3、什么是HTML语言以及HTML语言的格式 4、使用记事本编写源代码的方式来制作一些简单的网页 5、用编写源代码方式制作跑马灯效果 | |||||||||||||||||||||
作业 | 1．书P11：1.3、1.4、1.5、1.6、1.7、1.11、1.13、2.1、2.3、2.5、2.9、2.10、3.4、3.5、3.6、3.7、3.8 2．温习所掌握的操作 3．预习下一节内容 | |||||||||||||||||||||
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论