文档介绍：该【《网页美工设计》教案设计 】是由【春天的小花】上传分享，文档一共【28】页，该文档可以免费在线阅读，需要了解更多关于【《网页美工设计》教案设计 】的内容，可以使用淘豆网的站内搜索功能，选择自己适合的文档，以下文字是截取该文章内的部分文字，如需要获得完整电子版，请下载此文档到您的设备，方便您编辑和打印。讲课教师:
章节
内容
教课
目标
要点
难点
教课
方法
教课
环境
适用标准
《网页美工设计》课程教课设计
讲课班级:地址:
网页设计基础知识
Dreamweaver软件介绍及其基础操作
使学生认识网页设计的有关基础知识;
使学生熟****Dreamweaver软件界面的基本操作方法。
认识网页设计有关看法和网页的种类;
娴熟掌握Dreamweaver软件创立和管理站点的方法。
讲堂解说、事例解说与指导
计算机机房
教课过程及内容概要
课时:
时间
备注
分派
一、引入
1、互相认识,提出与本学科有关的知识,介绍本门课程状况、教课内
容及总学时数进度安排,宣讲本课程教课纪律,鼓舞学生创造一种学****气氛,尊敬同学,互帮互学,真实达到学致使用;
2、提出问题:上过网吧?有谁自学过网页设计?听闻过网页设计三剑客吗?
二、见告学生讲堂任务
本次课所学****的主要内容是网页设计有关基础知识和Dreamweaver软件基础操作;
教三、逐渐演示解说剖析教课内容
学1、网站和网页的差别:
过(1)网页是Internet基本元素;
程(2)网站由网页构成;
设2、静态网页和动向网页:
计静态网页:纯粹HTML语言格式的网页往常被称为静态网页,、.html、.shtml、.xml。
动向网页:很多人以为网页会动就是动向网页,这是个错误的看法,在静态的网页中也能够含有动向的图片,这不过是视觉上的动向罢了。真实的动向网页是指实质上其实不是独立存在于服务器上的网页
文件,只有当用户恳求时服务器才返回一个完好的网页。也就是说,
它是返回到了客户端上的网页。比如网页文件是以ASP、PHP、JSP、
ASPX为结尾就是动向的网页了。
静态网页的特色:
1)内容相对稳固,简单被搜寻引擎检索到;
2)没有数据库支持,在网站制作和保护方面工作量大;
3)交互性差,在功能方面有很大的限制。
约10分钟
学生理解
约5分钟
约25分钟
文案大全
适用标准
动向网页的特色:
1)以数据库技术为基础,可大大降低网站保护的工作量;
2)可实现更多的功能,如用户注册、新闻公布、在线留言等;
3)不利于使用搜寻引擎进行网站推行。
3、常有网页种类:形象页、主页、栏目页、内页、新闻详尽页等;
4、网页设计原则:
1)认识客户需求
2)按照Web标准
3)运用形式美法例
5、网页设计流程:
1)手绘成效图:确立网页主题内容微风格
2)设计成效图:收集、整合设计所需素材
3)版面编写:网页的制作与实现
4)网页美化:动画设计,网页测试和公布
6、网页设计的主要软件:
1)Photoshop
2)Dweamveawer
3)Flash
4)Firworks
7、Dreamweaver软件界面介绍:
1)软件面板构成及基本操作方法
2)软件参数设置
8、Dreamweaver站点创立:
站点->新建站点->设置站点名称->设置站点默认图像文件夹。
9、学生实训操作:
Dreamweaver站点创立与设置
10、Dreamweaver创立第一个网页:
1)名称:
2)设置标题、输入文本、输入特别字符
3)页面属性设置
4)预览网页
四、学生实训及指导;
创立第一个网页。
五、讲堂小结
本次课主要内容:
1、网页设计基础知识;
2、Dreamweaver基本使用方法;
3、Dreamweaver创立第一个网页;
后
记
约10分钟约6分钟
约6分钟
约4分钟
约8分钟
约12分钟
约20分钟学生实赴约50分钟
约40分钟学生实践
约4分钟总结
文案大全
适用标准
《网页美工设计》课程教课设计
讲课教师:
讲课班级:
地址:
章节
Dreamweaver表格操作;
内容
CSS款式表应用。
教课
1)
掌握Dreamweaver中表格的设计方法;
目标
2)
CSS款式表的使用方法和技巧。
要点
1)
娴熟掌握Dreamweaver中表格的基本操作方法;
难点
2)
认识网页设计中CSS款式表的作用和设置方法。
教课
讲堂解说、事例解说与指导
方法
教课
计算机机房
环境
教课过程及内容概要
一、
引入
1、
回首上一次课所学****的内容:网页设计基础理论知识,
Dreamweaver软件使用初步;
2、
提出问题:对Word中表格操作还娴熟吗?
CSS是什么?怎样设
置网页中各样元素的显示成效?
二、见告学生讲堂任务
本次课所学****的主要内容是Dreamweaver中表格的使用和Dreamweaver创立CSS款式表;
三、逐渐演示解说剖析教课内容
教1、网页中表格的作用:
学(1)内容组织和定位;
过(2)网页排版;
程2、表格布局和Div布局差别:
设各有优势。
计表格:简单,好用,学起来很简单上手。各样阅读器都支持!基本
上不会变形。可是代码冗余许多,保护起来也不怎么方便。
DIV+CSS长处:代码冗余小,因此网站翻开速度快一些。保护起来
特别方便。可是要兼容IE6IE7火狐等阅读器的话,开始学就会
很头疼这个问题的。常常在IE6里面看着整个网页是好的,可是到
了IE7或许火狐里面就全乱了。
介绍:用div做框架,table用来储藏数据。
3、Dreamweaver中表格的基本操作:
(1)表格和单元格的选择及属性设置;
(2)行和列的增添和删除;
(3)单元格的归并和拆分;
(4)表格的嵌套;
课时:
时间
备注
分派
约4分钟
约6分钟学生理解
约30分钟
文案大全
适用标准
4、实例演示解说:使用表格制作一像素细线;操作步骤:
1)插入1行1列表格;
2)设置单元格背景颜色;
3)设置单元格高度为1;
4)转到代码视图;
5)把单元格中的 删除。
5、指导学生实训操作;
6、Dreamweaver中CSS款式表的使用:
1)CSS款式表文件的创立;
2)创立CSS款式:网页链接款式2;
3)创立CSS款式:网页凹下链接款式;
4)创立CSS款式:类链接款式;
5)创立CSS款式:滤镜款式。
7、指导学生进行CSS款式实训操作;
8、事例演示解说:个人主页首页布局设计
1)创立网页;
2)设置网页属性;
3)使用表格布局网页(上中下型);
4)使用Photoshop制作页面头部Banner图片;
5)制作导航栏渐变背景图片;
6)制作页面主体(左边通告赛马灯成效和友谊链接,右边资讯速递及图片列表);
7)页面底部设计。
四、部署并指导学生达成讲堂作业;
五、讲堂小结
本次课主要内容:
1、Dreamweaver网页表格基本使用方法;
2、Dreamweaver创立CSS款式;
约10分钟学生思虑
约15分钟学生实赴约35分钟学生理解
约15分钟学生实赴约40分钟学生理解
约40分钟学生实践
约5分钟总结
后
记
文案大全
适用标准
《网页美工设计》课程教课设计
讲课教师:
章节
内容
教课
目标
要点
难点
教课
方法
教课
环境
讲课班级:地址:课时:
Dreamweaver中图像的使用;
网页字体设计;
表单设计制作。
掌握Dreamweaver中图形图像的使用和属性设置方法;
掌握网页表单的设计技巧。
娴熟掌握Dreamweaver中图像热门链接的创立方法;
掌握用户注册表单的设计方法和技巧。
讲堂解说、事例解说与指导
计算机机房
时间
教课过程及内容概要备注分派
六、
引入
3、
回首上一次课所学****的内容:
Dreamweaver表格的使用和属性设
约4
分钟
置,Dreamweaver中创立CSS的方法;
4、
评论上周作业;
约10
分钟
5、
提出问题:什么是热门链接?网站的注册页面是怎样制作的?
教
学
过
程
设
计
七、见告学生讲堂任务
本次课所学****的主要内容是Dreamweaver中图像的使用和网页表单的设计;
八、逐渐演示解说剖析教课内容
9、网页中支持的图像格式:jpg、gif、gif动画、bmp、png
10、网页中图像使用原则:
1)尽量小,对较大的图片文件进行适合的压缩和切割;
2)应当精选与网站主题有关系性的图片;
3)关于网站的标记图片,主体应当清楚可见,图形的含义最好简单了然,图片内所含的文字应当清楚且简单辨识;
4)背景图片不过用来衬托图片主题的,切忌过于花哨;
5)图片颜色应当与页面整体配色协调。
11、Dreamweaver中图像的使用:
1)插入图像;
2)设置图像属性;
3)增添图像热门链接。
12、指导学生实训操作;
13、实例演示:Dreamweaver中变换图像的创立方法---创立导航条。
约5分钟学生理解学生理解
约10分钟学生理解
约10分钟学生实赴约10分钟
约10分钟学生实践
文案大全
适用标准
14、
指导学生达成实例实训操作;
15、
网页字体设计:
(1)文字款式;
(2)大小;
(3)颜色
(4)其余属性。
16、
实例解说:内容详尽页的创立。
17、
指导学生达成实例实训操作;
18、
Dreamweaver中网页表单设计制作:
(1)网页表单的作用;
(2)常有表单页种类;
19、
实例演示:创立用户注册表单页;
(1)拟订插入表单的页面地点;
(2)插入表单;
(3)在表单中插入表格为表单控件布局;
(4)插入文字标签;
(5)插入表单各样控件并设置表单控件的属性;
(6)使用CSS美化表单控件;
20、
Dreamweaver中的层的使用方法及其实例解说;
21、
指导学生实训练****br/>22、
Dreamweaver中行为的增添方法和使用技巧:
(1)互换图像;
(2)弹出信息;
(3)翻开阅读器窗口;
(4)播放声音;
(5)改变属性;
(6)显示-隐蔽层;
(7)转到URL.
23、
指导学生实训练****br/>24、
综合实例演示解说:运用
Dreamweaver中的层和行为来制作网
页下拉菜单式导航条:
25、
指导学生实训练****br/>九、
部署讲堂作业并指导学生达成作业实训:
个人主页用户表单设计。
十、讲堂小结
本次课主要内容:
1、Dreamweaver中图像的使用方法和技巧;
2、Dreamweaver中字体的设计;
3、Dreamweaver中表单页面的设计制作。
约10分钟学生理解
约10分钟
约20分钟学生实践
约5分钟学生理解
约15分钟
约10分钟
约15分钟学生实赴约5分钟
约10分钟约10分钟
约10分钟约20分钟
约1分钟总结
文案大全
适用标准
后
记
《网页美工设计》课程教课设计
讲课教师:
讲课班级:
地址:
课时:
章节
Photoshop基本使用方法和技巧
内容
教课
5)
熟****Photoshop软件界面;
目标
6)
掌握Photoshop软件的基本操作方法。
要点
5)
掌握Photoshop软件界面基本操作方法和技巧;
难点
6)
掌握Photoshop中的图片合成和修复的应用方法。
教课
讲堂解说、事例解说与指导
方法
教课
计算机机房
环境
教课过程及内容概要
时间
备注
分派
十一、
引入
约4
分钟
6、
回首上一次课所学****的内容:网页字体设计,表单页设计制作;
7、
评论上周作业;
约10
分钟
8、
提出问题:网页中的图像是怎么办理的?能否用过什么图像编
辑软件?
十二、
见告学生讲堂任务
本次课所学****的主要内容是
Photoshop基本使用方法和技巧;
教
逐渐演示解说剖析教课内容
十三、
学
Photoshop软件介绍;
26、
过
Photoshop软件界面介绍;
27、
程
Photoshop基本操作方法:
28、
设
(1)首选参数设置;
计
2)工具栏的使用;
3)图像显示比率设置;
4)单位标尺设置;
5)历史记录面板的使用;
6)其余工具面板基本操作。
29、指导学生实训操作;
30、实例演示解说:图层的基本操作方法;
31、指导学生实训操作;
32、变换图像方法:缩放、旋转、斜切、歪曲、***、变形、裁剪;操作步骤:
约2分钟学生理解
约5分钟约10分钟
约15分钟学生实赴约10分钟
约10分钟学生实赴约15分钟学生理解
文案大全
适用标准
1)翻开素材;
2)选择相应地区;
3)选择变换相应命令;
4)在图片相应地区进行操作;
5)保留并退出;
33、指导学生实训操作;
34、Photoshop应用实例解说:图片合成;
操作步骤:
1)导入所需图片素材;
2)新建Photoshop文件;
3)选用矩形选框工具选用导入素材的部分地区;
4)复制并粘贴到新建文件中并设置边缘羽化成效;
5)同法办理其余素材;
6)调整图像整体颜色成效;
7)导出最后图像;
35、指导学生达成讲堂实训设计实例;
36、几种修饰修复图像工具的使用及其实例操作演示解说:
仿造图章工具、污点修复画笔工具、修复画笔工具、修理工具、红眼工具、模糊工具、减淡/加深工具、海绵工具;操作步骤:
1)翻开素材;
2)选择对应工具;
3)设置有关属性;
4)在图片相应地区进行操作;
5)保留并退出;
37、指导学生达成讲堂实训设计实例;
十四、讲堂小结
本次课主要内容:
1、Photoshop软件的基本操作方法;
2、Photoshop图片合成方法;
3、几种修饰修复图像工具的使用。
约20分钟学生实赴约20分钟学生理解
约20分钟学生实赴约30分钟学生理解
约35分钟学生实践
约2分钟总结
文案大全
适用标准
后
记
文案大全
适用标准
《网页美工设计》课程教课设计
讲课教师:
讲课班级:
地址:
章节
Photoshop进阶使用
内容
教课
7)
图像的选用和抠图实例操作演示解说;
目标
8)
掌握Photoshop中滤镜和蒙板的使用方法和技巧。
要点
7)
熟****Photoshop中几种常用滤镜的使用方法;
难点
8)
理解图层蒙板的作用,掌握图层蒙板的使用方法和技巧。
教课
讲堂解说、事例解说与指导
方法
教课
计算机机房
环境
教课过程及内容概要
十五、引入
9、回首上一次课所学****的内容:Photoshop软件的基本操作方法、
Photoshop图片合成方法、几种修饰修复图像工具的使用;
10、评论上周作业;
11、提出问题:什么滤镜?什么是蒙板?滤镜和蒙版有什么用?滤
镜和蒙板怎么用?
课时:
时间
备注
分派
约2分钟
约10分钟
十六、见告学生讲堂任务
本次课所学****的主要内容是Photoshop高级应用,包含滤镜和蒙
板的使用、抠图方法、色彩调整;
教
学十七、逐渐演示解说剖析教课内容
过38、图像的选用和抠图实例操作演示解说:
程(1)迅速选择工具;
设(2)魔棒工具;
计(3)魔术橡皮擦工具;
(4)钢笔工具;
(5)抽出滤镜。
39、学生实训讲堂实例;
40、几种调整图像色彩的方法及其实例操作演示解说:
(1)灰度图像成效;
(2)色相饱和度调整;
操作步骤:
)选择图像或许图像地区;
)履行【图像】|【调整】|【色相/饱和度】命令;
调整数值;
)确立并保留图像;
约1分钟
学生理解
约20分钟
约20分钟学生实赴约10分钟
文案大全