請使用本文,了解如何匯出影像和 GIF 動畫。

Animate 引進「匯出影像」和「匯出 GIF 動畫」功能,可協助您以容易使用且互動的方式,將資源匯出成 .png、jpeg、靜態和 GIF 動畫格式。

在製作網頁或其他線上媒體使用的影像時,通常需要在影像的顯示品質和檔案大小之間進行取捨。

您可以使用「匯出影像」對話方塊中的最佳化功能,預覽不同檔案格式和不同檔案特質的最佳化影像。您可以同時檢視影像的多重版本,並在預覽影像時修改最佳化的設定,以選取符合您需要的最佳設定組合;也可以指定透明度和修邊、選取控制混色的選項,以及將影像重新調整為指定的像素尺寸或原始尺寸的指定百分比。

當您使用「匯出影像」命令儲存最佳化的檔案時,可以選擇產生影像的 HTML 檔案。這個檔案包含在網頁瀏覽器中顯示影像的所有必要資訊。

在 Animate 中,您可以使用「另存新檔」命令將影像儲存成 GIF、JPEG 或 PNG 檔案。依照不同的檔案格式,您可以指定影像品質、背景透明度或邊緣調合、色彩顯示和下載方法;但是,已加入到檔案的所有網頁功能 (例如連結和動畫) 將不會保留。

您也可以使用 Animate 的「影像處理器」,以 JPEG 格式為整個資料夾的影像儲存拷貝。您可以使用「影像處理器」重新調整影像大小,並將影像的色彩描述檔轉換為 Web 標準 sRGB。

匯出影像

使用「匯出影像」對話方塊 (「檔案 > 匯出 > 匯出影像」,以及「檔案 > 匯出 > 匯出 GIF 動畫」) 可選取最佳化選項,以及預覽最佳化的圖案。

A. 顯示選項 B. 「最佳化」彈出式選單 C. 預設集選項 D. 影像大小選項 E. 「動畫」選項 F. 預覽 G. 工具列 

在對話方塊中預覽影像

請按一下影像區域頂端的索引標籤,選取顯示選項:

原稿

顯示未經最佳化的影像。

最佳化

顯示已套用目前最佳化設定的影像。

2 欄式

並列顯示 2 種不同版本的影像。

在對話方塊中導覽

如果在「匯出影像」對話方塊中無法看見整個圖案,可以使用「手形」工具將別的區域移到檢視中。使用「縮放」工具可放大或縮小檢視。

  • 請選取「手形」工具 (或按住空白鍵) 並在檢視區域中,即可平移影像。
  • 選取「縮放」工具 並在檢視中按一下,即可放大顯示;按住 Alt 鍵 (Windows) 或 Option 鍵 (Mac OS) 並在檢視中按一下,則可縮小顯示。

    您也可以鍵入縮放比率,或是選擇對話方塊下方的其中一項。

檢視最佳化影像資訊和下載時間

在「匯出影像」對話方塊中,每個影像下方的附註區域都會提供最佳化資訊。原始影像的註解中會顯示檔案名稱和檔案大小。最佳化影像的附註會顯示目前的最佳化選項、最佳化檔案的大小,以及選用的數據機速度的預估下載時間。您可以在「預覽」彈出式選單中選擇數據機的速度。

預覽不同 Gamma 值的影像

電腦螢幕的 Gamma 值影響影像在瀏覽器中看起來的亮度。您可以依不同的 Gamma 值預覽您的影像在系統中的模樣,並對影像調整 Gamma 以進行補償。啟動預覽選項並不會影響到最終的影像輸出。

  • 使用「匯出影像」對話方塊中的「預覽」彈出式選單,選擇下列其中一個選項。

螢幕色彩

不調整影像 Gamma 值。螢幕色彩為預設設定。

舊版 Macintosh (無色彩管理)

模擬由 Mac OS 10.5 及更舊版本所使用的預設 1.8 Gamma。

Windows (無色彩管理)

模擬由 Windows 及 Mac OS 10.6 與更新版本所使用的預設 2.2 Gamma。

使用文件描述檔

將 Gamma 值調整為符合色彩管理文件中附加的任何文件色彩描述檔。

最佳化網頁影像

  1. 選擇「檔案 > 匯出影像」或「檔案 > 匯出 GIF 動畫」。

  2. 按一下對話方塊頂端的索引標籤,選取顯示選項:「最佳化」或「2 欄式」。

  3. (選擇性) 如果您的影像包含多個切片,請選取一或多個要最佳化的切片。

  4. 從「預設集」選單選取預設的最佳化設定,或是設定個別的最佳化選項。可以使用的選項會依選取的檔案格式而變更。

  5. 微調最佳化設定,直到滿意影像品質和檔案大小之間的平衡為止。如果您的影像包含多個切片,請確定所有的切片都執行了最佳化。

    註解:

    若要將最佳化的預覽復原為原始版本,請選取預覽,然後從「預設集」彈出式選單中選擇「原稿」。

  6. 若要確保在不同瀏覽器中都能看到您在最佳化影像看到的相同顏色,請將影像顏色轉換成 sRGB。

    註解:

    此輸出的中繼資料與中繼資料工作群組標準相符,因此部分 JPEG 中繼資料會以 EXIF 與 IIM 格式儲存,而非 XMP 格式。

  7. 選取下列選項:

    未儲存任何中繼資料 (JPEG 檔案中的 EXIF 版權注意事項除外)。以最小檔案大小產生。

    版權資訊

    儲存版權注意事項、版權使用條款、版權狀態與版權資訊 URL。

    版權與聯絡資訊

    儲存所有版權資訊以及下列資訊:建立者、建立者職稱、電子郵件、地址、城市、州/省、郵遞區號、國家/地區、電話及網站。

    全部資訊 (相機資訊除外)

    儲存所有中繼資料,而關於相機設定(如快門速度、日期與時間、焦距、曝光度補償、測光圖樣與閃光使用) 的 EXIF 資料則除外。

    全部

    儲存檔案中所有中繼資料。

  8. 按一下「儲存」。

  9. 在「另存最佳化檔案」對話方塊中,執行下列動作,然後按一下「儲存」︰

    1. 輸入檔案名稱,並選取結果檔案的位置。

    2. 選取「格式」選項,指定您要儲存的檔案類型:HTML 檔案與影像檔案、僅影像檔案,或是僅 HTML 檔案。

    3. (選擇性) 設定 HTML 和影像檔案的輸出設定

    4. 如果影像包含多個切片,請從「切片」選單中選取儲存切片的選項︰「全部切片」或「選取的切片」。

      註解:

      若要將最佳化設定重設為最後儲存的版本,請按住 Alt 鍵 (Windows) 或 Option 鍵 (Mac OS) 並按一下「重設」。若要在下次開啟「儲存為網頁用」對話方塊時保持相同的設定,請按住 Alt/Option 鍵並按一下「記憶」。

    5. 如需在 Illustrator 中儲存檔案以供網頁使用的影片教學課程,請參閱 www.adobe.com/go/vid0063_tw

儲存或刪除最佳化預設集

您可以將最佳化設定儲存為命名的組合,然後將這些設定套用到其他影像中。儲存的設定會與預先定義的命名設定一起顯示在「預設集」彈出式選單中。如果編輯命名的組合或預先定義的組合,「預設集」選單中會顯示「未命名」。

  1. 設定您想要的最佳化選項,然後從「最佳化」浮動視窗選單選擇「儲存設定」。

  2. 為設定命名,並將其儲存在適當的檔案夾中:

    Photoshop

    (Windows XP) Document and Settings\[使用者名稱]\Application Data\Adobe\AdobePhotoshop CS5\Optimized Settings

    (Windows Vista) Users\[使用者名稱]\AppData\Roaming\Adobe\Adobe Photoshop CS5\Optimized Settings

    (Mac OS) Users/[使用者名稱]/Library/Preferences/AdobePhotoshop CS5Settings/Optimized Settings

    Illustrator

    (Windows XP) Document and Settings\[使用者名稱]\Application Data\Adobe\AdobeIllustrator CS5 Settings\[語言]\Save for Web Settings\Optimize

    (Windows Vista) Users\[使用者名稱]\AppData\Roaming\Adobe\AdobeIllustrator CS5 Settings\[語言]\Save for Web Settings\Optimize

    (Mac OS) Users/[使用者名稱]/Library/ApplicationSupport/Adobe/Adobe Illustrator CS5/[語言]/Save for Web Settings/Optimize

    註解:

    如果您將設定儲存在別的位置,將無法在「預設集」彈出式選單中使用。

  3. 如果要刪除預設集,請從「預設集」選單中選取預設集,並從「最佳化」選單中選取「刪除設定」。

將網頁圖像壓縮為特定檔案大小

  1. 選擇「檔案 > 匯出 > 匯出影像」或「檔案 > 匯出 > 匯出 GIF 動畫」。

  2. 按一下「匯出影像」或「匯出 GIF 動畫」對話方塊頂端的索引標籤,選取顯示選項:「最佳化」或「2 欄式」。 

  3. (選擇性) 選取要最佳化的切片以及要使用的檔案格式。

  4. 從「最佳化」選單 (在「預設集」選單的右方) 選取「檔案大小最佳化」。

  5. 輸入所要的檔案大小。

  6. 選取「開始」選項:

    目前設定

    使用目前的檔案格式。

    自動選取 GIF/JPEG

    根據影像內容自動選取最適合的格式。

  7. 選取「使用」選項,以指定將指定的檔案大小套用到目前的切片、每一個影像中的切片、或是所有切片。按一下「確定」。

在最佳化時重新調整圖稿尺寸

在「匯出影像」對話方塊中,您可以將影像重新調整為指定的像素尺寸,或是重新調整為原始大小的某個百分比。

  1. 按一下「匯出影像」對話方塊中的「影像大小」索引標籤。

  2. 設定任何其他選項:

    強制等比例

    維持目前像素寬度與像素高度的比例。

    註解:

    「影像尺寸」浮動視窗中的功能除了「剪裁至工作區域」以外,都無法用於 SWF 和 SVG 檔案格式。

  3. 輸入新的像素尺寸,或指定重新調整影像尺寸的百分比,然後按一下「套用」。

在網頁瀏覽器中預覽最佳化的影像

您可以透過「匯出影像」對話方塊 (「檔案 > 匯出 > 匯出影像」或「檔案 > 匯出 > 匯出 GIF 動畫」),在系統上安裝的任何網頁瀏覽器中預覽最佳化影像。瀏覽器預覽顯示影像時會附註解,列出影像的檔案類型、像素尺寸、檔案大小、壓縮規格及其他 HTML 資訊。

  • 若要在預設網頁瀏覽器中預覽影像,請按一下「匯出影像」對話方塊底部的瀏覽器圖示。
  • 您可以在「瀏覽器」對話方塊中尋找電腦上的所有瀏覽器,並且設定用來預覽影像的預設瀏覽器。

更多說明主題

此産品由 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License 授權  Creative Commons 條款未涵蓋 Twitter™ 與 Facebook 文章。

法律說明   |   線上隱私權政策