第1章  网页设计基础
教学目标与要求
熟记站标、导航条、广告条、按钮等网页构成要素,以及网页、网站、IP地址、域名、网址等概念；了解网页的本质和网页的布局类型和HTML文档的基本结构,熟练掌握网站建设的基本流程;
教学重点
重点：站标、导航条、广告条、网页、网站、IP地址、域名、网址等概念,以及网站建设的流程
教学难点
难点： IP地址、域名、网址,HTML文档的基本结构及其常见标签
教学方法
提问、启发、图示、情景教学、案例、课堂讨论
教学课时
2课时
第1章  网页设计基础
教学
提示
dw滚动文字代码
导入课程：大家会输入文字、制作和处理图像、设计动画,如何把这些作品放到internet中,让更多的人去查阅和欣赏呢---DW就可以制作网页;
1.网页的构成要素和组成元素
⏹网页的构成要素：站标、导航条、广告条、标题栏和按钮；
⏹网页的组成元素：文字、图片、动画gif、flash、表单交互功能、音频、视频、超链接、表格、框架、导航等;
2.网页相关知识简介
⏹基本概念：
网页的本质
网页、网站、主页、互联网
动态网页、静态网页
IP地址、域名、网址url、浏览器等概念
⏹网页布局
网页布局的相关概念
常见的布局类型
⏹网站管理与网页制作相关软件
制作和管理网页工具；
制作和优化网页图像工具；
制作网页动画工具；
其中Dreamweaver、 fireworks、 flash这三个软件合称为网页“三剑客”;
其他小工具软件;
⏹HTML语言
HTML的概念
HTML文档的基本结构
几个常见的html标签： html、head、title、style、script、link、meta、body、img、p、font等;
⏹XHTML语言简介
⏹脚本语言简介
3.网页的设计理念和配方案
⏹网页的设计理念
⏹彩的三要素
⏹网页中的彩心理与网页表现
⏹彩搭配应遵循的原则
4.网站的开发流程
1网站需求分析
2设计制作网站页面
3空间和域名申请
4测试和发布网站
5网站推广
5.典型网站分析
⏹页面结构
⏹彩运用
以提问的方式引入课程
采用课堂讨论教学法,打开几个典型的网页让同学们讨论总结构成要素和组成元素;
打开一个搜狐主页,保存成不同的类型,让大家看保存的效果,加深对网页本质的理解；
先打开一个网页的源文件,结合网络常识,详细讲解网页的定义,然后略讲网站和主页的概念;并提醒同学理解并记忆这些概念;
以注册和登录邮箱为例,对比讲解动态网页和静态网页的特点和区别;
以平顶山学院和搜狐网站的IP地址与域名为例,简要讲述这两个概念;通过查看分析知名网站的网址引入url的定义和组成,其它概念略讲;提醒学生理解并记忆上述概念;
打开一网页详细讲解网页布局效果的教程让学生讨论、分析总结布局类型;
根据学生特点简要讲解ps、flash、fw等软件在网页设计中的功能;
打开搜狐主页的源代码,让学生认识一下html语言及其结构,然后分别用记事本和dw创建2个最简单的网页,让学生细看其源代码,并详细讲解8个基本标签及其结构关系,最后根据时间酌情讲解其它几个常见标签;
简要讲解这两个概念,然后创建一个网页,复制无缝循环的代码并粘贴到网页的body标签,让学生了解脚本语言的功能;
让学生欣赏插入后的效果,吸引学生dw的相关代码;
结合上网的经验,让学生总结网页的设计理念;
彩的三要素和心理表现学生在上学期的ps课程中学习过,采用提问法,进行复习；然后打开几个典型网站,分析其配方案,最后总结网页中彩运用的原则;
根据设计的先后顺序和学生一起分析总结网站的开发流程,并用图加以解释,重点讲解网站的需求分析,以加深学生对重点知识的掌握;
采用课堂讨论教学法,打开几个典型的网页让同学们讨论总结网站的构成要素、组成元素、布局结构和配方案;
作业布置：
1.察看并对比分析大型网站如中国网、着名学校网、着名医院网、官方网、科技网、娱乐休闲运动网、儿童网、体育网、着名出版社网、cctv网站、sohu、yahoo、IBM、微软等的风格、彩搭配与布局;
2 .察看的同时下载自己需要的文章、图片、软件等资源;
３.课后习题;
提问
小结：通过提问、启发、图示、情景教学、课堂讨论等教学方法的综合运用,提高了学生的学习兴趣,从学生的反应看,授课效果很好;
第2章  Dreamweaver基础知识
教学目标与要求
熟悉Dreamweaver 8工作界面 ,熟记几个常用的工具按钮和菜单命令；熟练掌握站点的创建步骤,能快速规范地创建站点；能够快速创建、打开、保存网页文档；能熟练设置页面的属性;
教学重点
1.创建站点并组织站点的结构;2. 在站点中创建网页3.页面的属性设置
教学难点
HTML基础
教学方法
举例为主,适当讲授操作要领,提问以测试课题效果;
教学课时
2课时
第2章  Dreamweaver基础知识
教学  提示
我们一贯都是浏览网页,想自己动手做网站吗用什么工具做网站怎样做呢--- Dreamweaver网页制作工具;
  熟悉Dreamweaver 8工作界面
  网站创建与管理
2.2.1  站点的定义、组成和结构
2.2.2  网页文档与文件夹命名规则
2.2.3创建本地站点的步骤
2.2.4组织站点结构
网页文档基本操作
新建、保存、预览、打开、关闭
  基本页面属性设置
制定文档标题和边距、网页背景颜和背景图像,为网页设置文本属性、链接属性和跟踪图像的属性,总结页面的使用的技巧：
抛出问题,引入新课
启动dw,详细讲解插入栏、文档标签与“文档”工具栏、状态栏的作用,区分标签检查器、标签选择器、标记选择符3个概念及其作用
详细讲解站点的定义、组成、结构,以及文件和文件夹的命名规则;
演示站点的创建过程和步骤,着重提出保存和站点文件夹的命名;
详细讲解站点结构的组织方法和原则;
分别演示这几个操作
通过dw设计视图分别创建1个网页,分别演示文档标题和边距、背景颜和背景图像、文本和链接属性,以及跟踪图像的属性的设置方法和步骤,帮助学生掌握页面的设置过程;并总结页面设置和创建过程中的一些使用技巧;
作业：习题一第1,2, 3 题
小结：本次课内容操作性很强,经过学生自己上台操作,发现大多数学生都能创建并组织好一个站点,还能快速地设置网页的属性,达到了教学目标的要求;

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。