Dreamweaver网页设计课程实施方案
一、课程概况
《Dreamweaver网页设计》课程是计算机信息管理专业和计算机网络技术专业专科生的一门必修基础课。本课程课内学时90,其中授课36学时,实训54学时,共5学分,在一个学期内开设。
本课程的主要内容包括:利用Dreamweaver开发工具进行网页设计,包括新建、编辑和设置一个Web站点;如何对页面属性进行基本的设置,如何设置、编辑CSS层叠式样式表;如何排版文字、表格和层;如何进行基本的图像处理;建立框架;模板和库的使用和编辑;网站的发布与维护等基本知识与应用。
本课程的特点:
1.本课程部分内容实践性较强,理论应紧密结合实际,文字教材包括主教材和实训教材。其中实训内容是教学的主线,通过讲解Dreamweaver,介绍网页设计的基本方法、技术,同时结合网页设计理论。学习中一定要注意理论与实践相结合。
2.为适合远程教学和自主化学习的要求,本课程配有10讲IP课件。主要结合Dreamweaver介绍网页设计技术和技巧。
3.为达到本课程的教学目标,课程的考核采用形成性考核与终结性考核相结合的方式。
其中形成性考核要求在真实Dreamweaver环境下,完成9次实训项目。视实训完成的情况评分,占考核总成绩的50%,成绩由所在班级的任课教师给定,实训作品及实训报告上报省(市、自治区)电大认定、备案。中央广播电视大学随机进行抽查。
终结性考核采用计算机考试,题型包括选择题、填空题等,占考核总成绩的50%。试题由中央广播电视大学统一命题,考试时间限制为90分钟。以上两方面成绩均需及格,总成绩60分以上者(包括60分)考核通过。
二、课程的内容体系及教学要求
第1章Dreamweaver 8 基础知识
教学内容:
Dreamweaver 8 简介
Dreamweaver 8 工作环境
教学要求:
掌握:Dreamweaver 8工作环境
了解:Dreamweaver 8的总体了解
第2章本地站点构建
教学内容:
创建站点
构建站点结构
管理本地站点
教学要求:
熟练掌握:建立站点文件和文件夹结构
掌握:使用向导创建站点的方法、使用高级设置本地站点、管理本地站点
第3章制作简单的图文混排页面
教学内容:
设置头信息
设置页面属性
制作简单的文本页面
制作图文混排页面
制作交互图像页面
教学要求:
熟练掌握:设置整体页面属性、制作普通文字页面、在页面中放入图像,制作图文混排页面、制作鼠标经过图像的交互效果、
掌握:设置页面的头信息、制作导航条的交互效果
第4章制作多媒体页面
教学内容:
在页面中插入动画
在页面中插入音频
在页面中插入视频
在页面中插入Applet
在页面中插入滚动字幕
教学要求:
熟练掌握:在页面中插入Flash动画、在页面中插入音频、在页面中插入视频
掌握:在页面中插入Flash按钮、在页面中插入Flash文本、在页面中插入滚动字幕了解:在页面中插入Applet
第5章使用表格排版网页
教学内容:
表格的基本操作
处理表格
使用表格排版网页
教学要求:
熟练掌握:插入并设置表格、对表格进行格式化、排序表格数据、使用表格排版网页
第6章制作网站链接
教学内容:
制作基本链接
制作锚点链接
制作图像映射
教学要求:
熟练掌握:制作外部网站链接、制作内部页面链接、制作电子邮件链接、制作空链接、制作脚本链接、制作同页面或不同页面之间的锚点链接
掌握:制作图像映射
第7章制作表单页面
教学内容:
表单的概念
插入各种表单元素
教学要求:
熟练掌握:制作表单、插入各种表单元素
了解:表单的工作原理
第8章使用样式表制作高级页面
教学内容:
样式表基础
在页面中使用样式表
将样式表应用于整个网站
教学要求:
熟练掌握:文字样式的使用、背景样式的使用、为网页设置整体和局部链接效果、将样式表应用在整个网站
掌握:样式表基本概念、区块样式的使用、边框样式的使用
了解:鼠标光标样式的使用
第9章建设框架网站
教学内容:
框架的基本使用
建立嵌套框架结构
建立浮动框架页面
教学要求:
掌握:创建普通框架页面、创建嵌套框架结构页面
了解:创建浮动框架页面
第10章制作动态效果页面
教学内容:
使用层排版
使用时间轴制作动画
使用行为制作动态效果
利用层、时间轴和行为的配合
制作特效
教学要求:
熟练掌握:使用层和表格的配合进行排版、使用时间轴制作动画、制作显示层文本特效掌握:使用各种行为制作页面中的动态效果、制作显示隐藏层的特效、制作拖动层特效了解:利用层溢出属性排版、制作控制时间轴动画的特效
第11章使用模板和库制作网站
教学内容:
使用模板
使用库
教学要求:
掌握:建立、使用并更新模板
了解:在页面中使用库
第12章使用插件丰富页面效果
教学内容:
使用插件的基本方法
使用行为插件
使用命令插件
使用对象插件
教学要求:
掌握:使用行为插件、使用命令插件、使用对象插件
第13章网站维护和上传
教学内容:
测试网站
上传网站
教学要求:
掌握:网站测试的方法、网站上传的方法
三、课程的教学媒体说明
1.《网页设计与制作Macromedia Dreamweaver 8》,艺博张明真主编,高等教育出版社出版
2.IP课件,10讲,每讲50分钟,主要是对课程进行系统辅导,突出讲软件的使用和操作。
四、教学过程的组织、监督与管理
该教学安排按照一学期18周进行,每周5学时,合计课内36学时,实训54学时。
章号内容授课学时
第一章Dreamweaver 8 基础知识 2
第二章本地站点的构建 2
第三章制作简单的图文混排页面 3
第四章制作多媒体页面 3
第五章使用表格排版网页 3
第六章制作网站链接 2
第七章制作表单页面 3
第八章使用样式表制作高级页面 3
第九章建设框架网站 3
第十章制作动态效果页面 3
第十一章使用模板和库制作网站 3
第十二章使用插件丰富页面效果 3
第十三章网站维护和上传 3
总计36
(实训分为必做和选做内容,可根据实际的实验条件选做。实训总计54学时)
必做实训题
实训1基本网页设计
【内容】
建立网站与设置网页的方法
【要求】
1.掌握建立一个网站的方法
2.建立首页和相应页面
实训2利用表格进行网页排版
【内容】
1.利用表格规划网页布局的方法
2.表格的嵌套
【要求】
1.掌握利用表格进行网页排版
2.掌握设置标题
3.掌握建立广告条
4.掌握设立栏目
5.掌握插入图片以及文字内容
6.掌握建立版权信息部分
实训3使用页面布局模式
【内容】
1.页面布局
2.排版的方法
【要求】
1.掌握使用页面布局模式设计表格
2.掌握网页排版
3.掌握区别页面布局模式与直接使用表格
实训4对网页进行排版应用CSS样式表【内容】
应用样式表CSS进行排版
【要求】
1.掌握应用CSS样式表对网页进行排版的方法
2.掌握设置版面为文字的字体、字号和颜色
3.掌握设置链接正常状态、已访问过状态、移入状态时的不同颜色
实训5在网页中应用模板
【内容】
模版的使用
【要求】
1.掌握在网页中应用模版的方法
2.掌握将当前设计好的页面转换为模板
3.掌握设置可编辑区域
4.掌握使用模板生成多个页面
实训6在网页中应用库
【内容】
1.网页中建立库
2.插入库
3.更新库
【要求】
1.掌握在网页中应用库的方法
2.掌握选择内容转换为库
3.掌握将库内容插入多个文档
4.掌握修改库更新多个文档
实训7在网页中插入导航条和翻转按钮
【内容】
1.插入导航条
2.建立翻转按钮
【要求】
1.掌握在网页中插入导航条的方法
2.掌握制作导航条的翻转按钮图片
3.掌握生成可翻转的导航按钮
实训8插入Flash及多媒体内容
【内容】
在网页中使用多媒体素材(视频、音频、动画等)【要求】
1.掌握插入Flash按钮
2.掌握页面布局Flash文字
3.掌握插入FlashPaper
4.掌握插入Flash视频
5.掌握使Flash背影在网页中透明
实训9使用层进行网页的排版和布局
【内容】
1.使用层进行网页排版
2.使用层进行网页布局
【要求】
1.掌握使用层来定位版面
2.掌握在层中加入图片
3.掌握在层中加入文字
4.掌握在层中加入动画
5.掌握使用时间轴移动层并形成动画
选做实训题
实训1:插入Flash及多媒体内容
实训2:自行设计和制作个人网站
实训3:自行设计和制作商业网站
《网页制作》教学设计 法、说学法、说教学过程、说板书设计。 一、说教材: (一)教材分析:本节内容是省编《信息技术》全一册第六章 网络与INTERNET基础知识第五节的内容(2000年版为第八章第四节内容,2001、2002版教材第六章第五节内容)。虽然在这一节内容在新版教材变更为拓展模块,但针对现在网络快速发展,广大的学生接触,使用INTERNET的机会也大大增加,学生在使用网络获取信息时,更多的是通过浏览网页这一方式,我认为上好这节课是非常必要的,这对学生进一步认识、使用INTERNET更有益处,同时通过网页制作这一过程也利于学生对计算机常用素材的类型有更深入的了解,在一定程度上也起着培养学生运用综合知识能力作用,所以我认为这节课是非常值得我们去研究上好的,考虑这节课的内容及教法、学法的需要,我把这节分为两课时,第一时:学生自学,自练Word制作网页的基本方法;第二课:让学生自己构思创意一个内容丰富,页面美观的网页。 (二)教学目标:根据对教材的分析及学生实际情况,制定如 下的教学目标: (1)知识目标:1、有关网页文件的说明 2、熟悉用Word制作网页的基本方法 3、超级链接是网页实现互相链接的基本方法 (2)能力目标:1、培养学生的自学能力 2、创意构思能力 3、能制作出具有多重链接、多种素材、内容 丰富的网页。 (3)情感目标:1、教育学生正确认识和理解信息技术相关文 化,伦理和社会问题,负责地使用信息技术。 (三)教学的重、难点:根据对教材的分析及网页制作过程中的 实际情况,我认为要出制作内容丰富的网页,关键是要知 道网页间互相链接的方法,所以我把超级链接做为本节的
网页设计与制作实例教程 习题答案 第1章网页与网站基础 一、选择题 1.A 2.B 3.C 4.C 5.A 二、判断题 1.√2.×3.√4.×5.√ 三、问答题 略 第2章网页规划设计 一、选择题 1.D 2.A 3.C 4.A 5.C 二、判断题 1.×2.×3.×4.√5.√ 三、问答题 1.答:网站需求分析一般包括三个阶段的内容:网站背景分析、总体需求分析、具体需求分析。(每个阶段可再详细描述。) 2.答:可从以下几个方面来阐述网站设计的原则:①日期、时间和数字;②欢迎词; ③弹出窗口和引导页面;④新闻和公告信息;⑤网址;⑥控件;⑦链接;⑧主页内容 3.答:打开新浪网首页,分析其布局类型。(答案略) 4.答:网页色彩搭配方法可从以下两个方面去阐述:①根据页面风格以及产品本身的诉求确定主色;②根据主色确定配色。 网页色彩搭配技巧可从以下几个方面去阐述:①用一种色彩;②用两种色彩;③用一个色系;④用黑色和一种色彩以及色彩搭配忌讳的方面。 5.答:打开当当网,具体分析其规划过程。(答案略) 第3章初识网页制作软件 一、选择题 1.C 2.C 3.B
二、填空题 1.代码、拆分、设计2.文件、资源、规则3.超级链接 三、操作题 略 第4章制作网页内容 一、选择题 1.D 2.B 3.A 4.D 5.ABD 6.D 7.B 8.D 9.A 10.A 二、判断题 1.√2.√3.×4.√5.√6.√7.√8.√9.×10.√三、操作题 略 第5章设置网页超级链接 一、选择题 1.D 2.D 3.A 4.D 5. C 二、判断题 1.×2.×3.×4.√5.× 第6章使用CSS样式美化网页 一、选择题 1.B 2.C 3.C 4.B 5.A 6.D 7.D 8.D 9.B 10.C 11.A 12.A 13.C 14.D 15.D 16.A 17.A 18.B 19.D 20.D 二、简答题 1.×2.×3.×4.×5.×6.×7.√8.×9.√10.√11.×12.×13.×14.√15.√16.√ 第7章规划布局网页 一、选择题 1.B 2.A 3.B 4.B 5.D 二、简答题
一体化课程教案(首页) 课程网页制作授课教师 课题(项目) 名称 创意型网站开发审批 学习任务创意型网站开发授课课时16 授课日期年月日至年月日授课班级13电商高中 项目(任务)描述小李刚刚通过应聘进入了一家网页制作公司,公司规模不大,主要业务是承接各类网站的制作。现在公司刚接了四个不同的制作网站业务,由于公司人数不多,所以小李要独立负责其中一个网站的建设,由于时间紧迫,现要求小李选择其中一个网站,并和策划部进行快速沟通和需求分析,完成资料的整理和素材的简单加工,设计出基本框架,再通过网页编辑工具完成网页版面的制作和内容元素的编辑,最后通过公司服务器发布网站到互联网上。 教学目标通过完成本次任务,学生能够 ●通过多方调研明确客户需求,撰写需求确认分析说明书; ●通过组内讨论,做好网站开发详细计划,撰写项目工作计划表; ●通过小组分工合作,自主探究学习,设计有特色的网站; ●通过测试,发现存在问题并提出解决方案; ●能够展示小组作品的优势和特色,并能客观评价他人; ●通过基于工作情境的角色扮演,熟悉网站开发的工作流程,并从中获得沟通表达, 解决问题的经验,体验团队合作和信息共享的乐趣。 教学重点 分析客户需求;设计网站规划书;创建网站站点;设计网页版面布局;素材编辑和修辞; 内容页制作和超链接。 教学难点使用Dreamweaver进行网页布局;内容页制作;页面间的超链接。 学情分析根据客户需求,开发一个商务网站,进行宣传推广商品。该网站以信息发布、产品介绍、在线销售、顾客服务、提升品牌形象为主要功能和目的。学生在学习任务中首先要进行客户需求分析,制定网站设计书,并进行创建站点和管理站点,然后在已创建的站点上进行主页、内页设计完善网站功能,并使用多种工具进行网页美工,最后发布和管理已建好的网站,根据公司的要求,更新和维护网站。 教学策略本次教学任务在电商实验班进行授课,采用任务驱动,模块演示的教学方法;以学生为
Dreamweaver 8 基础代码 HTML基本结构(每个网页都是在基本结构的基础上添加内容的) -------- 网页文件开始标签
------- 头部元素开始标签一、网站的总体规划 1.确定整体风格 风格因人而异,不同的人对同一主题设计的网站风格都不一样。一些要点:(1)网站的标志应该放在醒目位置并保持不变,一般放置在网页的左上角(2)导航条应该放在每张网页的相同位置,便于浏览 (3)确定网站的主体颜色,并注意颜色搭配,要让人感觉舒服 (4)页面布局要规划好,一般采用上边导航条,下边内容或左边导航条右边内容的方式,或两者结合 2.网页颜色搭配 各种颜色给人的感觉不同。 3.绘制设计草图 二、网页的制作 1.建立站点 点击“站点”- “新建站点”,输入名字“我的主页”,单击“下一步”,选择“否,。。。”,单击“下一步”,设置存放位置,D盘MYWEB目录,单击“下一步”,选择“无”,“下一步”,设置完成。 在站点“我的主页”上右击,建立三个文件夹“images,flash,web”,分别存放图片、动画和网页文件。再建立首页文件“index.htm”。 2.首页的设计 (1)将标题设为“小小的家”,点击“插入”-“表格”,插入一个4行2列,宽760像素,其他为0的表格。 在属性面板中设置表格属性,高200,居中对齐,背景白色。
选中行列的方法:(1)鼠标左键拖动;(2)Ctrl+左击;(3)可视化助理 (2)合并单元格 选中第二行的两个单元格,右击,“表格”-“合并单元格”, 选中第四行的两个单元格,点击“修改”-“表格”-“合并单元格” (3)表格的嵌套 选中第三行第二列的单元格,点击“插入”-“表格”,插入一个2行1列,宽度80%,边框粗细0的表格。 回到原单元格,属性面板中设置水平居中、垂直居中。 (4)页面属性设置 点击“修改”-“页面属性”,设置字体“默认”,大小“14像素”,文本“黑色”,背景“灰色”,左右上下边距“0”。 (5)表格第一行第一列:属性宽140,高140,插入logo.jpg 第一行第二列:宽620,插入ban.swf 第二行:高30,背景色“#FF0000”,文本颜色“白色”,输入“首页个人简介动画作品我的相册学习心得写信给我” 大小22像素居中对齐 第三行第一列:背景色#0067C3,高度600 第三行第二列:在其第一行的单元格中,设置高度“400”,输入“有朋自远方来不亦乐乎!”,字体“魏碑”,字号“60”,颜色“蓝色”,字体居中排列,并用shift+enter键控制间距。 在第二行的单元格中,设置高度“50”,输入“欢迎参观”,颜色“淡红”,居中排,字号“25”。 第四行:背景色“黑色”,文本颜色“白色”,输入“更新日期:”,点击“插入”-“日期”,再输入“Copyright ”,点击“插入”-“HTML”-“特殊字符”-“版权”,输入“2012 小小版权所有”。 (6)建立超级链接 在WEB目录下建立jianjie.htm,xiangche.htm,xuexi.htm,donghua.htm四个文件把个人简介等文字与对应的文件链接起来。 三种链接方法:直接输入web/jianjie.htm;打开文件夹方式;鼠标指向文件;把“欢迎参观”链接到jianjie.htm 查看效果,注意要使用相对路径 去掉文字下的下划线(利用CSS样式): 点击“窗口”-“CSS样式”,在右边的CSS样式窗口中选择“新建CSS规则”,选择器类型“高级”,选择器“a”,“仅对本文档”,点击确定。在弹出的属性窗口中,将“修饰”的无选项前面打勾。 如果还想改链接的颜色,可以“新建CSS规则”,名称为 a:active 表示选中状态a:hover 表示光标放上时 a:link 正常状态a:visited 访问过的状态 例如:设置a:hover,将“修饰”的无选项前面打勾,颜色“#00ff00”,再查看一下效果。 建立外部链接:选中“写信给我”,属性面板中链接输入mailto:ggg@https://www.doczj.com/doc/c26388349.html,
DW网页设计常用代码 普通卷动 滑动 预设卷动 来回卷动 向下卷动 向上卷动 向右卷动 向左卷动 卷动次数 设定宽度 设定高度 设定背景颜色 设定卷动距离 设定卷动时间 字体效果
《HTML5+CSS3网站设计基础教程》课程教学大纲 (课程英文名称) 课程编号:201601210011 学分:5学分 学时:76学时(其中:讲课学时:47 一、课程的性质与目标 《HTML5+CSS3网站设计基础教程》是面向计算机相关专业的一门专业基础课,涉及网页基础、HTML标记、CSS样式、网页布局、变形与动画等内容,通过本课程的学习,学生能够了解网页web发展历史及其未来方向,熟悉网页设计流程、掌握网络中常见的网页布局效果及变形和动画效果,学会制作各种企业、门户、电商类网站。
二、课程设计理念与思路 课程设计理念:高职教育的集中实践教学环节需明确必要的理论知识的生化与知识层面的拓展,不能局限 于单纯的技能训练。单纯的技能训练不是提高高等职业教育的理想课程。以能力的培养为重点,以就业为导向,培养学生具备职业岗位所需的职业能力,职业生涯发展所需的能力和终身学习的能力,实现一站式教学理念。 课程设计思路:基于工作过程开发课程内容,以行动为导向进行教学内容设计,以学生为主体,以案例 (项目)实训为手段,设计除理论学习与技能掌握相融合的课程内容体系。教学整体设计“以职业技能培养为 目标,以案例(项目)任务实现为载体、理论学习与时间操作相结合”。 开发工具:DreamweaverCS6 第一章初识HTML5
第二章HTML5页面元素及属性
第四章CSS3选择器
e g o o d f o 背景与图片不透明度的设置 √ 设置背景图像平铺√ 设置背景图像的位置√ 设置背景图像固定√设置背景图像的大小√设置背景的显示区域√设置背景图像的裁剪区域√设置多重背景图像√背景复合属性√线性渐变√径向渐变√重复渐变 √ 第七章表单的应用
网页制作基础教程 一、什么是HTML HTML(超文本标记语言)是网页中使用的语言,他能被网页浏览器(IE或Netscape)解释,从而显示出丰富多彩的信息(图片、文字、声音、影象、动画等)。 制作网页前首先要弄懂什么是HTML。 在IE中点击"查看"→"源文档",就能看到该网页的HTML代码。下面是个网页文档(model.htm)的HTML代码:
《Dreamweaver网页设计》综合练习题(二)及解答一、选择填空题(每空2分,共20分) 1.HTML 2.URL 3.ICP 4.SGML 5.CSS (_____)网络内容服务商 (_____)网络内容服务商 (_____)标准通用标记语言 (_____)统一资源定位符 (_____)超文本标识语言 答案: (___3_)网络内容服务商 (__5_)网络内容服务商 (__4_)标准通用标记语言 (___2__)统一资源定位符 (___1_)超文本标识语言 1.标签
A.文字 B.图像 C.层 D.动画 6.要将左图所示的表格修改为右图所示的状态,不能执行的操作是()。 左图右图 A.选中整个表格,在属性面板中将表格的行数从1改为2 B.依次将左右单元格拆分为两行 C.将光标放在表格中的任意位置,执行命令“修改/表格/插入行或列”,在弹 出的对话框中选择插入行,行数为1,位置为“所选之下” D.将光标放在表格中的任意位置,执行命令“修改/表格/插入行” 7.在HTML语言中,
表示()。 A.设置颜色为红色 B.设置访问过颜色为红色 C.设置活动颜色为红色 D.设置鼠标上滚颜色为红色 8.关于在Dreamweaver中插入Flash文本,说法错误的是()。 A.可以设置Flash文本的动态效果,如淡入淡出等 B.通过插入Flash文本,用户可以直接创建一个Flash文本对象的动画 C.可以设置Flash文本的字体、字号、文本颜色、鼠标转滚颜色等属性 D.可以为Flash文本设置 9.如果要使用CSS将文本样式定义为粗体,需要设置()文本属性。 A.font-family B. font-style C. font-weight D. font-size 10.为定义目标窗口时,_blank表示的是()。《网页制作》教学设计(优质课比赛优秀设计)《网页制作》教学设计 一、教材或教学内容分析 本章内容在本教材中的位置处于第五章,是在文字处理(Word2000)和网络基础及因特网应用两章之后。学生所学的文字处理软件Word和将要学习的网页制作软件Frontpage同是Microsoft公司的产品,在软件的使用上有很多的共通之处,所以在学习frontpage的时候,很多内容可以让学生自学,而不必面面俱到地在课上讲授。而第四章网络基础及因特网的应用又为学生对网页的理解奠定了基础,学生对网页中的基本元素——文字、图片、动画、声音等都有所了解,而网页的制作就是将这些元素重新组合到网页上,学生要学的就是这种组合的方法。所以说,虽然大多数学生以前都未接触过网页的制作,但有了以上这些基础,学起来就轻松多了。 本章内容按照学生已有的基础,我对教学内容分了一下类,也为教学的组织工作打下一点基础。本章内容主要由网页基础知识、网站的建立和管理、网页的制作、创建超链接、图片的处理、网页框架。 重点是网页的制作和创建超链接,学会了这些就可以开始简单的网页制作了。 难点是网页框架,这部分相互之间关系比较复杂,必要时,老师在对各组个别辅导时,可以给予分别讲解。 这个分类可以为组长安排各个组员的任务提供参考,使分工更加合理。 二、教学对象的分析 第 1 页共 6 页 信息技术课虽然已经成为初中的必修科目,但是城乡学生之间掌握情况的差异却相当大,条件好一点的初中学生不仅已经熟练掌握了课本上的内容,还对一些常
用软件有所了解;而差一点的可以说是从高中开始才正式接触到信息技术知识的学习,他们需要多锻炼、多指导,所以协作学习对学生的学习帮助很大。 三、教学策略的选择及媒体的使用 在教学策略的选择上,我使用的是任务驱动和协作学习相结合的方法。 任务驱动就是要求本章内容学习完之后,每个小组都要完成自己班级网站的制作,并在全班进行评比,选择最好的作为班级主页挂到学校主页上去,这有助于激发学生参与学习的积极性。 协作学习则是让学生在学习过程中互帮互助,用较短的时间、教少的精力学到更多的东西,完成一个集体项目,让他们在学习之后获得成就感。因此在媒体的选择上,我们使用的是TOP2000系统。TOP2000系统有利于教师进行分组教学和学生作品的点评及成果的展示。教学过程开始之前,教师把学生按座位分成四组,每个组都按学生对计算机的掌握程度平均分配,保证每个组都有计算机操作方面比较突出的,也有相对比较差的,使其形成能够互帮互助的学习小组。并由他们自己选出组长各一名,然后由组长根据组员的情况,确定在班级主页制作过程中主要完成什么任务,也就是说起到一个组织者的作用。做过网页的人都知道,做网页是一项比较费时的工作,而要学生在较短的时间内制作出像样的网页是比较困难的,而在这个过程中,网页的设计占去了相当多的一部分时间,组长把任务分到各组员头上以后,组员就可根据自己要完成的任务相对集中的做某方面的工作,做完以后,组员之间进行经验交流,告诉组员自己的网页是如何制作出来的,在完成自己的网页后,再重复一遍制作过程花费的时间的不多的。这样,其他组员就可在较短的时间之内 第 2 页共 6 页 掌握比较先进的网页制作方法,而不必再花那么多时间去探索。因为每位组员都必
认识Dreamweaver 一、学习目的 了解Dreamweaver,学会利用Dreamweaver制作网页。 二、学习内容 Dreamweaver的基本知识。 【学习步骤】 1、Dreamweaver的功能 Dreamweaver可以像普通的字处理软件一样编辑Internet上以HTML格式保存的所有文件, 也就是网页;它支持动态HTML,可以在网页中产生动画;还可以在网页中插入各种插件,以产生特殊效果。 Dreamweaver可用于管理站点,它像文件夹一样创建和打开站点,用不同的方式查看站点中各个网页之间的关系,调整站点的组织结构,使整个站点条理清晰。 2、Dreamweaver的窗口 (1)标题栏 (2)菜单栏 (3)工具栏 (4)视图栏 (5)文件夹列表 (6)工作区 3.网页工作区的三个视图方式选项 它们分别是“普通”、“HTML”“预览”,它们之间的相互切换十分容易实现的。 普通视图方式是Dreamweaver对网页所见即所得编辑方式的最佳体现,在此方式下,可以 像在Word中那样直接进行各种编辑操作,实现网页编辑的所有功能。
HTML视图实际上是一个文本编辑器,其中给出了普通视图方式下所件网页的HTML代码。在这里可以用菜单命令进行复制、粘贴、删除、查找等操作。对于HTML语言中的不同成分均用不同的颜色显示,这样比较容易区分各种语法成分。 为了在制作网页过程中能够随时查看网页的实际效果,Dreamweaver提供了预览视图方式。 4.安装dreameaver的方法 安装及注册 5.关闭dreameaver 6.保存网页的方法 三、小结 Dreamweaver的基本知识
正如你现在所看到的一样,网页的布局设计变得越来越重要。访问者不愿意再看到只注重内容的站点。虽然内容很重要,但只有当网页布局和网页内容成功接合时,这种网页或者说站点才是受人喜欢的。取任何一面你都无法留住太过“挑剔”的访问者。 一.网页布局的基本概念 最开始,网页呈现在你面前的时侯,它就好像一张白纸,它需要你任意挥洒你的设计才思。在开始的时侯,你需要明白,虽然你能控制一切你所能控制的东西,但假如你知道什么是一种约定俗成的标准或者说大多数访问者的浏览习惯,那么你可以在此基础上加上自己的东西。你当然也可以创造出自己的设计方案,但如果你是初学者,那么最好明白网页布局的基本概念。 1.页面尺寸: 由于页面尺寸和显示器大小及分辨率有关系,网页的局限性就在于你无法突破显示器的范围,而且因为浏览器也将占去不少空间,留下给你的页面范围变得越来越小。一般分辨率在800x600的情况下,页面的显示尺寸为:780x428个象素;分辨率在640x480的情况下,页面的显示尺寸为:620X311个象素;分辨率在1024X768的情况下,页面的显示尺寸为:1007x600。从以上数据可以看出,分辨率越高页面尺寸越大。 浏览器的工具栏也是影响页面尺寸的原因。一般目前的浏览器的工具栏都可以取消或者增加,那么当你显示全部的工具栏时,和关闭全部工具栏时,页面的尺寸是不一样的。 在网页设计过程中,向下拖动页面是惟一给网页增加更多内容(尺寸)的方法。但我想提醒大家除非你能肯定站点的内容能吸引大家拖动,否则不要让访问者拖动页面超过三屏。如果需要在同一页面显示超过三屏的内容,那么你最好能在上面做上页面内部连接,方便访问者浏览。 2.整体造型: 什么是造型,造型就是创造出来的物体形象。这里是指页面的整体形象,这种形象应该是一个整体,图形与文本的接合应该是层叠有序。虽然,显示器和浏览器都是矩形,但对于页面的造型,你可以充分运用自然界中的其它形状以及它们的组合:矩形,圆形,三角形,菱形等。 对于不同的形状,它们所代表的意义是不同的。比如矩形代表着正式,规则,你注意到很多ICP和政府网页都是以矩形为整体造型;圆形带表着柔和,团结,温暖,安全等,许多时尚站点喜欢以圆形为页面整体造型;三角形代表着力量,权威,牢固,侵略等,许多大型的商业站点为显示它的权威性常以三角形为页面整体造型;菱形代表着平衡,协调,公平,一些交友站点常运用菱形作为页面整体造型。虽然不同形状带表着不同意义,但目前的网页制作多数是接合多个图形加以设计,在这其中某种图形的构图比例可能占的多一些。
《网页设计与制作》课程教案 一、课程定位 本课程是计算机应用技术专业的一门专业基础课程,该课程的学习能够提升他们对网页制作的兴趣,让他们学习网页制作的基本技能,为后继课程打下基础,同时扩展其就业面,为就业做好准备。 本课程的目的和任务是让学生学会Dreameaver CS6、Flash和Fireworks 的使用方法,并能够使用这3款软件制作出美观实用的网页。 二、课程总目标 掌握网页制作的基本方法和技能,掌握网站建设的流程,能够运用所学知识建设常用的网页和网站,同时能够美化网页,设计人性化、艺术化的网站静态页面部分。 (一)知识目标: 1.熟悉网页制作的基本元素; 2.掌握Dreamweaver CS6软件的基本操作方法; 3.掌握在网页中插入文字、图片、声音、flash等的方法; 4.掌握常见的网页布局方法,学会使用CSS美化网页; 5.掌握在网页中使用表单和制作网页特效的方法; 6.掌握简单图形图像的处理,能够制作符合网页主题的图片和简单动画 并巧妙地和网页中内容搭配起来。 7.掌握建设一个功能相对完善的网站的方法并能制作常用的网站的静 态页面部分。 (二)职业能力培养目标 1. 能够根据网站开发需求,去寻找网页设计和网站开发所需要的文字、 图片、动画、声音、视频等素材并作美化处理; 2.能够制作出符合主题色彩的网页,网页要求美化、被绝大多数浏览 者接受和喜爱;
3.能够设计企业网站、政府门户网站、学校网站等常见网站的基本静态 页面。 (三)素质目标 1.具有勤奋学习的态度,严谨求实、创新的学习精神; 2.具有良好的心理素质和职业道德素质; 3.具有高度责任心和良好的团队合作精神; 4.具有运用理论知识发现问题、分析问题并解决问题的能力,同时能够 不断学习,不断创新,让自己的设计越来越完善,有止于至善的精神。(四)职业技能证书考核要求: 可以根据自身情况考取“全国计算机信息高新技术资格证”,“网页设计制作员”,“网页设计师”等职业技能证书。 三、重点、难点章节及内容 1.重点章节: 1.2 网页、网站相关术语简介 1.6 网站建设的基本流程 2.3 Dreamweaver CS6的工作环境 3.2 创建本地站点 3.4 使用站点 3.5 网页设计中的规范 4.1 网页文件的基本操作 4.3 插入文本 4.4 插入水平线 4.5 插入其他基本元素 4.6 创建列表 5.1 超级链接概述 5.2 创建超级链接 5.3 使用dw制作各种超级链接
Dreamweaver学习网站制作 设计说明书 系部:信息工程系 学生姓名:石婷婷 专业班级:网络08D1 学号: 083422106 指导教师:密海英 2010年10月25日
目录 内容摘要 (1) 一、引言 (1) 1、Dreamweaver发展前景与现状 (1) 2、Dreamweaver专题学习网站的内容和意义 (2) 二、开发工具的介绍 (2) 三、网站的具体规划 (3) 1、网站的功能结构 (3) 2、网站的主题思想 (3) 3、网站LOGO设计 (3) 4、网站布局设计 (4) 5、网站的内容 (4) 四、页面设计过程 (4) 1、一级导航页面设计 (4) 2、二级导航页面设计 (6) 3、三级导航页面设计 (8) 五、总结 (9) 致谢 (10) 参考文献 (11)
Dreamweaver学习网站的设计与开发 内容摘要 本课题通过对Dreamweaver学习网站的制作,为使用者提供一个自主学习、测试的Dreamweaver的平台。网站采用了清新自然的绿色为主色调,颜色明快柔和,界面美观简洁。清新的绿色让学习者产生视觉上的放松。本网站文本简明、通俗易懂,整体结构清晰、统一,便于学习。网站资源丰富、层次清楚、内容严谨。页面多处插入了flash,使得页面更加生动、活泼,富有感染力。网站导航清晰,布局简单却不单调,让学习者能够一目了然,方便快捷。 本网站采用了实例教学的手法,使得学习者能够更加直观地去学习。此外,还增加了在线测试的功能,打破了以往只能够“教”而不能够“测”的网站,这样才能使学习者更加直接地了解自己的学习情况,从而提高自己的学习能力 一、引言 (一)Dreamweaver的发展前景与现状 Dreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见