Flash教案
第一章入门
一、概述
1、定义:二维矢量动画软件，用于设计和编辑Flash文档。
2、适用范围:
3、特点:
a 矢量动画制作模式，文件容量小
b 支持多类型文件导入（图片、视频、音频）
c 支持流媒体技术
d 交互动画（人为参与动画制作）
4、网页四剑客简介（主要针对四种软件的互补性及开发网站的功能性进行介绍）
dw：是一个网页拍板软件，不是设计软件，唯一体现设计软件的地方是css样式
fw：图片处理以及网页制作软件，可以轻松制作透明背景的gif动画，有强大的滤镜扩展功能；在图片处理上，对网络传输的图片可以轻松处理，但是对于平面处理
图片要逊色。
fl：矢量动画制作软件，可以制作网站首页等内容；强大的脚本支持，适用于游戏的开发等
5、脚本简介（主要说明action的作用与asp简介）
ac：fl中内嵌的脚本语言，提供方便的语句设置，开发互动性动画及游戏的最佳语言；
ac简单易学，语法容易（有c语言基础为佳）
asp：动态网页开发程序，适合各种动态网页，如：产品展示系统、bbs、以及登陆系统的制作
6、剑客与闪客（以如何经营一家网络公司为例，结合软件、硬件及程序集中介绍我们的
科目）
前台设计人员、后台程序人员、服务器管理人员（只针对技术层面）
7、版本（说明各版本的特点，特别要说明7.0和8.0在操作上是没有区别的）
二、基本概念
1、位图：由像素点组成的图形
*.jpeg：支持颜色多，放大失真，存储容量大
*.gif：支持256色，不支持颜色过渡，透明背景，存储容量小
*.png：将上述文件的特点融合在一起，并且没有版权的争议
2、矢量图：由带颜色的点或线组成的图形，以数学公式进行表达
放大缩小不失真，支持颜色少，容量小。
3、动画：
注：特点介绍详细，要有演示。
三、安装和进入
找到setup.exe或者是install.exe双击，点击下一步即可
注意安装序列号的问题sn.txt或keygen.exe
四、基本操作
1、界面介绍
2、基本菜单介绍
3、快捷键
工具栏：ctrl+f2 属性：ctrl+f3 混色器：shift+f9
库：f11 动作：f9 对齐：ctrl+k
变形：ctrl+t 导入：ctrl+r 打开外部库：ctrl+shift+o 预览：ctrl+enter 发布设置：ctrl+shift+f12 发布：shift+f12
导出：ctrl+shift+alt+s
注：每一个快捷键要配合演示
第二章工具
注：所有工具都要强调快捷键
一、工具
1、选择工具
选取移动物体（精确移动物体：箭头-〉移动十个像素：shift+箭头）
克隆：ctrl+d 原位粘贴：ctrl+shift+v 拖动复制：alt+（shift）+拖动
选项：自动吸附（磁铁）自动平滑自动拉伸
2、任意变形工具
shift（等比例缩放）和alt（以中心点缩放）配合使用
选项：缩放封套扭曲反转倾斜
3、填充变形工具
对于单色无法使用，只能应用于渐变颜色和位图填充（演示）
4、直线工具
配合shift画水平、垂直及45度角直线；选中直线后的属性设置（包括粗细以及样式等）5、套索工具
用于选中不规则物体
选项：多边形套索魔术棒工具（只能应用于打散的位图）魔术棒属性（设置魔术棒样式以及阀值）
6、文字工具
分类：静态、动态、输入（说明三者区别，指出在ac中会介绍输入与动态文字）
文字属性设置：文字的字体、样式、大小、字符间距、文本输入方向等
文字连接：连接分类（内部、外部）及演示目标滤镜的应用
7、圆形和矩形工具
配合shift和alt键使用
多角星形工具：绘制多边形和五角星形（注意星形顶点大小的设置）
8、铅笔工具
用于绘制硬线（配合shift）
选项：伸直平滑墨水
9、刷子工具
用于绘制软线
选项：标准绘画颜料填充后面绘画颜料选择内部绘画
10、墨水瓶
用于给图像描绘边缘（属性设置）
11、油漆桶
填充颜色
普通填充先选择，再进行拖动填充位图填充12、滴管工具
用于吸附填充或者是边框的样式与颜色
13、橡皮工具
擦除物体
选项：与刷子工具相似水龙头工具
14、手型工具
临时快捷键为空格双击显示整个画布
15、放大缩小工具
放大：空格+crtl 缩小：空格+alt（shift）+ctrl
16、边框及填充：略
17、钢笔与部分选取工具
创建节点删除节点
节点分类：拐角点、贝兹点、平滑点、贝兹拐角点
节点转换：alt+鼠标拖动
二、实例
1、立方体
2、圆柱
3、标志（山木培训或者是李宁）
第三章编辑对象
一、概述
1、定义：编辑区内的任何物体都叫作编辑对象
2、分类：
原型：用基本绘制图形工具画的对象叫原型（打散 ctrl+b）
绘制对象：绘图前选中绘制对象工具，做绘制的图形叫绘制对象（选项中的绘制对象按钮）
组合对象：群组之后的物体，或是文字工具创建的对象（ctrl+g）
元件：存放在库中，可以重复使用的对象（f8：选中对象转换为元件；ctrl+f8新建元件）
二、特点：
1、原型：选中后又灰色的小点；用选择工具可以直接改变形态；可切割；没有前后叠
加顺序
2、绘制对象：属性介于原型与组合对象之间
3、组合对象：选中后出现蓝色边框；不可以任意变形；不可切割，有先后顺序
4、元件：选中以后有注册点；一变全变；实例化对象可以进行替换；特殊属性；多次
使用不占用空间
注:对象名称
元件名称（见名知意）
变量名称（程序调用）
实例名称（程序调用）
三、实例（3-5个）鞭炮、酒精、立体文字等
第四章时间抽
一、图层：用于安排与控制时间播放
图层的基本操作（新建、删除、图层属性设置）
注：此处用到的快捷键主要是alt键；解释为什么要让物体以轮廓显示
分类：普通引导遮罩
二、帧面板
1、帧：一幅静止的图片；动画组成的基本单位
2、分类：普通帧空白帧（f5）关键帧（f6）空白关键帧（f7）
3、帧频：动画在播放时每秒钟播放的帧数。
操作：新建删除（shift+f5）选中（全选 ctrl+alt+a）移动复制、剪切及粘贴（ctrl+alt+c 或x 或v）帧频的调节
转换：shift+f6
4、洋葱皮工具：同时显示多个帧的对象（重点讲编辑多个关键帧）
5、时间轴特效：创建对象，选中，执行插入/时间抽特效命令
（简单演示）
三、实例（主要是将前面的工具以及图层的知识结合，制作大概5个实例）
第五章逐帧动画
一、Flash动画原理：就是一幅幅图片通过连续播放形成动感的视觉映像。
分类：逐帧动画位移动画形变动画
二、逐帧动画
在连续动画的相邻两帧中，画面一般仅有微小的变化；每一帧都是关键帧；每帧画面的制作。
特点：支持全部编辑对象
三、实例
1、读秒
2、翻书
3、车轮
4、扇子
5、打字效果
6、写字
7、计算题 8、魔方 9、跑步
第六章位移动画
一、概述
位移动画也是Flash中非常重要的表现手段之一。与形状补间动画不同的是，位移动画的对象不能是矢量图对象。如果矢量对象想参与位移动画，必须进行转换操作，如转换为图形、按钮元件等。通过运用位移动画，可以实现元件实例的大小、位置、颜色、透明度、旋转等属性的变化。创建位移动画的要点在于首、尾关键帧的制作和位移动画属性面板的使用。
二、创建
1、先创建两个关键帧，右击任意一帧，选择创建补间动画命令（或者是在属性中的补
间选择动作）
2、先创建第一个关键帧，右击选择创建补间动画，再创建第二个关键帧（这样以后每
次插入一个关键帧都会自动建立补间动画）
3、其他设置
简易:可通过拖动滑块设置参数值，也可以直接在输入框中输入数值。数据范围为1～-10表示动画运动的速度从慢到快；数据范围为1～100，表示动画运动的速度
从快到慢。
旋转:旋转共有无、自动、顺时针、逆时针4个选项。
调整到路径 :将补间对象的基线调整到运动路径，此项功能主要用于引导线运动。
同步复选框:使元件实例的动画和主时间轴同步。
对齐:将补间对象附加到运动路径，此项功能主要也用于引导线运动。
旋转：无自动顺时针逆时针
三、实例
1、网页表头
2、小球碰撞
3、飞镖
4、写字
5、闪烁的星星
6、旋转拖拽文字
7、礼花
第七章形变动画
一、基本概述
1、定义：通过两个关键帧实现物体本质的变化
2、支持对象：原形；可同时创建多个对象的变形
3、分类：普通的形变动画加入形状提示（ctrl+shift+h）复杂图形变化（先匹配
大小再图象符合）
二、实例
1、弹球
2、文字渐变
3、风吹草原
4、文字过场动画
5、图片互变
第八章遮罩层
一、图层
1、定义：
2、分类：
3、特点：
二、遮罩层
1、原理：遮罩处可见，未遮罩处显示下一个图层内容。
2、创建：建立至少两个图层，右击上面图层选择遮罩层命令
3、动态遮罩层：制作动画
注：1、遮罩层上的对象颜色没有要求；2、笔触不可以做遮罩层；3、将笔触转换为填充，
三、实例
1、探照灯文字
新建两个图层，下面为文字，上面为遮罩层；令遮罩层上的物体运动。
2、动态文字（遮罩层和被遮罩层都动）
新建两个图层，文字在上方，在下面一层绘制菱形背景；将背景移动到文字外面，制作背景移动的动画；然后在文字层上制作文字大小的渐变过程；最后将背景移动到文字外面，将文字层做成遮罩层。
3、春联
方法同文字探照灯。
4、电影文字
将文字打散，添加边框，将边框剪切到新的图层上；在填充层的下方，导入连续的图片，制作移动的效果，将填充作为遮罩层。
5、地球
同电影文字相同
6、倒影制作
注意：倒影要制作两个图层，要将上面的图层位置进行稍微的移动，然后制作水纹的效果，将其设置为遮罩层
7、图片交换
三个层完成两幅图片的交换，制作下面一组三个层，实现两幅图片的循环播放
第九章引导层
一、基本操作
1、定义：制作引导动画使用的图层
2、创建
制作补间动画，然后单击图层面板上的添加引导层按钮，创建引导层；在引导层上绘制引导线；选中补间动画的第一帧，将其放置在引导线的一端，选中补间动画的最后一帧，将对象放置在引导线的另一端。
3、注意事项：
引导层只能放置引导线引导线必须是原形一个引导层可以绘制多条引导线引导线必须有起始和终了端点。在实现引导线效果的时候，一定要注意元件与引导线的粘合问题。如果没有粘合，则元件就会按照开始帧和结束帧的位置直线运动。
我们可以单击工具栏里面的放大镜工具来放大场景，这样我们就更清楚地看到元件中的空圆心，对我们实现这个效果有极大的帮助。
运动引导线在动画发布的时候是看不到的，所以引导线的颜色大家可以随意设置，只要与场景中的主体颜色区分开就可以了。
如果没有吸附感，可以单击工具栏中的【选项】|【对齐对象】命令。
当元件粘合在引导线上的时候，我们拖动元件就会有一些吸附的感觉，这就证明我们制作正确。
属性面板中的“调整到路径”选项
二、实例
模拟卫星围绕地球旋转的效果
第十章影片剪辑和按钮
一、按钮
作用：制作网页中的特效按钮。
创建：ctrl+f8，选择按钮选项；在编辑状态下，有四个帧位分别为弹起、指针经过、按下、点击。在四个帧位插入关键帧，设置不同的变化效果。
注：点击是创建按钮的有效感应区域。公共库中的按钮
实例：动态按钮网页游戏按钮
二、影片剪辑
作用：一个小的动画，是组成大型动画的最基本元素。
创建：同按钮
注：1、图形元件制作的动画在场景中无法正常显示
2、影片剪辑中有多少个帧，在场景中有一个帧就可以播放
3、场景中有多个图层的话，要想正常播放，起始关键帧必须在同一个位置
4、如果要想实现不同时间段的动画的播放，场景中的帧必须和影片剪辑中的帧数量相同
三、实例
1、百叶窗
2、星空
3、地球文字
4、互动的弧线
第十一章声音和视频
一、声音
支持的格式：*.mp3 *.wav
导入：ctrl+r
注：导入的声音直接到库中如果不能导入，只能更换音频文件（flash本身不具备修复功能）
属性设置：效果同步（事件和数据流）重复或者是循环
实例：背景音乐
为歌曲添加歌词
二、视频导入
文件/导入/导入视频
支持的视频格式：MPEG（运动图像专家组）、DV(数字视频)、MOV (QuickTime电影)和AVI等。如果你的系统安装了QuickTime 4或更高版本，在Windows和Macintosh平台就可以导入这些格式的视频。如果你的Windows系统只安装了DirectX 7（或更高版本），没有安装QuickTime，则只能导入MPEG、AVI和Windows媒体文件（.wmv和.asf）文件。
注：系统中必须安装directX9.0和ＱｕｉｃｋＴｉｍｅ解码器
制作过程：
选择视频（加载本地视频文件）—〉部署（选择从web服务器渐进下载）—〉编码（修剪影片剪辑的长短；显示高级设置：设置flash编码编辑文件，选择视频解码器，调整帧频以及品质）—〉外观（选择播放器的外观）—〉完成视频导入—〉拖动视频文件到舞台
第十二章 action以及发布设置
一、action
1、可以认为控制flash动画播放的脚本语言
2、使动画更具有交互性
3、分类：帧动作
对象动作
4、操作：
手动添加
利用面板自动输入
删除
5、action具体应用
帧语句
Play(); stop(); gotoAndPlay(); gotoAndStop();
fscommad(“fullscreen”,true);
On语句
结构
On（命令）{程序段}
常用命令：relese点击，press单击，rollOver鼠标滑过，rollOut鼠标离开
6、利用行为添加action
添加声音（加载库中的声音）
添加跳转菜单
二、发布
1、文件/导出/导出影片
2、发布预览
发布的格式密码设置其他设置不同格式的特点介绍
实例：
按钮控制动画
流星划过
按钮特效隐藏图片
图片浏览器
第十三章组件（UI）
一、基本组件
Button：一个可调整大小的矩形用户界面按钮。用于提交表单中的信息。
TextInput：单行文本组件，可采用html格式，也可以作为密码域。
TextArea：多行文本，也可以作为密码域
CheckBox：复选框
ComboBox：下拉列表组件
List：可滚动的单选和多选列表框
RadioButton：单选按钮
二、创建
组件面板的使用以及各项的插入
三、实例：
网上留言板制作表单动画
第十四章综合实例
一、场景的应用
1、基本操作
插入
重命名
场景编辑的转换
2、action控制
使用gotoAndPlay（”场景名称”，帧数）
3、实例：播放器
二、综合实例
1、此处实例可依据个人情况将以前所学实例进行综合讲述
例：生日贺卡单摆试验等
2、action实例
黑客帝国文字（for语句）
Fireworks教案
第一章
一、概述
1、简介：adobe公司旗下的集图像处理与动画制作为一体的制作软件
2、特点：丰富的位图处理功能
强大的优化输出功能（可根据需要更改图片格式）
可导入各种文件格式
制作网页
动画制作
兼容性增强
3、网页制作概述
网页元素组成
网页制作过程
前台美工应用
4、网页四剑客（比对fw和ps）
二、图形简介
1、位图
2、矢量图
3、网络图形（jpeg，gif，png简介和特点）
jpg：支持颜色多，文件容量大。
gif：支持256色，支持透明背景和动画
png：兼并了jpg和gif的特点，支持直接编辑，逐渐流行。
三、安装与进入
Install.exe（安装在非系统盘）sn.txt（keygen.exe）为注册码
绿化软件的安装。
四、基础知识
1、界面简介：新建打开保存；窗口菜单
2、快捷键
工具（ctrl+f2）属性（ctrl+f3）克隆（ctrl+shift+d）数值变形（ctrl+shift+t）
对齐（没有）层面板（f2）优化（f6）混色器（shift+f9）帧（shift+f2）
历史纪录（shift+f10）行为（shift+f3）
3、辅助工具
首选参数（ctrl+u）—设置各种软件的基本信息属性；标尺（ctrl+alt+r）网格（ctrl+alt+g）注：网格以及辅助线的编辑
4、界面设置
三种界面切换（f）创建以及画布设置
第二章工具（一）
一、选择区域
1、选取工具组（v）
后方选择工具：先选中前面的物体，后单击后方物体，进行后面物体的选中。
2、任意变形工具组（q或ctrl+T）
缩放倾斜（透视效果）扭曲
3、裁减工具组（c）
导出区域：除了进行图片的裁减以外，可以对所选中的部分直接进行导出
二、位图区域
1、选取框工具（m）
椭圆选取框工具
用于对位图进行选择，选择区域以外的物体将不会被更改。
2、套索工具（L）
分为普通套索和多边形套索，用于制作不规则选区
3、魔术棒工具（W）
用于选取相似颜色的区域（选择\选取相似）
注：讲解所有位图选取工具时要配合选择菜单以及属性面板的介绍
三、实例：
图片修饰
第三章工具（二）
一、位图工具
1、笔刷和铅笔工具（B、Y）
用于绘制软线条和硬线条使用
属性面板操作（特别是画笔样式以及如何使用其它画笔样式）
2、橡皮工具（E）
用于擦除图片区域
注：透明度设置以及应用
3、位图修饰工具组
模糊工具锐化工具减淡工具加深工具涂抹工具
4、图章工具组
仿制图章工具替换颜色工具去除红眼工具
二、钢笔工具和部分选区工具
工笔工具用于绘制路径使用
注：使用钢笔工具时如何绘制直线不封闭路径，以及绘制完曲线路径后如何绘制直线路径。
将路径转换为选区。
用部分选取工具对绘制的路径
三、实例
山木培训标志李宁标志
第四章工具（三）
一、路径工具组
1、图形工具组
矩形工具多边形工具圆形工具自定义图形工具组
注：自定义图形的使用方法以及绘制多边形和星形。
2、文字工具（T）
使用文本编辑器进行设置属性设置
3、路径绘制工具
注：增加钢笔工具组的自由路径和重绘路径工具。
二、web工作区域
热点和切片工具
用于制作网络中所用连接以及特效连接
注：只讲切片的分割功能。
三、颜色区域
1、滴管工具（I）
用于吸取颜色和样式以后，为图形赋予新的样式。
2、填充工具组（K）
油漆桶和渐变工具
3、视图区域
空格+ctrl 放大空格+alt+ctrl 缩小双击手型工具恢复全屏显示
第五章编辑对象
一、分类：
1、路径对象（直线、工笔、矢量路径工具、椭圆、多边形）
可以直接进行编辑的对象，是fw中最基础的绘制对象
2、矩形组合对象（ctrl+g）
进行组合后可以进行同时的位移和变形；但是，组合对象仍可以进行单独路径的编辑，而矩形对象不可以。
3、文本对象
文字工具绘制的对象
注：路径文字的制作
4、位图对象
直接导入的图片
平面化所选的对象
二、组合路径选项
结合联合打孔拆分交集剪裁
三、改变路径
四、实例
第六章图层
一、概述
二、分类
网页层
普通层（图层与图层文件夹）
背景层
三、操作
新建图层
删除图层
图层的重命名
图层属性（锁定、透明度）
图层的合成
图层混合模式（*）
四、蒙版
矢量蒙版（只以轮廓显示）
创建矢量蒙版
步骤1：打开一幅图像,选择工具箱中的椭圆工具，在图像上绘制一个无填充颜色的椭圆步骤2：选中无填充颜色的椭圆，按Ctrl+X组合键剪切蒙版对象后，选中被蒙版对象图片。
步骤3：
执行【编辑】→【粘贴为蒙版】命令。操作完成后，原图像中只有与椭圆区域重合的部分被显示出来，其余部分被隐藏了。
步骤4：保存文档。
矢量蒙版对象将下方的对象裁剪或剪贴为其路径的形状。创建矢量蒙版时，在层面板中会出现一个带有钢笔图标的蒙版缩略图，表示已经创建了矢量蒙版。
选择矢量蒙版，在其属性面板中会显示有关蒙版应用属性的信息。默认情况下，矢量蒙版通过其路径轮廓进行应用，但也可以采用其他的方式，如灰度外观等。
位图遮罩（以像素进行影响）
将绘制图形平面化以后（或直接导入图片），其它过程同上
五、遮罩层实例
第七章滤镜和效果
一、滤镜
滤镜是通过选择【滤镜】菜单中的命令来实现的，Fireworks的【滤镜】菜单中主要包括杂点、模糊、调整颜色、锐化等。
注意：如果使用【滤镜】菜单将滤镜应用于选定的矢量对象，则Fireworks会提示将所选对象转换成位
图后再进行处理。
将上图中的正圆应用杂点滤镜，操作步骤为：
步骤1：在画布中选中正圆形矢量对象。
步骤2：执行【滤镜】→【杂点】→【新增杂点】操作，弹出所示的提示框。
步骤3：单击【确定】按钮后，弹出所示的“新增杂点”参数设置窗口，设置参数后单击【确定】按钮即可。正圆应用杂点滤镜后的效果所示。
2.动态效果
动态效果是通过在所选对象属性面板的“效果”区域内进行添加和编辑的，除了上面介绍的滤镜效果外，还包括斜角、浮雕、阴影、光晕等图像效果。
将上图中的正圆应用内斜角效果，操作步骤为：
步骤1：在画布中选中正圆形矢量对象。
步骤2：在正圆形对象属性面板的效果区域中，单击添加效果按钮，在效果菜单中选择【斜角和浮雕】→【内斜角】效果，弹出所示的参数设置对话框。
步骤3：参数设置完成后按Enter键或在画布中单击。应用内斜角的效果所示。
图像制作实例
在图像的制作过程中，经常要进行同时选择多个对象的操作，主要方法有：
按住Shift键点选每个对象；
使用Ctrl+A全选画布中的所有对象；
使用工具箱中的选择工具，在画布上框选多个对象；
执行【选择】→【全选】操作。
1.制作太极图
步骤1：新建一个宽300像素、高300像素的画布。
步骤2：选择【视图】→【标尺】命令，打开标尺，并利用鼠标从纵、横标尺中拖拽出两条辅助线，位置在纵、横距起点处150像素
步骤3：选择工具箱中的椭圆工具，在其属性面板中设置“描边颜色”为#000000，“笔尖大小”为1，“描边种类”为实线，禁用填充颜色。将鼠标指向辅助线的交叉点，同时按下Shift+Alt键，画出一个以辅助线交叉点为圆心，直径为200像素的正圆。
步骤4：继续使用椭圆工具，利用上述方法，分别在垂直辅助线的两侧绘制出两个直径为100像素的小圆。
步骤5：同时选中画布上的三个圆，选择工具箱中的刀子工具，沿水平辅助线方向从大圆的左侧向右侧进行切割，将三个圆同时切割为两部分。分别将左侧小圆的下半部分和右侧小圆的上半部分删除。
步骤6：同时选中左侧小圆的上半部分和右侧小圆的下半部分，执行【编辑】→【克隆】命令，将这两段孤线克隆，就是在原位置上复制两段孤线。
步骤7：按住Shift键选中克隆后的两段孤线和大圆的上半部分孤线，并将其上移，所示。
步骤8：选中移动后的三段孤线，执行【修改→【组合路径】→【接合】命令，将这三段孤线组合成一个完整的封闭路径。
步骤9：重复上述步骤，将未移动的三段孤线组合成一个完整的封闭路径。将“步骤8”中移出的路径移回原位
步骤10：选择下半部分路径，将其填充颜色设置为#000000（黑色）。
步骤11：按“步骤3”中的方法，沿水平线在垂直线的两侧分别画两个直径为20像素的小圆，其中左侧小圆的填充颜色设置为#FFFFFF（白色）、右侧小圆的填充颜色设置为#000000，将辅助线拖出工作区。
其它滤镜以及效果同上使用
二、特殊效果
投影斜角与浮雕
三、添加第三方滤镜（eye candy4000等）
安装以及使用
第八章实例教学
使用上述章节的知识点，制作实例
例如：按钮、静态导航条、图片处理、立体文字、镂空文字、金属文字
云彩效果、模拟3d网格线、水印文字、太极图等
第九章样式和帧
一、样式简介
1、定义分类（图形样式和文字样式）
2、操作
应用
新建
编辑
删除（系统自带样式不能删除）
保存
导入
二、帧
定义：一幅静止的图片
作用
用于动画制作
操作：
新建
删除
复制
帧频
速度
洋葱皮工具
三、实例：心跳广告qq表情
第十章组件对象
图形（用于存放静态的图片）
动画（存放动画）
按钮（制作按钮）
快捷键：新建ctrl+f8 ；转换f8
实例：
制作立体按钮
在网页中我们经常看到一些漂亮的立体按钮，起到了非常好的美化作用。现在我们就来学习一种简单的制作立体按钮的方法，具体步骤如下：
步骤1：新建画布，选择工具箱中的矩形工具，在画布中绘制一正方形。
步骤2：单击工具箱中填充工具的下拉箭头，从中选择填充选项进行设置，45所示。
步骤3：选择工具箱中的渐变工具，沿矩形左上角向右下角方向拖动油漆桶，改变填充样式。
步骤4：选择该矩形，对其执行【编辑】→【克隆】命令；再执行【修改】→【变形】→【旋转180°】命令，将矩形旋转；然后选择工具箱中的缩放工具，按住Alt键，在保持中心位置不变的情况下，将其缩小。
步骤5：选择小矩形，在属性面板中设置边缘选项为羽化、数值2。
步骤6：同时选择两个矩形，执行【修改】→【改变路径】→【伸缩路径】命令，然后在?°伸缩路径?±对话框中进行参数设置，单击【确定】按钮.
步骤7：选择两个矩形，执行【修改】→【组合】命令
步骤8：选择组合后的矩形，在其属性面板的效果中选择色相/饱和度，设置参数
步骤9：选择工具箱中的文本工具，输入字母，在属性面板中设置字体大小为35、加粗，填充颜色为#FFFFFF、禁用描边颜色；在效果中选择凹入浮雕，利用工具栏中的【对齐】按钮调整
其到矩形中心位置。
动画制作
1.毛毛细雨
步骤1：新建文档，导入一幅图片。
步骤2：执行【窗口】→【层面板】命令打开层面板，添加一个新层，并在该层上用矩形工具绘制
出一个略大于画布的矩形，用黑色填充。
步骤3：选择黑色矩形，在其属性面板的效果中选择【杂点】→【新增杂点】，在弹出的?°新增杂点?±对话框中设置数量为最大400。
步骤4：再为该矩形添加运动模糊效果。
步骤5：在该矩形的属性面板中设置不透明度。
步骤6：打开帧面板，在帧面板的选项菜单中选择?°重制帧?±操作，在?°重制帧?±对话框中进行设置，然后单击【确定】按钮
步骤7：选中第2帧，使用方向键将矩形向左和向下各移动10个像素。选中第3帧，使用方向键将矩形向左和向下各移动20个像素
步骤8：选中第1帧，在层面板中双击层1，在弹出的对话框中勾选?°共享交叠帧，53所示。
步骤9：单击控制区的播放按钮，预览效果，毛毛细雨的效果出现了
2.飞舞的蝴蝶
步骤1：导入一张带蝴蝶的图片，利用魔术棒等选取工具，将蝴蝶从原图中抠出，剪切来备用。
步骤2：导入一张鲜花图片，作为背景。在层面板中勾选背景层的共享交叠帧选项
步骤3：执行【编辑】→【插入】→【新元件】命令，在?°元件属性?±对话框中选择动画类型。
步骤4：在打开的元件编辑器中粘贴第1步抠出的蝴蝶，按比例调整大小后进行复制。
步骤5：在帧面板中添加一个新帧，粘贴上步复制的蝴蝶。按住Alt键，在保持蝴蝶中心点不变的情况下进行缩放，并调整其亮度和对比度，单击【完成】按钮返回。
步骤6：删除画布中自动添加的动画元件实例，从库面板中重新将动画元件实例拖动到画布中，会弹出提示框，单击【确定】按钮，然后调整元件实例的位置
步骤7：单击控制区的【播放】按钮。
第十一章行为
一、概述定义作用
构成：事件：对图形的操作
动作：操作所产生的效果
二、基础操作
注：添加之前必须有热点或切片
添加
删除
常用事件
常用动作
三、实例
制作弹出菜单
弹出菜单在网页制作中起到重要的导航作用，当鼠标移到触发网页对象，如切片、热点、按钮上或单击这些对象时，浏览器中即显示弹出菜单，供用户选择浏览。一般在弹出菜单中都附加URL链接。
每个弹出菜单项都以HTML或图像单元格的形式显示，并具有“弹起”状态和“滑过”状态，并且在这两种状态中都包含文本。要预览弹出菜单，可按F12键在浏览器中预览，Fireworks文档窗口中的预览状态不会显示弹出菜单。Fireworks提供了“弹出菜单编辑器”，利用它可以快速方便地创建垂直或水平弹出菜单。
1.创建弹出菜单
本例将在以前制作的导航栏基础上介绍弹出菜单的制作过程，具体操作过程如下
步骤1：打开以前制作的daohang.png文件，修改画布大小。
步骤2：选中“动物趣闻”按钮元件实例，将鼠标移至中心控制点处单击，在弹出的操作选项中选择“添加弹出菜单”，打开“弹出菜单编辑器”。
步骤3：在“内容”选项卡中添加相关内容。
“内容”选项卡中的为添加菜单项，为删除菜单项，用于将选中的菜单项变成上级菜单的子菜单，用于将子菜单还原为同级菜单，“文本”用于输入菜单项的名称，“链接”用于输入菜单项的对应链接地址，“目
标”用于设置链接页面出现的形式。
步骤4：单击“外观”选项卡，进行文本格式的设置，为“滑过状态”和“弹起状态”应用图形样式，选择菜单的形式为“垂直菜单”。
步骤5：单击高级选项卡，可进行单元格大小、边距和间距、文字缩进、菜单消失延时，以及边框宽度、颜色、阴影和高亮等设置。
步骤6：单击位置选项卡，对弹出菜单位置和方向进行设置。
步骤7：最后单击【完成】按钮，按F12在浏览器中浏览。
步骤8：保存文档。
2.导出弹出菜单
Fireworks生成了在Web浏览器中查看弹出菜单所需的所有JavaScript。将含有弹出菜单的Fireworks 文档导出为HTML时，会自动生成一个名为mm_menu.js的JavaScript文件，此文件与HTML文件在同一文件夹中。在上传文件时，应该将mm_menu.js上传到与包含该弹出菜单的网页相同的位置。如果希望将该文件发送到其他位置，必须在Fireworks HTML代码中更新引用mm_menu.js的超级链接，以便反映自定义位置。如果文档中有若干个弹出菜单，或者有若干个含弹出菜单的文档，Fireworks只创建一个mm_menu.js文件
当菜单包含子菜单时，Fireworks会生成一个名为arrows.gif的图像文件。该图像是一个出现在菜单项旁边的小箭头，它表示存在一个子菜单。无论文档中包含多少个子菜单，Fireworks总是使用同一个arrows.gif文件。
第十二章优化、输出和批处理
一、优化
优化格式
jpg png gif
网络安全色（216）
网页抖动
优化面板（f6）
避免颜色丢失过多，而无法正常显示，故使用抖动颜色，以增加像素点。
二、导出
导出设置（ctrl+alt+x）
导出（ctrl+shift+r）
导出分类
三、批处理
第十三章综合运用
制作网站首页
Dreamweaver教案
第一讲
一。Dreamweaver 简介
1.定义
网页排版软件
2.特点
a.可视化的操作界面
b.内置强大的站点管理工具
c.内置代码
d.支持动态网页技术
e.能很好的与Flash,Fireworks，photoshop兼容
3.作用
网页设计与网站管理
二.基础知识
1、名词解释
站点：一个文件夹，存放所有的网页元素
域名：绑定在一个IP地址上的特殊字符
发布：网站上传的过程
URL：同一资源定位器
导航条：一般位于网站的最上方，起导航作用
超级链接：子页之间的链接或者是特效链接
表单：专门用于收集用户信息的输入框。
2、了解网站
专业网站：一般是企业级网站
个人网站：个人爱好
门户网站：最综合的网站，一般搜索引擎以及超大型网站
职能网站：提供某一种服务
3、网页元素
文本；动画；图片；脚本
4、网页元素使用标准
Logo（上方；动态效果不要太强）；Banner（尺寸设置，存储大小）按钮；导航条设置
5、网页制作原则
站名有创意整体规划动画不能过多导航要明朗制作通用网页主题鲜明优化图像定时更新
三、DW安装与进入
双击Install.exe（安装在非系统盘内）；序列号
四、界面简介
五、操作
1.站点的建立
2.文件菜单
3.编辑菜单
4.视图菜单（针对辅助工具）
5.窗口（存放所有的工具面板）
第二讲文字
一. 文字
1.作用：网页的各种文字说明（新闻等）
2.分类：普通文字和特殊字符
二.特殊文字
1.常见特殊字符
插入面板--->字符选项卡
2.不常见的特殊字符
输入法-->微软智能abc-->v1或右击软键盘
3.排版字符
换行: shift+回车
换段: 回车
空格: 硬空格:ctrl+shift+空格
软空格:空格
4.属性设置（ctrl+F3）
二、文件属性设置（ctrl+j）
外观：用于设置版面正文字体；将对齐的左右上都设置为0。
链接：链接文字的四种状态下的颜色以及变换图象时显示下划线标题：最多设置六级
第三讲图片
一.图片
1.作用：美化作用
2.注意事项
a.支持格式只能是gif ,jpg,png文件
b.图片文件容量不能太大
c.图片要插入适当
d.图片要美观
3.操作
a.插入(插入-->常用--->图片)—ctrl+alt+I
b.删除
c.调整
4.属性设置
5.应用
1.图片占位符
2.鼠标经过图片
3.导航菜单
二、链接（内部链接和外部链接）
文字链接
图片链接
JavaScript链接（不需要演示）
邮件链接（常用工具面板）
锚链接（常用工具面板）
空链接（＃号）
第四讲表格
一.表格
1.作用:主要用于对齐数据和对页面上的文本进行排版。是网页布局
2.基本操作
插入表格（工具栏；插入菜单；ctrl+alt+t）
选中（表格、行、列、单元格）
插入行、列
表格数据的导出与导入
表格数据的排列
3.高级属性设置
表格
单元格
二、表格布局使用
1、通过实例，介绍用表格对整个网页进行整体布局
2、布局表格工具使用
布局工具栏，单击布局按钮，绘制布局表格和布局单元格。
第五讲表格实例应用（一）
利用表格制作通用型网页
第六讲表格实例应用（二）
第七章层
一、概述
作用
二、操作
创建层的嵌套首选参数设置
选中拖动对齐及大小调整
三、层的高级属性操作
1、Ctrl+F3 层面板
2、层和表格的互换
四、实例（用层进行布局，以及制作网页）
第八讲框架
一.框架/分栏
1.定义
框架集和框架
2.作用
1.可把当前的整个网页分成多个子页
2.节约浏览器空间，提高访问效率
3.组成
框架和框架集
4.操作
1.建立
2.合并
4.保存
框架集内容（所有框架的集合）
子框架内容（一个单独的子页）
5.设置（属性设置以及框架面板）
1.框架集
2.子框架
3.无框架
6.应用实例
第九讲表单
一。表单
1.定义:
2.作用：主要用于收集用户的信息和进行交互式的交流。
3.构成
表单域:代码中form，在提交信息时会将整个内容全部提交。表单元素（全部在表单工具面板中）
4.操作
新建表单域
删除表单
5.常用表单元素
文本域等设置
第九讲行为
一、行为
1.定义：根据对网页操作所产生相应的网页特效.
2.组成：
事件:你对网页的所有操作
动作:根据所操作响应的效果
3.作用
可以通过行为使网页变得生动。
4。操作
打开行为
添加行为
《网页制作》教学设计 法、说学法、说教学过程、说板书设计。 一、说教材： (一)教材分析：本节内容是省编《信息技术》全一册第六章 网络与INTERNET基础知识第五节的内容(2000年版为第八章第四节内容，2001、2002版教材第六章第五节内容)。虽然在这一节内容在新版教材变更为拓展模块，但针对现在网络快速发展，广大的学生接触，使用INTERNET的机会也大大增加，学生在使用网络获取信息时，更多的是通过浏览网页这一方式，我认为上好这节课是非常必要的，这对学生进一步认识、使用INTERNET更有益处，同时通过网页制作这一过程也利于学生对计算机常用素材的类型有更深入的了解，在一定程度上也起着培养学生运用综合知识能力作用，所以我认为这节课是非常值得我们去研究上好的，考虑这节课的内容及教法、学法的需要，我把这节分为两课时，第一时：学生自学，自练Word制作网页的基本方法；第二课：让学生自己构思创意一个内容丰富，页面美观的网页。 (二)教学目标：根据对教材的分析及学生实际情况，制定如 下的教学目标： (1)知识目标：1、有关网页文件的说明 2、熟悉用Word制作网页的基本方法 3、超级链接是网页实现互相链接的基本方法 (2)能力目标：1、培养学生的自学能力 2、创意构思能力 3、能制作出具有多重链接、多种素材、内容 丰富的网页。 (3)情感目标：1、教育学生正确认识和理解信息技术相关文 化，伦理和社会问题，负责地使用信息技术。 (三)教学的重、难点：根据对教材的分析及网页制作过程中的 实际情况，我认为要出制作内容丰富的网页，关键是要知 道网页间互相链接的方法，所以我把超级链接做为本节的
网页制作学习心得体会 刘少波2010221111120024 转眼间，我已经学习《网页设计与制作》这门课程一个学期了，虽然时间有点短，但是这个学期以后我受益匪浅。 记得最初接触dreamweaver的时候，我很茫然。因为以前从来没有见到过这种格式的软件操作窗口和如此多的陌生名词，只能用鼠标到处乱点。并且刚开始几节课，老师并没有给我们讲关于如何去使用这个软件的知识，基本上每几课有90%的时间在给我说一些有关电脑的基本知识和如何学习软件的操作，当时觉得没什么用，甚至有点反感，害怕一个学期以后没什么收获，最后问了一下周围的同学，原来大家都有这样的想法。 渐渐的，在老师的悉心教导下，我们开始熟悉这个软件了。然而一个学期也快结束了。最后几节课，老师布置了一个任务，要求做一个网站。虽然学了一个学期，但是我觉得我的能力完全没有这么高，做个网站真的很不容易。 最开始是确定主题。我一直都想不出应该做一个关于什么的网站，一次，一个朋友告诉我她在省博物馆，叫我帮她查一下勾践剑在哪个展厅。打开百度，我以外的发现省博物馆的网站进不去，于是突然想到可以做一个与博物馆有关的网站。于是开始收集各方面的资料。 确定了主题就开始布局了。最开始使用了一个表格，然后在表格内进行拆分合并处理，接着就把通过ps处理出来一个版头并且把修改过大小的图片放进去了。预览时，问题出现了，发现版头与下面的图片文字之间出现了很大的一段距离，但是在软件中已经把距离缩小为0了，多次尝试后没有效果。最后想到可以另外再加一个表格，把版头放在一个表格内面，这样问题就解决了。预览是效果还不错。 但是总觉得首页做得太普通，一次浏览学长做的网页时，觉得他们的文字滚动窗口做得效果做得不错，于是想借见一下。就决定把自己网站的左边修改修改。复制了他的代码，把上面的内容修改成我的网站需要的文字。本以为可以轻松的完成，但是却出现大问题了。因为需要滚动的文字占的空间太大，把左边的那部分表格全部占满了，而在实际的网页预览中，这个有文字滚动的框只占了左边的
HTML（Hyper Text Mark-up Language）即超文本标记语言或超文本链接标示语言，是目前网络上应用最为广泛的语言，也是构成网页文档的主要语言。HTML 文本是由HTML命令组成的描述性文本，HTML命令可以说明文字、图形、动画、声音、表格、链接等。HTML的结构包括头部、主体两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。 HTML文档制作不是很复杂，且功能强大，支持不同数据格式的文件镶入，这也是WWW盛行的原因之一，其主要特点如下： 1、简易性，HTML版本升级采用超集方式，从而更加灵活方便。 2、可扩展性，HTML语言的广泛应用带来了加强功能，增加标识符等要求，HTML采取子类元素的方式，为系统扩展带来保证。 3、平台无关性。虽然PC机大行其道，但使用MAC等其他机器的大有人在，HTML可以使用在广泛的平台上。 CSS 语法由三部分构成：选择器、属性和值。selector {property: value}选择器通常是你希望定义的HTML 元素或标签，属性是你希望改变的属性，并且每个属性都有一个值。属性和值被冒号分开，并由花括号包围，这样就组成了一个完整的样式声明：body {color: blue}上面这行代码的作用是将body 元素内的文字颜色定义为蓝色。在上述例子中，body 是选择器，而包括在花括号内的的部分是声明。声明依次由两部分构成：属性和值，color 为属性，blue 为值。 色彩可用色调（色相）、饱和度（纯度）和明度来描述。人眼看到的任一彩色光都是这三个特性的综合效果，这三个特性即是色彩的三要素，其中色调与光波的波长有直接关系，亮度和饱和度与光波的幅度有关。 色彩的三要素：明度、色相、饱和度。 刚刚接触超文本，遇到的最大的障碍就是一些用“<”和“>”括起来的句子，我们称它为标签，是用来分割和标记文本的元素，以形成文本的布局、文字的格式及五彩缤纷的画面。 1. 单标签 某些标记称为“单标签”，因为它只需单独使用就能完整地表达意思，这类标记的语法是：< 标签名称> 最常用的单标签是
, 它表示换行。 2.双标签 另一类标记称为“双标签”，它由“始标签”和“尾标签”两部分构成，必须成对使用，其中始标签告诉Web浏览器从此处开始执行该标记所表示的功能，而尾标签告诉Web浏览器在这里结束该功能。始标签前加一个斜杠（/）即成为尾标记。这类标记的语法是： <标签> 内容 其中“内容” 部分就是要被这对标记施加作用的部分。例如你想突出对某段文字的显示，就将此段文字放在一 标记中： 第一： 3.标签属性 许多单标记和双标记的始标记内可以包含一些属性，其语法是： < 标签名字属性1 属性2 属性3 … > 各属性之间无先后次序，属性也可省略（即取默认值），例如单标记
第一讲网页设计概述 使学生对网站及网页有一定的认识，激发学生学习网页设计的兴趣。 【教学内容】 讲解网页设计的相关术语及网站制作的基本流程。 【教学重点】 网页设计中的若干术语。 【教学难点】 理解网页设计中的若干术语。 【教学方式】 讲授式、讨论式、案例分析式。 【教学参考】 1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。 2、《Internet 网页工场》Wittime工作室重庆出版社。 3、《WEB网站设计》Joel Sklar著高等教育出版社。 4、《HTML网页制作教程》材义语编著铁道出版社。 【新课内容】 1.1 WWW和URL 1.1.1 Web的起源 Web是World Wide Web的简称，一般也称之为WWW或3W 1.1.2 Web的特点和结构 Web最大的特点是使用了超文本（Hypertext） WWW采用C/S（客户机/服务器）工作模式 在浏览器和服务器之间应用HTTP（Hyper Text Transfer Protocol，超文本传输协议）作为网络应用层通信协议 1.1.3 URL URL的完整格式 协议://主机名或IP地址：端口号/路径名/文件名
1.2 IE5的使用 Web浏览器是浏览Internet资源的客户端软件 在Windows环境下使用的浏览器主要有Internet Explorer、Netscape Navigator、Mosaic等 1.2.1 IE5的界面 1.2.2 IE5的使用 1.3 网页中所使用的技术 1.3.1 HTML语言和XML语言 1、HTML语言 ?HTML只使用SGML中很小一部分标记 ?HTML语言（Hyper Text Markup Language 超文本标记语言） ?HTML是纯文本的语言，其源代码可以用各种文本编辑工具进行编辑，常用的网页制作软件如FrontPage、Dreamweaver等实际上是自动生成HTML源代码的工具 2、XML语言 XML（eXtensible Markup Language） 1.3.2 动态网页 1.3.3 多媒体技术的应用 1.3.4 Web服务器端程序 1.4 制作网页的基本方法 1.4.1 制作网页的基本步骤 1、确定网页的内容 2、设计网页的组织结构 3、资料的收集与整理 4、选择网页的设计方法 1.4.2 制作网页时要注意的问题 1、网页的标题要简洁，明确。 2、在文本中要使用水平线，以分割不同部分。 3、对重点段落要强调显示。 4、网页中插入的图片要尽量的小。
网页设计心得体会范文 现在，计算机和网络已经深入到了我们生活中的方方面面，也已经成了生活中不可缺少的一部分。你知道网页设计心得体会范文是什么吗?接下来就是OK为大家的关于网页设计心得体会范文，供大家阅读! 网络成了我们获取知识和信息的一种便捷工具，现在的网民也在不断的增多，所以，了解和学习网络知识是我们作为一名大学生迫切所需的， 网页设计心得体会。我利用寒假的时间，对网页设计进行了初步的认识和了解，并基本掌握Dreamweaver的应用。 通过对网页设计书籍的翻阅，我学习到了一些关于建设网站和制作网页的知识，在实践查阅资料时，对flash也有所了解。我还了解了一些基础的网络技术。通过学习，我对计算机有了更深层次得到了解，也有了更浓厚的兴趣。尤其是对网页制作的过程与一些技巧手法更有了另外一番了解，对网页制作的基础知识也有了一定的掌握。在这个过程中，我同样认识到网页设计不是一门学科的独秀，而是多种课程的综合，他是、Flash、Fireworks等网页软件的综合应用。
下面阐述一下我在翻阅《Dreamweaver》时的一些关于网页设计的见解。在具体的制作一个网页时我了解到一个优秀的网页设计应该具备一些基本原则。 首先，要·确定网页设计的内容一个优秀的风站要有一个明确的主题。整个网站围绕这个主题,也就是你在网页设计之前要明确你这个网站有什么目的,用来做什么，所有页面都是围绕着这个内容来制作，有了明确的内容对排名有很重要的作用;其次，要了解你网站所在行业的客户，及你的网页属于哪个类别。用户是一个网站成败的关键,如果用户要花很多时间进入你网站很有可能用户会立即关掉你网站,或者你网站操作很不方便用户也会马上离开,这种网站是很失败的设计,只会让用户失望的离去. 在完成以上的基本内容之后网页的基本框架便成形成了， 下面要开始的便是优化工作， 内容是整个网页的核心。在网页设计之前必须明确网页的内容安排。优秀网页设计是要建立在平凡的基础上的。然后在具体的规划一个网页时，可以用树状结构先把每个页面的内容大纲列出来，尤其要制作一个大的网站 (有很多页面) 的时候，特别需要把这个架构规划好，也要考虑到以后可能的扩充性，免得做好以后又要一改
《HTML+CSS 网页设计与布局》课程教案 授课教师：授课班级：地点：周课时： 5 课时网页设计基础知识 章节内容 教学目标重点难点教学Dreamweaver软件介绍及其基础操作 HTML 基础知识及常用标记 1)使学生了解网页设计的相关基础知识； 2)使学生熟悉 Dreamweaver 软件界面的基本操作方法。 1)了解网页设计相关概念和网页的类型； 2)熟练掌握 Dreamweaver 软件创建和管理站点的方法。课堂讲授、案例讲解与指导 方法 教学 计算机机房 环境 时间 教学过程及内容提要备注分配 一、引入 约 15 分钟 教 1 、相互认识，提出与本学科相关的知识，介绍本门课程情况、教学内 学 容及总学时数进度安排，宣讲本课程教学纪律，鼓励学生营造一种 过 学习氛围，尊重同学，互帮互学，真正达到学以致用； 程 2 、提出问题：上过网吧有谁自学过网页设计听说过HTML或者CSS 设 这两个概念吗 计 约 35 分钟学生理解3、
二、告知学生课堂任务 本次课所学习的主要内容是HTML相关基础知识和 Dreamweaver软件基础操作； 三、逐步演示讲解分析教学内容 1、网站和网页的区别： 2、（ 1 ）网页是Internet基本元素； 3、（ 2 ）网站由网页组成； 4、静态网页和动态网页： 5、静态网页：纯粹HTML语言格式的网页通常被称为静态网页，静 态网页的后缀名通常为.htm 、.html 、 .shtml 、 .xml 。 6、动态网页：许多人认为网页会动就是动态网页，这是个错误的观点， 在静态的网页中也可以含有动态的图片，这仅仅是视觉上的动态罢 了。真正的动态网页是指实际上并不是独立存在于服务器上的网页 文件，只有当用户请求时服务器才返回一个完整的网页。也就是说， 它是返回到了客户端上的网页。例如网页文件是以ASP 、PHP 、JSP、 ASPX 为结尾就是动态的网页了。 约 20 分钟学生熟记 7、静态网页的特点： 8、（ 1 ）内容相对稳定，容易被搜索引擎检索到； 9、（ 2 ）没有数据库支持，在网站制作和维护方面工作量大； 10 、（3）交互性差，在功能方面有很大的限制。 11 、动态网页的特点： 12 、（1）以数据库技术为基础，可大大降低网站维护的工作量；
学习网页设计心得体会5篇 学习网页设计心得体会一:网页设计心得体会现在,计算机和网络已经深入到了我们生活中的方方面面,也已经成了生活中不可缺少的一部分,网络成了我们获取知识和信息的一种便捷工具,现在的网民也在不断的增多,所以,了解和学习网络知识是我们作为一名大学生迫切所需的, 网页设计心得体会。我利用寒假的时间,对网页设计进行了初步的认识和了解,并基本掌握dreamweaver的应用。 通过对网页设计书籍的翻阅,我学习到了一些关于建设网站和制作网页的知识,在实践查阅资料时,对flash也有所了解。我还了解了一些基础的网络技术。通过学习,我对计算机有了更深层次得到了解,也有了更浓厚的兴趣。尤其是对网页制作的过程与一些技巧手法更有了另外一番了解,对网页制作的基础知识也有了一定的掌握。在这个过程中,我同样认识到网页设计不是一门学科的独秀,而是多种课程的综合,他是、flash、fireworks等网页软件的综合应用。 下面阐述一下我在翻阅《dreamweaver》时的一些关于网页设计的见解。在具体的制作一个网页时我了解到一个优秀的网页设计应该具备一些基本原则。 首先,要·确定网页设计的内容一个优秀的风站要有一个明确的主题。整个网站围绕这个主题,也就是你在网页设计之前要明确你这个网站有什么目的,用来做什么,所有页面都是围绕着这个内容来制作,有了明确的内容对排名有很重要的作用;其次,要了解你网站所在行业的客户,及你的网页属于哪个类别。用户是一个网站成败的关键,如果用户要花很多时间进入你网站很有可能用户会立即关掉你网站,或者你网站操作很不方便用户也会马上离开,这种网站是很失败的设计,只会让用户失望的离去. 在完成以上的基本内容之后网页的基本框架便成形成了, 下面要开始的便是优化工作, 内容是整个网页的核心。在网页设计之前必须明确网页的内容安排。优秀网页设计是要建立在平凡的基础上的。然后在具体的规划一个网页时,可以用树状结构先把每个页面的内容大纲列出来,尤其要制作一个大的网站(有很多页面) 的时候,特别需要把这个架构规划好,也要考虑到以后可能的扩充性,免得做好以后又要一改再改整个网站的架构,很浪费时间和财力。大纲列出来后,还必须考虑每个页面之间的链接关系。是星形,树形,或是网形链接。这也是判别一个网站优劣的重要标志。链接混乱,层次不清的站点会造成浏览困难,影响内容的发挥。框架定下来了,然后开始一步一步有条理,有次序地做来,就胸有成竹得多,也会为主页将来发展打下良好的基础。下一步,就以动手制作具体内容了,题材选定,框架选定,接下来就开始往
学习dreamweaver的心得体会篇一：网页设计心得体会报告 网页设计心得体会报告 网页设计伴随着网络的快速发展而快速兴起，作为上网的主要依托，由于人们使用网络的频繁而变得非常重要。生活中我每天上网都要接触到网页，原来没有留意过网页的设计，但是经过这段时间的学习了解，现在我打开一个网页都会习惯性的先看看排版、布局和色彩运用。 通过老师的讲解和对课本的翻阅，我学习到了一些关于建设网站和制作网页的知识，对网页制作的基础知识也有了一定的掌握。通过Dreamweaver制作网页，我用到了一些基本的功能：图片插入和对齐设置；文字的格式、颜色、背景颜色的设置等。但是在自己尝试着做的时候，总是出现这里那里的问题。不是图片不能固定在自己想要的位置，就是滚动文本的显示区域不知道为什么撑过了页面，还有就是不同分辨率、不同浏览器都会对浏览网页产生影响。而且在CSS 方面，我总是不太熟悉各种代码是控制哪些东西的。除了查找解决问题我还总结了经验。例如：1、命名站点或者文件夹的的时候一定要注意，最好用相应的英语或者汉语拼音，要见名知意，如图片文件夹用image或者tu，这样可以避免页面调用时不正确的现象发生。2、调用Style时可以单击
鼠标右键选择Custon Style来调用Style标准，也可以在状态栏中的元素列表上单击右键来调用Style。虽然不同的方法达到的效果看似一样，但实际上产生的HTML代码则完全不同。在这个过程中，我同样认识到网页设计不是一门学科的独秀，而是多种课程的综合，它是Flash、Photoshop 等网页软件的综合应用。例如Flash提供了功能齐全的绘图和编辑图形工具。可以直接在编辑区里绘画，编辑修改非常灵活，它的另一大特点是“交互性”强。在动画播放时，可以用鼠标或键盘对动画的播放进行控制，可以很直观的反映出效果。页面设计应以美观、大方、简洁为原则，保持一致的风格。为了达到最佳的视觉表现效果，应讲究整体布局的合理性，使浏览者有一个流畅的视觉体验。网页最主要的功能就是给每个上网者提供一种形式，让他们能够了解网站提供的信息。要研究网页设计，就需要站在用户的角度来看。用户是一个网站成败的关键。如果用户要花很多时间进入网站，很有可能他会立即关掉网站，或者网站操作很不方便用户也会马上离开，这种网站是很失败的设计，只会让用户失望的离去。所以网页容量即包括图像在内的网页字节数最好不要超过50K。 还涉及到界面弱化的问题。一个好的界面设计它的界面是弱化的，它突出的是功能，着重体现的是网站业提供给使
《网页设计基础》教案 总学时：32 教师：贺苗苗
第一章第一节网站界面设计的认识 一、网站的主题定位 1、网站的主题选择 企业的性质决定网站的风格，企业的内容决定网站的主题。 2、网站题材选择的原则 ①主题要小而精②题材最好是自己擅长或者喜爱的内容 ③题材不要太滥或者目标太高 3、题材类别 二、页面的功能模块设计 1、网站名称（Logo） 2、广告条（banner） 3、主菜单（menu） 4、新闻（news） 5、搜索（search） 6、友情链接（links） 7、邮件和地址（mailand address） 8、版权（copyright）
首页的设计步骤：①确定首页的风格和功能模块 ②设计首页的版面布局 ③处理技术上的细节 三、网页界面设计（web interface design）------美观、用户便利、网站流程顺畅! 界面：字典上解释为两者间的界限、接点、共有连接的领域。例子：人与车直接接触的空间，方向盘（即界面）；再如：人和门，门把手（即界面）。过大过小都不好。 界面设计最重要的两点：①使用的便利性②美学的层面 四、界面设计相关用语 1、UI ( User Interface, 用户界面 ) 即使用者界面的意思。实现互动是用户界面最主要的目的。 2、HCI ( Human-computer Interaction,人与计算机的交互作用 ) 即，以人怎样做能更容易的掌握计算机的使用技术为目标，结果可以使界面技术得到飞跃和发展。 3、GUI ( Graphical User Interface,图形用户界面 ) 图形用户界面是相对于纯文本而言，通过图形构成用户与系统间的界面来实现的。 例如：在windows之前的DOS必须输入纯文本，而现在则不用。
网页设计学习心得总结网页设计培训总结 网页设计学习心得总结【一】 记得最初接触dreamweaver的时候，我很茫然，因为刚接触陌生的软件心里会很害怕跟不上老师的进程。刚开始几节课，老师讲得比较基础，还能跟得上，渐渐的老师授课的进程开始加速，有些跟不上了，需要下课后自己补上，问老师和周围的同学。渐渐的，在老师的悉心教导下，我们开始熟悉这个软件了。老师布置的第一个任务，要求做一个自我形象网站。由于学习的时间较短，老师只要求用PS做好模板即可，任务相对简单。但也要求设计感强，色彩搭配和谐，并且尽可能的做成实用又符合实际的漂亮网页。 第二个网页设计老师要求相对较高，用dreamweaver做一个比较接近真实的网页，还要做一个二级页面。于是开始收集各方面的资料。确定了主题就开始布局了。最开始使用了一个表格，然后在表格内进行拆分合并处理，接着就把通过ps处理出来一个版头并且把修改过大小的图片放进去了。 中间时预览，问题出现了，发现版头与下面的图片文字之间出现了很大的一段距离，但是在软件中已经把距离缩小为0了，多次尝试后没有效果。最后想到可以另外再加一个表格，把版头放在一个表格内面，这样问题就解决了。预览是效果还不错。但是总觉得首页
做得太普通，一次浏览学长做的网页时，觉得他们的文字滚动窗口做得效果做得不错，于是想借见一下。就决定把自己网站的左边修改修改。复制了他的代码，把上面的内容修改成我的网站需要的文字。本以为可以轻松的完成，但是却出现大问题了。 因为需要滚动的文字占的空间太大，把左边的那部分表格全部占满了，而在实际的网页预览中，这个有文字滚动的框只占了左边Oeasy教你玩转网页设计浏览的工具建站程序三分之一，左边有三分之二留白了。我就想可不可以把文字这样一层层的放在上面，试了很多方法，在网站查了很多资料，可能因为没有专业术语作为搜索的关键词，查不到任何相关的资料，试过div标签，试过不停的拆分表格，最后还是没有效果。 就这样试着试着，突然想到了层这个概念。于是在布局中点击了绘制层，结果成功了，经过一些加工，终于成功的完成左边的布局。印象还比较深刻的是插入声音，记得老师曾经给我们讲过很多次怎样插入声音，可是等到自己做网页的时候却忘记了，于是问其他人，结果居然都忘记了，于是自己在百度上收。 最后终于找到了一个可以使用的代码，但是在加入声音路径时出现了问题。在属性内加入源文件，结果就是加不进去MP3的音乐文件，然后自己就尝试加入了一个视频，记下了路径格式，然后照着这种格式写下了指向声音源文件的路径，最后成功了。在设计过程中
《HTML5+CSS3网站设计基础教程》课程教学大纲 （课程英文名称） 课程编号：201601210011 学分：5学分 学时：76学时（其中：讲课学时：47 一、课程的性质与目标 《HTML5+CSS3网站设计基础教程》是面向计算机相关专业的一门专业基础课，涉及网页基础、HTML标记、CSS样式、网页布局、变形与动画等内容，通过本课程的学习，学生能够了解网页web发展历史及其未来方向，熟悉网页设计流程、掌握网络中常见的网页布局效果及变形和动画效果，学会制作各种企业、门户、电商类网站。
二、课程设计理念与思路 课程设计理念：高职教育的集中实践教学环节需明确必要的理论知识的生化与知识层面的拓展，不能局限 于单纯的技能训练。单纯的技能训练不是提高高等职业教育的理想课程。以能力的培养为重点，以就业为导向，培养学生具备职业岗位所需的职业能力，职业生涯发展所需的能力和终身学习的能力，实现一站式教学理念。 课程设计思路：基于工作过程开发课程内容，以行动为导向进行教学内容设计，以学生为主体，以案例 （项目）实训为手段，设计除理论学习与技能掌握相融合的课程内容体系。教学整体设计“以职业技能培养为 目标，以案例（项目）任务实现为载体、理论学习与时间操作相结合”。 开发工具：DreamweaverCS6 第一章初识HTML5
第二章HTML5页面元素及属性
第四章CSS3选择器
e g o o d f o 背景与图片不透明度的设置 √ 设置背景图像平铺√ 设置背景图像的位置√ 设置背景图像固定√设置背景图像的大小√设置背景的显示区域√设置背景图像的裁剪区域√设置多重背景图像√背景复合属性√线性渐变√径向渐变√重复渐变 √ 第七章表单的应用
课堂任务快速建站技术—模板的应用 课程名称：利用模板快速建站 课时数：4 教学目标： 知识与技能：了解模板的定义，模板的可编辑区域的定义。 过程与方法：掌握在网页中创建模板的三种方法； 掌握模板的可编辑区域的定义、建立和取消； 掌握模板的应用和取消； 掌握如何将模板从网页中分离出来； 掌握使用模板快速建站； 情感与价值观：培养学生主动思考问题的习惯和自主学习的能力。 教学重点： 在DreamWeaver8中创建模板和应用模板。 教学难点： 学会模板的可编辑区域的定义、建立和取消。 教法： 任务驱动法 学法： 记录关键步骤，积极动手练习。 课前准备： 第三章第三节素材和实例，视频教程：快速建站技术－模板的应用.WMV，快速建站技术－模板的应用(快速更新).WMV。 教学过程设计： （一）导入设计： 我们制作一个网站时，会发现许多网页的版面和元素都是相同的，在设计一个新页面时，我们还可以用复制原来做过页面来减轻工作量。但是如果一个网站有几十、上百张页面都基本相同，这时修改或更新网页的共同元素如网站标志时，会发现工作量实在太大！而使用Dreamweaver 软件中的模板功能来创建新网页，可以大大提高更新和修改的工作效率，网站的维护工作会轻松很多。本节主要内容如下。（二）新课讲解设计： （1）请学生带着以下问题阅读P110～115知识预读，问题如下： A、模板的定义？ B、模板创建的三种方式？了解资源面板的使用方式。 C、学会模板的可编辑区域的定义、建立和取消； D、学会模板的应用和取消； E、学会如何将模板从网页中分离出来； （2）教师提问，请学生一一回答以上问题。期间对回答问题的同学要多多表扬，如“你真棒”。增强学生对教师的亲和力。 （3）教师在学生回答问题的同时，总结评价并补充相关要点。 （4）教师展示完成后的模板网站作品，与学生共同讨论分析该网站制作过程。 （5）教师演示建立模板,创建可编辑区域,应用模板等部分操作（详见教材任务一）。
网页制作基础知识教案 教学目标： 了解网页的组成元素及常用的网页制作工具。了解网页制作的一些基础知识，如网站和网页的区别、网页的类型、网页的构成元素等，然后在了解的基础上再通过练习来巩固。 教学重点难点： 在深刻了解概念的基础上把理论转化成实际的应用。 教学过程： 在制作网页之前，首先要了解一些关于web网页的基本知识，了解一下构成一个网站的基本元素等。 网页的基本元素 文本：基本组成部分 图像：更加直观准确地表达某些信息，并且可以起到美化网页，吸引读者注意力的作用 超链接：可以方便地转入其他网页进行浏览。 网页的其他元素：音乐表格表单 美化网页，丰富网页的内容，增强网页的功能。 网页的实质 网页相当于刊物中所发表的一篇篇文章，但与纸上的文章相比，它增加了多媒体信息和网上交互的功能。 网页的实质 = 表格+文本+图片+动画+声音+超级链接+…… ◆网站相当于发行到全世界的期刊。 ◆网站的实质 = 服务器上的文件夹 ◆主页相当于期刊的封面。 ◆主页的实质 = 打开网站的第一个网页 网页和网站的分类 从网页是否执行程序来分，可分为静态网页和动态网页这两种类型。 什么是静态网页、动态网页? ◆所谓静态网页，指的是网页从服务器传到客户端时，网页的内容是“固定 不变”的，也就是说，服务器只是把所存储的网页的内容原封不动直接传递给客户端浏览器，这种网页一般是标准的HTML代码。 静态网页一般以.htm或.html为后缀结尾的，俗称html文件。本课程就是制作静态网页的课程。 ◆所谓动态网页，它在由服务器传递给客户端的时候必须由服务器把它转换 成相应的HTML格式，而且会根据用户的要求和选择在在服务器端做出相应的改变和响应。 动态网页一般要用专门的脚本语言编写，如ASP、https://www.doczj.com/doc/8518674325.html,、PHP、JSP等等
教改学习心得体会 BY01061班 16号王建云 本学期的网业设计课程，开展了动态思维训练教学活动，对于我们学生来说，可以激发学习兴趣，调动学习的自觉性，自己动脑、动手，动口，运用网络资源，结合教材及老师的指导，通过自身的实践，创作出积聚个人风格、个性的个人网页。总体来说，整个学期的学习过程，我学会了很多知识，虽然过程比较艰辛，但在INTENET领域中，有了一个展示自我的空间，我觉得很开心、很有成就感。 一.充分发挥动手能力 作为网页设计的初学者，我对网页设计非常感兴趣，一心想设计出一个美观、实用、内容丰富的个人网页。本学期的教改方案由以前学生单纯接受知识变为主动参与教学活动。在这样的压力和动力下，通过自己动手、动脑，通过网络资源，老师的指导，在不断发现问题和解决问题的过程中学到了很多知识，也增强了我的创作能力和动手能力，在网页设计过程中，从构思到设计、完善、维护，整个过程我都全身心投入，使我真正学到了网页设计的知识。 二.在设计过程中不断提高网页设计水平 在本次网页设计中，我不仅学到了很多关于网页设计方面的知识，也从中学会了关于网络、编程等方面的知识。我从最初开始运用FrontPage设计网页，到后来运用Dreamweaver、Flash、Fireworks等网软件设计网页，完善网页。在这个过程中，我通过自学教材、上网查询，学习了Dreamweaver、Flash、Fireworks 等网页软件的应用，学会了管理、维护自己的站点，以及一些简单动画、控件的制作等等。在设计过程中也出现了很多的问题，但通过看书，上网查询，请教老师等方式，不断的学习、解决、提高，设计出的网页不论是外观还是内容，都在不断的进步、改善。可以说在自己动手，不断实践的过程中，网页设计水平得到了很大的提高。 三.不足之处 由于平时工作比较繁忙，学习时间比较少，对于网页设计软件的强大功能运用得还不够。在网页设计过程中，由于没有网页制作代码的知识，所以在设计时
学习网页设计心得体会 现在，计算机和网络已经深入到了我们生活中的方方面面，也已经成了生活中不可缺少的一部分。你知道学习网页设计心得体会是什么吗?接下来就是小编为大家整理的关于学习网页设计心得体会，供大家阅读! 学习网页设计心得体会篇【1】 本学期的网业设计课程，开展了动态思维训练教学活动，对于我们学生来说，可以激发学习兴趣，调动学习的自觉性，自己动脑、动手，动口，运用网络资源，结合教材及老师的指导，通过自身的实践，创作出积聚个人风格、个性的个人网页。总体来说，整个学期的学习过程，我学会了很多知识，虽然过程比较艰辛，但在intenet领域中，有了一个展示自我的空间，我觉得很开心、很有成就感。 一.充分发挥动手能力 作为网页设计的初学者，我对网页设计非常感兴趣，一心想设计出一个美观、实用、内容丰富的个人网页。本学期的教改方案由以前学生单纯接受知识变为主动参与教学活动。在这样的压
力和动力下，通过自己动手、动脑，通过网络资源，老师的指导，在不断发现问题和解决问题的过程中学到了很多知识，也增强了我的创作能力和动手能力，在网页设计过程中，从构思到设计、完善、维护，整个过程我都全身心投入，使我真正学到了网页设计的知识。 二.在设计过程中不断提高网页设计水平 在本次网页设计中，我不仅学到了很多关于网页设计方面的知识，也从中学会了关于网络、编程等方面的知识。我从最初开始运用frontpage设计网页，到后来运用dreamweaver、flash、fireworks等网软件设计网页，完善网页。在这个过程中，我通过自学教材、上网查询，学习了dreamweaver、flash、fireworks等网页软件的应用，学会了管理、维护自己的站点，以及一些简单动画、控件的制作等等。在设计过程中也出现了很多的问题，但通过看书，上网查询，请教老师等方式，不断的学习、解决、提高，设计出的网页不论是外观还是内容，都在不断的进步、改善。可以说在自己动手，不断实践的过程中，网页设计水平得到了很大的提高。 三.不足之处 由于平时工作比较繁忙，学习时间比较少，对于网页设计软件的强大功能运用得还不够。在网页设计过程中，由于没有网页制作代码的知识，所以在设计时也遇到了很多麻烦，有时插入一
《网页设计与制作》课程教案 一、课程定位 本课程是计算机应用技术专业的一门专业基础课程，该课程的学习能够提升他们对网页制作的兴趣，让他们学习网页制作的基本技能，为后继课程打下基础，同时扩展其就业面，为就业做好准备。 本课程的目的和任务是让学生学会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制作各种超级链接
网页制作的教学设计 一、教学目标 1 、知道站点、主页的概念，能在指定位置建立只有一个网页的站点； 2 、认识FRONTPAGE 的界面； 3 、掌握在主页中插入文字、图片、水平线； 4 、掌握页面文件与图片的保存。 二、教学重点 1 、能在指定位置建立只有一个网页的站点（难点） 2 、能在页面中插入文字、图片、水平线 3 、掌握页面文件与图片的保存（难点） 三、学情分析 学生已经学习了WORD 、POWERPOINT 与上网浏览信息，对计算机的基本操作（WORD 中文档的编辑，网页的浏览等）比较熟练。这使得学生主动探索、自主学习成为可能。每位学生必须完成基本任务，有能力的学生还可以完成提高篇的学习，以充分发挥学生的积极性与自主性。 四、教学方法 在教学中，一方面采用比较教学的方法，促进学生知识的迁移；另一方面，提供学生一个导学课件，让学生根据这个网络环境下的课件自己探索学习，以满足不同层次学生的需求。 五、教学过程设计 教师活动：1 、引入课题：（激发兴趣，活跃气氛） 同学们喜不喜欢上网？经常上新浪、西祠胡同等，有没有同学知道新浪、西祠胡同称做什么？（网站） 浏览新浪网站，浏览的第一个页面称为什么？（主页） 我们还可以浏览其它的页面，点击超链接浏览，当鼠标变成手指的形状时有超链接。 问题1 ：网站是不是就是网页？用自己的语言描述一下网站的概念（网站包含多个网页，
通过超链接把不同的页面链接起来） 问题 2 ：网页是不是就是主页？( 第一个页面称为主页, 网站设计者可以确定哪一个是主页, 主页的文件名一般为：index.htm, 主页也是网页) 设计网站一般必须经过两个步骤，首先是在计算机里做好，然后发布在internet 上，让所有的人访问浏览。 今天我们学习用Frontpage 建立站点，制作一个主页。 先来研究一下没有发布的网站, 打开教师做的网站 问：同学们看到了什么？（文件夹） 总结： 可以这样理解网站：在资源管理器里，网站表现为一个文件夹，里面存放的是所有与网站相关的文件。 打开主页，浏览页面，这是老师做的一个导学课件，将帮助大家完成学习任务。 请学生浏览教师课件，了解学习任务 2 、新建站点 FP 的启动 问：与word 比较，有什么不同？ （增加了视图区，编辑区有三个窗口） 总结： 视图区：多种视图模式是为了方便网站的管理。制作网页时，必须在网页视图中编辑页面 普通窗口：鼠标在闪动，可编辑、修改页面，所见即所得的方式 预览窗口：浏览器中出现的效果，与PowerPoint 中的“放映幻灯片”类似。 Html 窗口：编写HTML （超文本标记语言，它是描述网页内容和外观的标准。） 打开导学软件，根据步骤，示范建立只有一个网页的站点，强调新站点的位置、路径的正确输入，站点的名称。
网页设计学习心得 转眼间，已到了期末，学习网页设计这门课程也要结束了，虽然时间有点短，但是学过这个几周以后我受益匪浅。 记得最初接触dreamweaver的时候，我很茫然，因为刚接触陌生的软件心里会很害怕跟不上老师的进程。刚开始几节课，老师讲得比较基础，还能跟得上，渐渐的老师授课的进程开始加速，有些跟不上了，需要下课后自己补上，问老师和周围的同学。渐渐的，在老师的悉心教导下，我们开始熟悉这个软件了。老师布置的第一个任务，要求做一个自我形象网站。由于学习的时间较短，老师只要求用PS做好模板即可，任务相对简单。但也要求设计感强，色彩搭配和谐，并且尽可能的做成实用又符合实际的漂亮网页。 第二个网页设计老师要求相对较高，用dreamweaver做一个比较接近真实的网页，还要做一个二级页面。于是开始收集各方面的资料。确定了主题就开始布局了。最开始使用了一个表格，然后在表格内进行拆分合并处理，接着就把通过ps处理出来一个版头并且把修改过大小的图片放进去了。 中间时预览，问题出现了，发现版头与下面的图片文字之间出现了很大的一段距离，但是在软件中已经把距离缩小为0了，多次尝试后没有效果。最后想到可以另外再加一个表格，把版头放在一个表格内面，这样问题就解决了。预览是效果还不错。但是总觉得首页做得太普通，一次浏览学长做的网页时，觉得他们的文字滚动窗口做得效果做得不错，于是想借见一下。就决定把自己网站的左边修改修改。复制了他的代码，把上面的内容修改成我的网站需要的文字。本以为可以轻松的完成，但是却出现大问题了。 因为需要滚动的文字占的空间太大，把左边的那部分表格全部占满了，而在实际的网页预览中，这个有文字滚动的框只占了左边Oeasy教你玩转网页设计浏览的工具建站程序三分之一，左边有三分之二留白了。我就想可不可以把文字这样一层层的放在上面，试了很多方法，在网站查了很多资料，可能因为没有专业术语作为搜索的关键词，查不到任何相关的资料，试过div标签，试过不停的拆分表格，最后还是没有效果。就这样试着试着，突然想到了层这个概念。于是在布局中点击了绘制层，结果成功了，经过一些加工，终于成功的完成左边的布局。印象还比较深刻的是插入声音，记得老师曾经给我们讲过很多次怎样插入声音， 可是等到自己做网页的时候却忘记了，于是问其他人，结果居然都忘记了，于是自己在百度上收。最后终于找到了一个可以使用的代码，但是在加入声音路径时出现了问题。在属性内加入源文件，结果就是加不进去MP3的音乐文件，然后自己就尝试加入了一个视频，记下了路径格式，然后照着这种格式写下了指向声音源文件的路径，最后成功了。在设计过程中还出现了很多的问题，但通过看书，上网查询，请教同学等方式，不断的学习、解决、提高，设计出的网页不论是外观还是内容，都在不断的进步、改善。可以说在自己动手，不断实践的过程中，网页设计水平得到了很大的提高。热情和执着，我将来设计出的网页会更加专业，更完善。
从新学期开始接触网页设计这门课程以来，已将近学习了一个学期。经过这么长时间的学习，从起初对网页设计的一知半解，到如今已基本掌握网页制作的基本技能，可谓获益良多。作为一门新接触的学科，之前并没有太多的了解，只知道在计算机迅猛发展的今天，网页已成为网络世界中必不可少的一环，网民对于网页的要求也越来越高，因此，学好网页设计这门技术，对于生活在日后计算机主导的世界来说，显得更加重要了。 大作业展示中的网页作品主题明确、布局合理、页面设计得当，方便浏览的人找到想获取的信息。任何一个优秀的网站都有其明确的主题, 网站主题的确立应根据网站的用途而定。整个网站需要围绕这个主题,也就是说，在网页设计之前，我们要明确这个网站的建立目的,用来做什么，围绕着这个主题和内容来制作网站所有的页面。明确对网页的制作有着很重要的作用。 作品网站“web”中合理运用了网站制作的几个基本技术来构建。首先使用了DIV标签来布局网页，简单方便。DIV标签可以设置一个规定的属性，用于设定表格、画、字规格大小或摆放位置，在网页制作中使用，可以大大减少我们对表格、画、字等的设定工作量，大大提高我们制作网页的效率。同时，也方便我们在完成网页后对部分细节的修改。 作品中的网站外观简洁大方，界面友好易懂，是网页制作初学者的优秀模版。例如网页的布局，素材的管理，代码的简化等等，都可以从中得到许多启发和借鉴意义。目前通过这学期以来老师的悉心教导和学习，已基本掌握网页制作的基础知识。而有关网页内容的设计与编排，还有待更多的实践操作来提高。总的来说，已对网页的制作有一定的认识和基本的了解。从目前学习的进度来看，个人认为老师还可以教授我们“行为的应用”和“基础动态网页”等知识，拓展我们制作网页的知识。在个人的网站建设中，希望加入运用更多更高级的技术来呈现和表达自己网站的主题和内容。例如设计网页中的一些动作和事件，以此来达到更好的表达效果。 网站的文件管理、素材存放等安排得合理得当，规范有序。文件夹的命名大多使用所用素材名称的拼音，一目了然，见名知意，方便学习者的查询与研究。这种严谨和规范的做法值得日后建设自己的网站时参考和借鉴，对于网站制作的初学者来说具有指导意义。 其次网页在表头下运用了导航菜单。导航菜单是网页设计中不可缺少的重要部分，它提供了页面与页面之间跳转的通道，极大方便了浏览者访问所需的内容。利用它，我们可以快速找到我们想要浏览的页面。学习更多导航菜单的制作，可以优化我们的网页页面，使其更加完善，也能增加美观程度。 完成大作业需要事先精心的构思和素材的准备，从一开始网页主题的确定，到主页总体的设计、搜集资料、每个分页面的设计等，我都要一一进行规划，因为如果不规划好，制作过程中就会没有整体思路，网站就会显得缺少整体性，而且不能连贯地制作下去，难以一气呵成。定下框架之后，然后就开始一步一步有条理，有次序地做起来。制作过程中，为了提高工作效率，减少工作时间，还可以利用制作一个网页模版来减少工作量。由于一个网站中大多网页采用相同的表头和底部，仅仅内容有所不同，因此可以通过制作模版来填充多个网页内容，一次来提高网站制作效率。 网页制作过程中需用到最基本的软件如Dreamweaver、Photoshop。Dreamweaver可以帮助我们快速构建一个初步的网站，之后再在此基础上填补和完善，便可以构建一个完整的网站。Photoshop可以帮助我们快速处理建设网站中所需要用的所有图片素材，修改成我们想要的模样，包括对素材大小、尺寸、美化等处理。若想进一步完善和更好地呈现网站内容，还可以利用Flash软件制作一些相关的小动画和动态图片。由于良好的视觉效果，Flash已被大多数网站广泛应用，借此大大增加网页的艺术效果。 任何一门学科的学习都需要我们多加练习实践，才能驾轻就熟，真正掌握这门学科。由于网页设计这门课程的课较少，老师需要在课堂上传授重点知识，因此课堂的实践操作时间