Photoshop平面设计基础与应用 侯蕾 左花苹 程传鹏 第14讲 图像的优化与Web图像输出.pptVIP

本讲要点 掌握图像的优化方法 掌握图像处理自动化的使用方法 掌握Web图像与动画设计 快速导读 本讲介绍了图像的优化、掌握图像处理自动化的使用方法、Web图像与动画设计。着重介绍了Web图像与动画设计；这也是本讲的难点。通过本讲学习，可以学会掌握Web图像与动画设计制作。 14.1 图像的优化 使用“存储为Web和设备所用格式”命令可以导出和优化切片图像，Photoshop会将每个切片存储为单独的文件并生成显示切片图像所需的HTML或CSS代码。优化图像可以加快图像在网络上的浏览和传送速度。 14.2 图像处理自动化 【文件】→【自动】的下拉菜单中包含了Photoshop预设自动化的命令，如图所示。使用这些命令可以进行批量处理相同的文件，或者简化复杂的图像编辑过程，从而可以提高工作效率。 14.2.1 系统内置动作使用 在【动作】调板中有很多系统自带的动作，播放一个动作就可以得到相应的效果，选择【窗口】→【动作】命令，弹出【动作】调板。 14.2.2 录制、修改与执行动作 在【动作】调板中虽然有很多系统自带的动作，但有的时候这些默认动作并不能够满足需要。为了适应工作环境的要求，可以自己手动来完成一些动作的录制、修改与执行。 1.录制与执行动作 除播放动作外，录制自定义的动作也是较为频繁的一类操作，因为Photoshop内置的动作不足以满足千变万化的工作需要。 2. 修改动作 即使完成了动作的录制，但根据当前执行的任务需要修改动作中某个命令参数，也可以在【动作】调板中双击此命令，在弹出的对话框中进行设置，以修改保存在动作中的命令参数。 14.3 Web图像与动画设计 Web图像最常见的几种网络图片格式为：GIF格式、JPEG格式、PNG?8格式和PNG?24格式。在Photoshop中使用Web工具，可以轻松构建网页组件，或者按照预设或自定格式输出完整网页。动画是在一段时间内显示的一系列图像或帧，当每一帧较前一帧都有轻微的变化时，连续快速地显示帧就会产生运动或其他变化的视觉效果。 14.3.1 ImageReady 7.0简介 ImageReady 7.0用于设计专业的Web页版面。使用它可以更轻松地对图层进行选择、编组、对齐和排列等处理，就好像他们是独立的对象。另外，ImageReady 7.0还包括用于高级Web处理和创建动态Web图像（如动画和翻转）的工具和调板。 14.3.2 切片 在Photoshop中，使用图层和切片可以设计网页和网页界面元素，创建用于导入到Dreamweaver或Flash中的翻转文本或按钮图形。所谓【切片】是指根据图层或参考线精确选择的区域，或者用【切片工具】创建的趋向区域。 14.3.3 图像映射 图像映射主要是用来为图像添加链接的。“图像映射”工具与切片工具的使用功能差不多，只不过切片类工具只能设置矩形区域，而“图像映射”工具却能够设置各种形状区域。 14.3.4 制作动画 动画是由一系列图像帧组成，通过使每一帧与下一帧都有稍微的不同，可以使人产生一种运动的错觉。可以使用分层的 Photoshop 或 ImageReady 图像在 Adobe ImageReady 中创建简单的动画。在图像中构成动画的所有元素都放置在不同的图层中。通过对每一帧隐藏或显示不同的图层可以改变每一帧的内容，而不必一遍又一遍地复制和改变整个图像。每个静态元素只需创建一个图层即可，而运动元素则可能需要若干个图层才能制作出平滑过渡的运动效果。 14.3.5 优化和输出图像 优化图像就是在提高图像质量的同时，使图像存储所占用的空间尽可能地小。可以选择【文件】→【自动】→【存储为Web所用格式】命令来完成对图像的优化工作。 使用Photoshop和ImageReady可以精确地控制Web图像的准备以及图像在Web页面上的显示方式。在这两个应用程序中都可以指定切片和切片工具创建的区域，以确保导出的HTML或XHTML文件的功能正常。 本讲小结 本讲主要介绍了图像的优化、掌握图像处理自动化的使用方法、Web图像与动画设计。掌握了图像的优化可以更方便更快捷地在网络上的浏览和传送图像。 思考与练习 1．选择题 1. 所谓“切片”是指根据_