首先给站点起个名字叫做“zy的站点“执行[站点][管理站点]菜单命令，或者右侧[文件]功能面板下的[文件]选项卡中，单击[管理站点]超级连接，在弹出的对话框，单击[新建]按扭
，选择[站点]命令。
屏幕上出现了站点定义的对话框，在[高级]选项卡，鼠标选中“本地信息“然后在站点名称中输入”zy的站点“，在”本地根文件“中选择”c:\zy“.,默认图象文件选择”c:\zy\image\“然后单击[确定]按扭。
 
首先进入视图，鼠标电击“设计”，就可以合理布局网页。
选择[查看]/[表格模式]/[布局模式]，或在[插入]面板中选择[布局]项，然后单击[布局]按扭，将标准模式切换到布局模式。这时，dreamweaver mx 2004会弹出[从布局模式开始]对话框，单击[确定]按扭就进入了布局模式，也可以选择“不要再显示此消息”复选项，让这个对话框在下次切换时不再出现。
进入[布局]模式后，单击[布局表格]按扭，然后拖动鼠标就能绘制出一个布局表格，可以在布局表格的[属性]面板中精确设置布局表格的宽和高。例如我做的首页面设置的[宽为]修改为800像素，[高为]修改为1000像素。

当要制作大量布局一致的网页时使用模板是最好的方法。模板最强大的用途之一在于一次更新多个页面，从模板创建的文档与该模板保持连接状态。可以修改模板并立即更新基于该模板的所有文档中的内容。
 模板是网页中“固定的”页面布局。可以在模板中创建可编辑区域。
首先打开一个已经存在的网页然后执行[文件]/[另存为模板]命令。这时会弹出[另存外模板]对话框。从[站点]下拉列表框中可以选择一个用来保存模板的站点，这里选择默认的站点，然后在[另存为]文本框中为模板输入一个唯一的名称，仍然用它的默认值index，最后单击[保存]按扭，然后会跳出一个要求更新连接的对话框，单击[是]按扭即可。Dreamweaver会将模板文件自动保存在站点根目录中的templates文件中，文件的扩展名是.dwt。如果Templates文件夹在站点中不存在，Dreamweaver会在保存新建模板自动创建该文件夹。
 在要插入可编辑区域的单元格内单击一下，选中这个单元格，在[常用]工具拦中，单击[模板]按扭右侧的下拉按扭，在弹出的下拉菜中选择[可编辑区域]项。
这时会弹出[新建可编辑区域]对话框。在[名称]文本框中为该区域输入唯一的名称。可编辑区域在模板中由高亮显示的矩形边框围绕。该区域左上角的选项卡显示区域名称。

如果已经将模板文件的一个区域标记为可编辑，而现在想要再次锁定它，使它在基于模板创建的文档不可编辑，可以先单击可编辑区域左上角的选项卡选中它。然后执行[修改]/[模板]/[删除模板标记]命令，就可以删除这个可编辑区域。这样该区域不再是可编辑区域了。当然也可以在选中可编辑区域后，按Delete键删除所选的可编辑区域。
 更改可编辑区域的名称，插入的可编辑区域可以更改它的名称。首先单击可编辑区域左上角的选项卡选中它，然后在[属性]面板中[名称]文本框中输入一个新名称，最后按 Enter键使所做得修改生效
 模板修改后执行[文件]/[保存]命令，系统会弹出一个更新使用模板文档的对话框。单击[是]按扭，就可以更新所有基于该模板创建的网页了。更新完毕后会弹出[更新页面]对话框中。
 模板制作完成后，就可以创建基于该模板的网页了。执行[文件]/[新建]命令，弹出[从模板新建]对话框，单击[模板选项卡]。
 难点分析，编辑基于模板的页面。Dreamweaver为基于模板的文档指定了锁定区域（不可编辑区域）和其他可编辑区域，当我们要把鼠标指针放到不可编辑的区域内时，鼠标指针会变成禁止标志，表示不可以对该区域进行编辑。我们只能在可编辑区域内对该文档进行编辑，首先选中可编辑区域内的文本并删除，然后就可以在可编辑区域内对网页进行任意的编辑了。不用担心可编辑区域很小，在可编辑区域内插入网页内容后；可编辑区域将会自动撑大，我们可以在可编辑区域内插入一个表格来试验下，首先把光标定位在可编辑区域内然后单击[常用]工具栏上的[表格]按扭，插入一个3*3的表格，并调整表格大小，可以看到可编辑区域会自动被表格撑大.

做完后 ，执行[文件]/[保存]命令保存即可。

最后、对网页进行了测试，经测试，在IE5.0以上浏览器中显示正常，较适用于1024*768的分辨率下显示效果较好。
模块小结；这次的网页设计是对我的一个实践过程，Dreamweaver的用户界面令人耳目一新，它的操作跟她的排版软件差不多，选种一个对象后，出现相关参数面板，修改对象的属性即可。并且我掌握了正确的操作步骤和方法，

FIREWORKS是Macromedia公司推出的图像处理软件，与其他图形处理软件的设计思想都很相似，但它又有很多自己的特色。FIREWORK是一个人完全为

网页制作者设计的图形处理软件，对制作基于网络的图形有特殊的支持，能够自由的导入导出各种图像。FIREWORK作为第一款为网络实际而开发的图像处理软件，能够自动切图，生成鼠标动态感应的JavaScript。而且FIREWORK具有十分强大的动画功能和一个几乎完美的网络图像生产器。FIREWORK可以轻松辨认矢量文件中的绝大部分标记以及Photoshop文件的层。
 简单介绍FIREWORKS之后，我们还必须先弄明白矢量图和位图的感念。
矢量图是以路径定义形状的计算机图形，矢量路径的形状由路径上绘制的点确定。矢量图的填充占据路径内的区域。位图是由称为像素的小正方形组成的图形，这些小正方行就像马赛克中的瓷片那样拼合在一起而形成的图象。扫描的图象以及用位图绘画程序（如photoshop）创建的图形都属于位图图形，也被称为栅格图象。矢量图拉大后不失真，但位图拉大后会失真。
 在fireworks中检验一幅图是矢量图还是位图的方法：100%视图显示状态下拉大图形，看会不会变模糊，图象拉大后变模糊的是位图，反之是矢量图：或者用[部分选定工具]选取该图后，如果是位图则在[属性]面板左上角处会显示“位图”
二字，其他全部是矢量图。
 FIREWORKS的特色
FIREWORKS是目前网页图象处理最好的工具，具有许多其他软件不可比拟的优势。
1， 矢量图与位图两种编辑方式共存，而且功能都十分强大方便。远远领先同类软件。
2， 显示方式是以像素方式显示，不像其他矢量软件只有消锯齿显示，再加上fireworks自身独特的元件功能，使fireworks很适合做像素图之类的作品。
3， 由于引入帧和图层协作的理念，使得制作GIF动画时分工更明确，制作更简
单。
4，具有其他软件没有的元件和帧结合的概念，制作互动按扭很方便。
5新增的智能多边形系列功能使FIREWORKS MX 2004的矢量处理日臻完善。
6，逐渐成为作为排版设计的先锋，先设计出整个排版画面，再直接导出Html到Dreamweaver中，通过和Dreamweaver的经典结合实现排版功能并保持和Fireworks原设计页面完全一致的外观。

FIREWORKS的绘图工具主要都集中在“工具条”上，利用这些工具可以绘制出各种图形，并可以为其设置相应的属性，如颜色，大小，位置等
下面介绍一些操作技巧：
1， 绘制圆形或方形时，按住shift键可以绘制出正方形或正圆形。
2， 在缩放图形尺寸时，如果按住Alt键，则将以图形中心为缩放中心进行缩放。
3， 水平，垂直，45度移动对象时，先移动，再按shift键，然后放手即可。
4， 鼠标复制对象时，先移动，再按alt键，然后放手即可。
5， 按Ctrl键可临时切换到[指针]工具，并可以执行移动，缩放操作，放开Ctr键回当前工具。
6， 按空格键可临时切换到手形工具，并可以滚动画面的操作，放开空格键停止手形工具。
7， 位图选区技巧：增加选区的方法是先做出一个选区，然后按住shift键的同时，再次使用选择命令：减少选区则按alt键，取相交部分选区的方法是同时按住shift和alt键，再使用选择命令，取消选择ctrl+D.
8， F8：将对象转换成元件。
9， Ctrl+shift+V:粘贴于容器内，制作矢量蒙版。
10．Ctrl+shift+alt+V:粘贴属性
11．对象A要粘贴到对象B前面，只需选中对象A，按Ctrl+x或Ctrl+C,再选择对象B，按Ctrl+V即可
12．属性面板的显示/隐藏快捷分别是ctrl+f2和ctrl+f3。
难点分析；矢量图绘制的操作步骤：
步骤一 用鼠标单击工作窗口左边德望[工具]面板中的[矢量]部分的 [矩形]工具按扭并按着一会，接着从弹出的工具组中选择[椭圆]工具，按住shift键不放手，在页面上画出一个很小的正圆形。
步骤2 再画出一个小的圆来，在100%下的状态看，就会恢复正常。
步骤3 对期两个圆，先全选两个圆，然后执行[修改]/[对齐]/[水平居中]菜单命令。再执行[修改]/[对齐]/[垂直居中]菜单命令。
步骤4 执行[修改]/[组合路径]/[打孔]菜单命令，两个圆就结合成一个一环形了。在这个环形中用同样的方法画两个圆，并对齐，打孔做成环形。
步骤5 然后为这个环形上色。选中这个环形，在[属性]]面板中先取消它的笔触色彩。接着为这个环形上渐变色。
步骤6 为了逼真一些，用[属性]工具画出一个封闭形状，来为这个环形打孔。

模板小结；在进行网页设计和制作时，图象的处理与动画制作又是一个重要的环节，它决定了网站风格以及成败。FireWorks是网页图象处理和动画制作中最重要的工具。

Flash mx 2004是Macromedia公司推出的，该版本在原来版本的基础上改进了不少，使得用户制作动画更加方便。
运行falsh mx 2004,首先进入眼帘的是操作的“开始”页面。页面中列出了一些常用的任务，左边是打开最近用的项目，中间是创建各种类型的新项目，右边是从模板创建各种动画文件。单击[创建新项目]下的[falsh文档]，这样就创建了一个新的动画文件。Flash的工作界面由几大部分组成，最上方的是“主菜单栏”；执行[窗口]，[工具栏，[主工具栏]]命令。可在“主菜单栏“下方打开‘主工具栏“：主工具栏的下方是”文档选项卡“，用于切换打开的当前文档：”时间轴和“舞台”位于工作界面的中心位置。左边是功能强大的“工具箱”，用于创建和修改图形内容：多个“面板”围绕在“舞台”下边和右边，包括常用的[属性]，[动作]，[帮助]面板，还有[设计面板]和[开发面板]。
在falsh的作品中，我们常常看到很多绚目神气的效果，而其中不少就是用最简单的“遮罩”完成的，如水波，万花筒，百叶窗等。遮罩动画是flash中的一个很重要的动画类型，很多效果丰富的动画都是通过遮罩动画来完成的。在flash动画中，“遮罩”主要有良种用途，一个作用是在整个场景或一个特定区域，使场景外的对象或特性区域外的对象不可见，另一个作用是遮罩住某一元件的一部分，从而实现一些特殊的效果。
例如我所做的欢迎动画，就是遮罩动画。
步骤一 创建影片文档
执行[文件] [新建]命令，在弹出的对话框中选择[常规][falsh 文档]选项后，单击[确定]按扭，新建一个影片文档，在[属性]面板中设置文件大小为550像素*400像素，[背景色]为黑色
步骤2 创建元件
执行[插入][新建元件]命令，新建一个图形元件，名称为“欢迎光临”，单击工具箱中的[文本工具]A按扭，在场景中输入“欢迎光临”，在[属性]面板中，设置文字参数。
选中字体，执行两次[修改][分离]命令，把字体打散，再选择[颜料桶工具]按扭，把字体中心填充成红色。
执行[插入][新建元件]命令，新建一个图形元件，名称为“辉光”。执行[窗口][设计面板][混色器]命令，打开[混色器]面板，设置[填充样式]为线性，将三个字体全部设置为白色，第一个和第三个色标全都设置为白色，第一个和第三个的[alpha]值为零，中间则为74%，设置完成后，在场景中画一个无边矩形，大小为40像素*230像素
步骤3 创建动画
单击时间轴上右上角的[场景1]按扭，切换到主场景。
1， 创建[底层文字]层
将[图层1]重新命名为[底层文字]。
从库里把“欢迎光临”的元件拖到场景中，在第60帧出添加普通帧。这一层起显示文字的作用。
2， 创建遮罩层
新建一个[辉光]图层，从库里把“辉光”元件拖到场景中，放在“欢迎光临”元件实例的左边。选择工具箱中的[任意变形工具]按扭，单击[]选项中的[旋转与倾斜]按扭，将鼠标放在“辉光”元件实例的任意一个角，拖动鼠标旋转一定的角度，使“辉光“元件实例产生一定的倾斜度，在第30，60帧处添加关键帧，在第30帧处把”辉光“元件实例拖到”欢迎光临“元件实例的右边，在第1帧和第30帧处建立动作补间动画。
3， 创建遮罩层
新建一个[遮罩]图层，复制[底层文字]层第1帧中的元件实例，选择[遮罩层]的第1帧执行[编辑][粘贴到当前位置]命令，用鼠标右键单击[遮罩层]，选择[遮罩层]，设置此层为遮罩层。
这一层的作用是用字体做遮罩元素，用它来控制辉光在场景中出现的大小和位置。到此整个动画已经制作完成，可以测试效果。