《HTML+CSS网页设计与布局》教案.docx
- 文档编号:27624281
- 上传时间:2023-07-03
- 格式:DOCX
- 页数:32
- 大小:29.48KB
《HTML+CSS网页设计与布局》教案.docx
《《HTML+CSS网页设计与布局》教案.docx》由会员分享,可在线阅读,更多相关《《HTML+CSS网页设计与布局》教案.docx(32页珍藏版)》请在冰豆网上搜索。
《HTML+CSS网页设计与布局》教案
《HTML+CSS网页设计与布局》课程教案
授课教师:
ﻩ 授课班级:
地点:
周课时:
5课时
章节
内容
网页设计基础知识
Dreamweaver软件介绍及其基础操作
HTML基础知识及常用标记
教学
目标
1)使学生了解网页设计得相关基础知识;
2)使学生熟悉Dreamweaver软件界面得基本操作方法。
重点
难点
1)了解网页设计相关概念与网页得类型;
2)熟练掌握Dreamweaver软件创建与管理站点得方法。
教学
方法
课堂讲授、案例讲解与指导
教学
环境
计算机机房
教学过程及内容提要
时间
分配
备注
教学过程设计
一、引入
1、相互认识,提出与本学科相关得知识,介绍本门课程情况、教学内容及总学时数进度安排,宣讲本课程教学纪律,鼓励学生营造一种学习氛围,尊重同学,互帮互学,真正达到学以致用;
2、提出问题:
上过网吧?
有谁自学过网页设计?
听说过HTML或者CSS这两个概念吗?
ﻫ
二、告知学生课堂任务
本次课所学习得主要内容就是HTML相关基础知识与Dreamweaver软件基础操作;
三、逐步演示讲解分析教学内容
1、网站与网页得区别:
ﻫ(1)网页就是Internet基本元素;
(2)网站由网页组成;
2、静态网页与动态网页:
ﻫ静态网页:
纯粹HTML语言格式得网页通常被称为静态网页,静态网页得后缀名通常为、htm、、html、、shtml、、xml。
动态网页:
许多人认为网页会动就就是动态网页,这就是个错误得观点,在静态得网页中也可以含有动态得图片,这仅仅就是视觉上得动态罢了.真正得动态网页就是指实际上并不就是独立存在于服务器上得网页文件,只有当用户请求时服务器才返回一个完整得网页。
也就就是说,它就是返回到了客户端上得网页。
例如网页文件就是以ASP、PHP、JSP、ASPX为结尾就就是动态得网页了.
静态网页得特点:
ﻫ
(1)内容相对稳定,容易被搜索引擎检索到;ﻫ
(2)没有数据库支持,在网站制作与维护方面工作量大;ﻫ(3)交互性差,在功能方面有很大得限制。
ﻫ动态网页得特点:
(1)以数据库技术为基础,可大大降低网站维护得工作量;ﻫ
(2)可实现更多得功能,如用户注册、新闻发布、在线留言等;ﻫ(3)不利于使用搜索引擎进行网站推广。
3、常见网页类型:
形象页、主页、栏目页、内页、新闻详细页等;
4、网页设计原则:
(1)了解客户需求
(2)遵循Web标准ﻫ(3)运用形式美法则
5、网页设计流程:
(1)手绘效果图:
确定网页主题内容与风格
(2)设计效果图:
搜集、整合设计所需素材
(3)版面编辑:
网页得制作与实现ﻫ(4)网页美化:
动画设计,网页测试与发布
6、网页设计得主要软件:
(1)Photoshop
(2)Dweamveawer
(3)Flash
(4)Firworks
7、HTML基础知识:
(1)HTML概念:
HyperTextMarkupLanguage超文本标识语言;ﻫ(2)HTML文档得编写方法:
用记事本手工直接编写、使用可视化HTML编辑器Dreamweaver、由Web服务器动态生成;
(3)网页文件命名:
首页文件名默认为:
index、htm或 index、html;ﻫ(4)HTML文件结构:
ﻫ<HTML>
〈HEAD>ﻫ