Dreamweaver网页设计【荐】.docVIP

江西先锋软件职业技术学院 教 案 院、部： 软件工程学院 教研室： 计算机应用 姓 名： 易刚 职 称： 助教 课程名称： Dreamweaver网页设计 授课专业： 计算机通信 学生人数： 授课时间： 至 学年度 学期 教材名称 编者 出版单位： 出版时间 第一章第一节《网页制作基础知识》 教学目的和目标 1、了解网页的概念。 2、了解网页的基本构成元素。 3、掌握网页的设计构思。 4、掌握网页的布局。 教学重点与难点 1、掌握网页的设计构思。 2、掌握网页的布局。 教学方法和手段 1、以课堂问答法和案例讨论法为主，以讲授法和指导法为辅。 2、使用先锋电子教室多媒体手段进行教学。 教学过程及详细内容 1﹑网页的概念 通常的网页，都是以htm或html后缀结尾的文件，俗称HTML文件。 一个HTML网页文件包含了许多HTML标记符，这些标记符是一些嵌入式命令。 2﹑网页的基本构成元素 下面介绍网页的基本构成元素： 文字与图片 动画与视频影像 声音文件 超级链接 网页的程序 表单 插件 3﹑网页的设计构思 在网页的设计构思中，需要认真考虑的问题有： 网页的主题 网页的命名 网站标示(LOGO) 色彩搭配 字体 默认的网页字体一般是宋体。 4﹑网页的布局 在网页布局过程中，应该遵循的原则有：对称平衡﹑异常平衡﹑对比﹑凝视和空白等。 下面有五种常见的结构： 型结构布局 所谓这种结构指页面顶部为“网站标志+广告条+主菜单“，下方左面和右面为链接，广告或其他一些内容，下方的中间部分是主题内容的布局，其整体效果类似于符号。 T型布局 它指的是页面的顶部是“网站标志+广告条”，左面是主菜单，右面是主要内容。 ”三”型布局 特点是在页面上由横向两条色块，将页面整体分割为3部分，色块中大多放广告条与更新和版权提示。 POP布局 POP引自广告术语，是指页面布局像一张宣传海报，以一张精美图片作为页面的设计中心。 Flash布局 这种布局是指整个网页就是一个Flash动画，它本身就是动态的，画面一般比较绚丽，有趣，是一种比较新潮的布局方式。 布置课后任务及作业 安装网页三剑客 欣赏国内外网页 第一章第二节《Dreamweaver MX 2004使用基础》 第三节《一个简单的网页实例》 教学目的和目标： 1、了解Dreamweaver MX 2004的用户界面。 2、掌握网页创建的方法。 3、掌握简单网页的制作。 教学重点与难点： 1、掌握网页创建的方法。 2、掌握简单网页的制作。 教学方法和手段： 1、以课堂问答法和案例讨论法为主，以讲授法和指导法为辅。 2、使用先锋电子教室多媒体手段进行教学。 教学过程及详细内容： 1﹑Dreamweaver MX 2004的功能 Dreamweaver MX 2004以下功能： 完美的操作界面 强大的模板功能 创建动态网页 强大的代码编辑功能 完备的建站向导和网产管理 2﹑Dreamweaver MX 2004的用户界面 Dreamweaver MX 2004的工作区 文档编辑窗口 工具栏﹑状态栏﹑上下文菜单栏 插入工具栏﹑属性检查器﹑面板组 学生熟悉Dreamweaver MX 2004的用户界面，才能更好进行操作。 3﹑一个简单的网页实例 例：使用Dreamweaver MX 2004在C盘根目录创建网页为”我的第一个网页” 网页实例 学生动手制作网页实例，更好掌握网页的创建方法。 4﹑课堂练习与讲解 学生独立完成课本上P18习题。 把课后习题每一道题目详细讲解，扩充知识点内容。 布置课后任务及作业： 预习第二章设计和规划站点 第二章第一节《网站建设的基本流程》 第二节《站点的整体规划》 教学目的和目标： 1、掌握网站设计总规划。 2、了解网站建设的基本流程。 3、了解站点的整体规划。 教学重点与难点： 1、掌握网站设计总规划。。 2、掌握颜色搭配。 教学方法和手段 1、以课堂问答法和案例讨论法为主，以讲授法和指导法为辅。 2、使用先锋电子教室多媒体手段进行教学。 教学过程及详细内容： 1﹑网站设计总规划 设计网站时最重要的三大部分：整体风格﹑色彩搭配和创意设计。 确定网站的整体风格 网站的整体风格就是指站点的