网页设计实用教程第章使用Fireworks制作网页图片_-公开课件（讲义）.pptVIP

* 第11章 使用Fireworks 制作网页图片 制作人：曾俊国 重点与难点 了解网页图像的格式 掌握对网页图片的各种常见操作 掌握处理矢量对象的方法 位图图像处理 11.1 开发Web应用的准备工作 Fireworks CS4是最新的图像处理软件，其功能强大，已超出了单纯的图像处理功能，很多网页制作软件的功能它都具有。在工作界面上与Dreamweaver CS4相似，都采用了人性化的设计环境，大大简化了网络图像设计的工作难度，无论是专业人士还是业余设计工作者，使用Fireworks CS4都能轻松地制作出与具体网页匹配的图像。 11.1.1、网页图像的格式 GIF(Graphics Interchange format)图片 JPEG(Joint Photograhic Experts Group，联合图像专家组)图片 PNG(Portable Network Graphic Format，流式网络图形格式)图片 11.1.2、 Fireworks CS4的工作界面及新增功能 （1） Adobe AIR创作新增功能 ( 2 ) PDF导出新增功能 （3） 可自定义、重用的资产增强功能 （4）. 全新的用户界面 （5） 增强的字体处理功能 （6） 增强的样式面板功能 （7） 工作区的改进 （8） Adobe Kuler集成功能 （9） Adobe ConnectNow集成新增功能 11.1.2、 新建文档 使用菜单“文件”中的“新建”命令，将弹出如下图所示的“新建文档”对话框，该对话框自动保持与在上次创建文档相同的设置，调整好各项参数后单击“确定”按钮，随即可建一个新的PNG格式文件。 11.1.3、 使用标尺、网格和辅助线 单击“视图”菜单中的“标尺”选项，可在文档窗口中显示或隐藏标尺；同样选中“视图”菜单中的“网格”选项，可在文档窗口中显示或隐藏网格、编辑和对齐网格。网格颜色和网格大小可以根据需要重新编辑设定。打开标尺显示后，将鼠标指针移至水平标尺或垂直标尺单击并拖动鼠标，可创建水平或垂直辅助线。如果要调整辅助线，单击工具箱中的工具按钮，将鼠标指针靠近辅助线，当鼠标形状变为上下箭头或左右箭头时，按下鼠标左键拖动。若将辅助线拖出画布区域，则辅助线被删除。 在了解了Fireworks CS4相关基础知识之后，通过一个网站的LOGO标志图片的制作过程，讲解利用Fireworks CS4设计制作图形图像的一般步骤。 11.2 案例剖析：一个网站的LOGO图片制作 11.2.1、选择对象 在Fireworks CS4中，可以使用以下选择工具：“指针”工具，单击该工具后再单击一个对象可选中一个对象，或在一定区域内拖动鼠标左键，可将该区域内的多个对象选中。“部分选定”工具按钮，主要用于选择和移动路径，修改矢量对象上的节点，或选择组内的某个对象。“选择后方对象”工具用于选择被其他对象隐藏或遮挡的对象，该按钮与“指针”工具重叠在一起，通过单击其下方的箭头可实现二者的相互切换。“导出区域”工具用于选择要导出为单独文件的区域，同样，该按钮与“裁剪”工具按钮重叠在一起。 选择“指针”工具，将鼠标移动到要选取的对象上，单击选择该对象。选择多个对象的方法，除了前面提到的用鼠标框选，还可以先选择一个对象后，按住“Shift”键，继续单击其他要选择的对象。通过“选择”菜单中的“全选”命令可实现选择文档中的所有对象，按住“Ctrl+A”组合键也可选中所有对象。 11.2.2、操作对象 1.新建空白文档 2.利用工具箱中的各种工具按钮制作所需的图形元素。 3.设置图形元素属性。 4.调整图像元素位置。 11.2.3、组织对象 上述步骤完成后，按照前面所讲的方法框选文档中的所有对象，按下“Ctrl+G”组合键将所有对象组合成一体，然后单击工具栏上的保存按钮，或按“Ctrl+S”组合键将文档保存为png格式，该格式是Fireworks的源文件。 11.2.4、位图工具 位图又叫点阵图，其图形是由屏幕上许多细微的小点组成，基于位图的图形操作实际上就是把图形中的像素作为处理的对象。在Fireworks CS4中要创建位图，可以使用位图工具绘制，将矢量图转换为位图图像，也可以直接打开或导入位图。 选择区域工具在位图编辑模式中是重要的工具，选择区域工具可以确定位图中像素的编辑范围，也可以帮助生成复杂曲线。 生成位图选区 调整位图选区 使用笔触和填充工具 使用修饰图像工具 11.2.5、 修饰位图 11.2.6、绘制矢量对象 使用工具箱中的“直线”、“矩形”、“椭圆”工具可以快速绘制直线、矩形和椭圆等基本形状，就如同本章一开始所讲的制作网站