优化图像

优质
小牛编辑
132浏览
2023-12-01

存储为 Web 和设备所用格式概述

可以使用 “存储为 Web 和设备所用格式 ”对话框( “文件 ”>“存储为 Web 和设备所用格式 ”)来选择优化选项以及预览优化的图稿。

A

C

B

D

E

FGH I

“存储为 Web 和设备所用格式 ”对话框

A. 显示选项 B. 工具箱 C. “优化 ”弹出菜单 D. “颜色表 ”弹出菜单 E. 动画控件(仅限 Photoshop) F. “缩放 ”文本框 G. “在浏览器中预览 ”菜单
H. 原稿图像 I. 优化的图像

在对话框中预览图像

❖单击图像区域顶部的选项卡以选择显示选项:原稿显示没有优化的图像。优化显示应用了当前优化设置的图像。双联并排显示图像的两个版本。四联并排显示图像的四个版本。

在对话框中浏览

如果在 “存储为 Web 和设备所用格式 ”对话框中无法看到整个图稿,您可以使用抓手工具来查看其它区域。可以使用缩放工具来放大或缩小视图。

选择抓手工具(或按住空格健),然后在视图区域内拖移以平移图像。
选择缩放工具

并在视图内单击可进行放大;按住 Alt 键 (Windows) 或 Option 键 (Mac OS) 并在视图内单击可进行缩小。

也可以键入放大率百分比,或在对话框底部选取一个放大率百分比。

查看优化的图像信息和下载时间

“存储为 Web 和设备所用格式 ”对话框中每个图像下面的注释区域提供了优化信息。原稿图像的注释显示文件名和文件大小。优化图像的注释显示当前优化选项、优化文件的大小以及使用选中的调制解调器速度时的估计下载时间。可以在 “预览 ”弹出菜单中选取一个调制解调器速度。

针对 Web 优化图像

1选取 “文件 ”>“存储为 Web 和设备所用格式 ”。

2单击对话框顶部的选项卡以选择显示选项:“优化 ”、 “双联 ”或 “四联 ”。如果选择 “四联 ”,请单击要优化的预览。 3(可选)如果图像包含多个切片,请选择要优化的一个或多个切片。 4从 “预设 ”菜单中选择一个预设优化设置,或设置各个优化选项。可用选项随所选择的文件格式而有所不同。

如果在 “四联 ”模式下工作,请从 “优化 ”菜单中选择 “重组视图 ”,以便在更改优化设置后自动生成一个品质较低的图像版本。

5对优化设置进行微调,直至您对图像品质和文件大小的平衡点满意为止。如果图像包含多个切片,请确保优化所有切片。要将优化的预览恢复为原始版本,请选择该预览,然后从 “预设 ”菜单中选择 “原稿 ”。

6如果使用 sRGB 以外的嵌入颜色配置文件来优化图像,应将图像的颜色转换为 sRGB,然后再存储图像以便在 Web 上使用。这可确保在优化图像中看到的颜色与其它 Web 浏览器中颜色看起来相同。默认的选择是 “转换为 sRGB”选项。

7(仅限 Photoshop)从 “元数据 ”菜单中,选择要采用优化文件保存的 XMP 元数据。JPEG 文件格式完全支持元数据,GIF 和 PNG 文件格式部分支持元数据。可包含添加到文档中的任何元数据文件信息(选取 “文件 ”>“文件信息 ”可查看或输入文档元数据)。

无没有保存元数据。生成最小的文件大小。

版权保存版权声明、权利使用条款、版权状态以及版权信息 URL。

版权与联系信息保存所有版权信息以及以下信息:作者、作者职称、电子邮件、地址、国家 /地区、州 /省、城市、邮政编码、电话及网站。

除相机信息外的所有信息保存所有 XMP 元数据,EXIF 数据除外。EXIF 数据包括相机设置和场景信息,如快门速度、日期和时间、焦距、曝光补偿、测光模式以及是否使用闪光灯。

全部在文件中保存所有 XMP 元数据。 8单击 “存储 ”。 9在 “将优化结果存储为 ”对话框中,执行以下操作,然后点按 “保存 ”:

输入一个文件名,并为生成的文件选择位置。
选择 “格式 ”选项,以指定要保存的文件类型:HTML 文件和图像文件、仅限图像文件或仅限 HTML 文件。
(可选)为 HTML 和图像文件设置输出设置。
如果图像包含多个切片,请从 “切片 ”菜单中选择一个切片存储选项:“所有切片 ”或 “选中的切片 ”。

要将优化设置复位到上次存储的版本,请按 Alt 键 (Windows) 或 Option 键 (Mac OS),然后单击 “复位 ”。要在下次打开 “存储为 Web 和设备所用格式 ”对话框时保留相同设置,请按 Alt/Option 键并单击 “记住 ”。

要查看在 Illustrator 中将文件存储为 Web 所用格式的视频,请访问 www.adobe.com/go/vid0063_cn。

另请参阅

在 Illustrator 中存储为 Web 所用格式的视频第 348 页的 “在 Web 浏览器中预览优化的图像 ”第 358 页的 “设置输出选项 ”

存储或删除优化预设

可以将优化设置存储为一个命名的组,然后将这些设置应用于其它图像。所存储的设置与预定义的命名设置一起显示在 “预设 ”弹出菜单中。如果编辑命名的组或预定义的组,则 “预设 ”菜单将显示 “未命名 ”一词。 1根据需要设置优化选项,并从 “优化 ”调板菜单中选取 “存储设置 ”。

2命名这些设置,然后将其存储在相应的文件夹中: Photoshop (Windows XP) Document and Settings\[用户名 ]\Application Data\Adobe\Adobe Photoshop CS4\Optimized Settings

(Windows Vista) Users\[用户名 ]\AppData\Roaming\Adobe\Adobe Photoshop CS4\Optimized Settings (Mac OS) User/[用户名 ]/Library/Preferences/Adobe Photoshop CS4 Settings/Optimized Settings Illustrator (Windows XP) Document and Settings\[用户名 ]\Application Data\Adobe\Adobe Illustrator CS4

Settings\[语言 ]\Save for Web Settings\Optimize

(Windows Vista) Users\[用户名 ]\AppData\Roaming\Adobe\Adobe Illustrator CS4 Settings\[语言 ]\Save for Web Settings\Optimize (Mac OS) User/[用户名 ]/Library/ApplicationSupport/Adobe/Adobe Illustrator CS4/[语言 ]/Save for Web

Settings/Optimize注:如果将这些设置存储在其它位置,则无法在 “预设 ”弹出菜单中使用它们。 3要删除某个预设,请从 “预设 ”菜单中选择该预设,然后从 “优化 ”菜单中选择 “删除设置 ”。

在存储为 Web 和设备所用格式对话框中处理切片

如果图像包含多个切片,您必须指定要优化的切片。可以通过链接切片对其它切片应用优化设置。 GIF 和 PNG-8 格式的链接切片共享一个调色板和仿色图案以防止切片之间出现接缝。

要显示或隐藏所有切片,请单击 “切换切片可见性 ”按钮

(仅限 Photoshop)要显示或隐藏自动切片,请从 “预览 ”弹出菜单中选取 “隐藏自动切片 ”。
要在 “存储为 Web 和设备所用格式 ”对话框中选择切片,请选取切片选择工具

,然后单击切片以将其选中。按住 Shift

键并单击或按住 Shift 键并拖移可选择多个切片。注:在 “存储为 Web 和设备所用格式 ”对话框中,未选中的切片呈灰色。这不会影响最终图像的颜色。

要在 “存储为 Web 和设备所用格式 ”对话框中查看切片选项,请选择切片选择工具,然后双击一个切片。
要链接切片,请选择两个或多个切片,然后从 “优化 ”弹出菜单 “预设 ”菜单右侧)中选取 “链接切片 ”。链接的切片上将显示链接图标
要取消切片链接,请选择切片,然后从 “优化 ”弹出菜单中选取 “取消切片链接 ”。
要取消图像中所有切片的链接,请从 “优化 ”弹出菜单中选取 “取消全部切片链接 ”。

将 Web 图形压缩到特定文件大小

1选取 “文件 ”>“存储为 Web 和设备所用格式 ”。

2单击 “存储为 Web 和设备所用格式”对话框顶部的选项卡以选择显示选项: “优化 ”、“双联 ”或 “四联”。如果选择 “四联 ”,请选择要优化的预览。 3(可选)选择要优化的切片,以及要使用的文件格式。 4从 “优化 ”菜单(在 “设置 ”菜单的右边)中选择 “优化文件大小 ”。 5输入所需的文件大小。 6选择 “起点 ”选项:当前设置使用当前文件格式。自动选择 GIF/JPEG根据图像内容自动选择最佳格式。 7选择一个 “使用 ”选项,指定是要将指定文件大小仅应用于当前切片、应用于图像中的每个切片,还是应用于所有切片。单击 “确定 ”。

在优化的同时调整图稿大小

在 “存储为 Web 和设备所用格式 ”对话框中,可以将图像大小调整为指定的像素尺寸或原稿大小的百分比。 1单击 “存储为 Web 和设备所用格式 ”对话框中的 “图像大小 ”选项卡。 2设置任何附加选项:约束比例保持像素宽度对像素高度的当前比例。品质(仅限 Photoshop)指定插值方法。当您减小图像大小时, “两次立方(较锐利) ”通常可产生较好的效果。消除锯齿(仅限 Illustrator)通过应用消除锯齿去除图稿中的锯齿边缘。剪切到画板(仅限 Illustrator)剪切图片图稿以匹配文档的画板边界。任何画板边界外部的图稿都将被删除。注:除了 “剪切到画板 ”之外, “图像大小 ”调板中没有其它功能可适用于 SWF 和 SVG 文件格式。 3输入新的像素尺寸,或者指定调整图像大小的百分比,然后单击 “应用 ”。

生成 Web 图形的 CSS图层

可以使用 Illustrator 图稿中的图层,在生成的 HTML 文件中生成 CSS 图层。 CSS 图层是具有绝对位置的元素,可与网页中

其它元素重叠。准备在网页中创建动态效果时,导出 CSS 图层非常有用。通过使用 “存储为 Web 和设备所用格式 ”对话框中的 “图层 ”调板,您可以控制将图稿中的哪些顶层图层导出为 CSS 图层,以及导出的图层是可见的还是隐藏的。

1单击 “存储为 Web 和设备所用格式 ”对话框中的 “图层 ”选项卡。 2选择 “导出为 CSS 图层 ”。 3从 “图层 ”弹出菜单选择一个图层,并根据需要设置下列选项:可见在生成的 HTML 文件中创建可见的 CSS 图层。隐藏在生成的 HTML 文件中创建隐藏的 CSS 图层。

CSS 图层同于 GoLive 图层。通过使用 Adobe GoLive,您可以对 CSS 图层进行动画处理,并使用内置 JavaScript 动作来创建交互效果。

另请参阅

第 344 页的 “存储为 Web 和设备所用格式概述 ”第 345 页的 “针对 Web 优化图像 ”

在 Web 浏览器中预览优化的图像

可通过 “存储为 Web 和设备所用格式 ”对话框( “文件 ”>“存储为 Web 和设备所用格式 ”)在系统上安装的任何 Web 浏览器中预览优化的图像。浏览器预览显示的图像带有题注,其中列出了图像的文件类型、像素尺寸、文件大小、压缩规格和其它 HTML 信息。

要在默认 Web 浏览器中预览图像,请单击 “存储为 Web 和设备所用格式 ”对话框底部的浏览器图标。
要选择其它浏览器,请从浏览器弹出菜单(在浏览器图标旁边)中选择 “其它 ”。
要在浏览器弹出菜单中添加、编辑或删除浏览器,请从浏览器弹出菜单中选择 “编辑列表 ”。在 “浏览器 ”对话框中,您可以在计算机上查找所有浏览器,并设置默认浏览器以预览图像。