Fireworks与Dreamweaver的结合使用.docVIP

Fireworks与Dreamweaver 的结合使用 Fireworks是macromedia公司专为网页设计而开发的图像处理软件，它与可视化网页开发工具Dreamweaver之间可以紧密地结合，从而使网页设计师在设计和制作网页的过程中可以对页面进行统一的规划，图形和Web发布之间保持高度的协调,使网页设计更加得心应手。 在Dreamweaver4中将Fireworks4设置为图像编辑器在您使用Dreamweaver进行网页设计的时候，也许会需要根据页面布局的需要，对网页中的图像重新进行编辑和调整，如果在以往，就需要先打开图像处理软件然后找到要编辑的图像，修改后存盘，再返回到网页编辑软件中重新插入图像。但是现在结合使用Fireworks与Dreamweaver就不必如此麻烦，您可以直接在Dreamweaver4中调用Fireworks，进行图像编辑，完成编辑以后，会自动更新。 要使用这个功能，首先要把Fireworks4设置为Dreamweaver4默认的图像处理软件，使用Dreamweaver的 Preferences（属性）设置对话框可以完成这个设置，如果希望在Dreamweaver中调用Fireworks对GIF、JPEG、PNG着几种格式的图像进行编辑，就需要将这几种格式的图像编辑器都设置为Fireworks4。 具体的操作步骤是这样的： 在Dreamweaver4中，使用菜单命令EditPreferences，显示Preferences对话框。对话框左边Category（类别）列表中选择File Types/Editors（类型/编辑器）选项，对话框的右边就会显示出相应的选项在对话框右边的Extensions（文件扩展名）列表中，选择一种网络图像格式例如gif。在Editors(编辑器)列表中，选择Fireworks 4，并且点击 Make Primary按钮将Fireworks设置为主编辑器。同样的重复以上的步骤，将gif、jpg 和png格式的图像的编辑器都设置为Fireworks4。设置完后，点击OK按钮退出。 经过以上的设置，在Dreamweaver4中如果有图像需要编辑，就可以选择这个图像然后单击Property（属性）面板中的Edit按钮，Fireworks4就会自行启动。如果当前选择的图像是GIF或是JPEG格式，而不是PNG格式，Fireworks4还会询问是否要处理独立的源文件，如果单击YES，就可以选择某个PNG源文件进行处理了。当图像文件在Fireworks4中按要求修改完后，点击文档左上角的Done按钮。修改后的图片被保存，并且会自动在Dreamweaver4中完成更新。 二、在Dreamweaver中插入Fireworks所生成的Html文件使用Fireworks可以进行一个完整的页面布局设计，并产生网页交互效果，最后在Fireworks中输出一个Html文件，在Dreamweaver中可以插入Fireworks的HTML文件。Fireworks的HTML文件中包括了关联的图像链接，切片信息，和javascipt脚本语言。 打开dreamweaver，使用菜单命令Insert-Interactive Image-Fireworks HTML（插入-交互式的图像- Fireworks HTML）或是打开Object（对象）面板，单击Common（常用）类型中的Insert Fireworks HTML （插入Fireworks HTML）按钮 ，这时会弹出一个对话框。在对话框中单击Browser按钮，选择要插入的Fireworks生成的Html文件。 下面有一个Delete File After Insertion（插入后删除Html文件）的选项，如果选中这个选项的话，在插入后就会将Fireworks所生成的Html文件删除，但是并不会影响到原始的Png文件。点击Ok确认后，就可以将所有的Html代码插入到Dreamweaver中，包括所关联的图像，切片和JavaScript代码。三、在Dreamweaver中启动Fireworks优化图像在Dreamweaver中可以快速调用Fireworks的图像输出设置功能，而不必打开整个Fireworks。Fireworks的图像输出设置功能提供了诸如图像格式设置，优化属性设置，动画属性设置，文件大小设置等非常简洁和使用的图像输出处理功能，可以随时对图像进行一些调整，以适应网络传输的需要。 在Dreamweaver中，选择希望处理的图像，选择菜单 Commands - Optimize Image in Fireworks。如果弹出对话框，确认是否调用源PNG图像进行修改。在Fireworks的输出设置对话面板中，设置图像优化属性，并且