從 Photoshop .psd 檔案產生影像

  • 發行項

Microsoft Expression Web 可讓您從 Adobe Photoshop .psd 檔案產生 .png (PNG-24)、.gif 或 .jpg 檔案，並選取要在影像中納入或排除的 Photoshop 圖層。若要變更原始 .psd 檔案，可以在 Expression Web 中選取 Expression Web 為您產生的 Web 最佳化影像，並以 .psd 檔案的預設編輯程式 (例如 Adobe Photoshop) 便捷地開啟原始 .psd 檔案。

Expression Web 可匯入具有下列屬性的 Photoshop .psd 檔案：

  • 色彩是每個色板 8 位元 (每像素 24 位元的色彩)。

  • 色彩模式是 RGB 色彩、灰階或索引色彩。

  • 產生的影像大小為 200mb 或更少。

  • 在開啟 Photoshop 格式選項 [最大化檔案相容性] 的情況下儲存。

  • 副檔名是 .psd。

從 Photoshop .psd 檔案產生 .png、.gif 或 .jpeg 檔案

  1. 在 Expression Web 中開啟您的網站。

  2. 執行下列其中一項動作：

    • 若要將影像放入網頁中，請開啟網頁，然後將游標置於要插入最佳化檔案的位置。

    • 若要將影像匯入網站，請開啟網站。

  3. 執行下列其中一項動作：

    • 將 Photoshop .psd 檔案從 [資料夾清單] 工作窗格拖曳至網頁的 [設計] 檢視中。

    • 在 [插入] 功能表上，指向 [圖片]，然後按一下 [從 Photoshop PSD]。

  4. 在 [選取 Adobe Photoshop 檔案] 對話方塊中，選取副檔名為 .psd 的檔案，然後按一下 [開啟]。

    Cc295422.alert_note(zh-tw,Expression.10).gif注意事項：

    選取的 Photoshop .psd 檔案必須位於本機電腦或網路共用位置上。

  5. 在 [Adobe Photoshop .PSD 匯入] 對話方塊中，選取下列其中一項：

    使用此項

    執行此作業

    最佳化

    檢視套用目前匯入設定時將顯示的影像

    原始

    檢視未對原始檔案套用任何圖層變更或最佳化設定的影像。

  6. 若要放大或縮小影像，請選取影像預覽下方的縮放等級。

  7. 在 [Photoshop 圖層] 下，執行下列其中一項動作：

    • 若要讓各個圖層使用與原始 .psd 檔案相同的可見度狀態，請選取 [所有圖層]。

    • 若要選擇要顯示或隱藏的圖層，請選取 [選取的圖層]。在圖層清單中，選取每個要顯示之圖層旁的核取方塊，並清除每個要隱藏之圖層旁的方塊。

      Cc295422.alert_caution(zh-tw,Expression.10).gif重要：

      若選取 [選取的圖層] 選項，將無法在 Expression Web 中選擇顯示或隱藏 Photoshop .psd 檔案中的調整圖層、圖層樣式與圖層效果，Expression Web 所產生的影像中也不會出現這些項目。

  8. 在 [最佳化設定] 下方，針對 Expression Web 將產生的影像使用下列任何選項：

    使用此項

    執行此作業

    編碼方式

    設定檔案格式。

    JPEG 品質

    設定 [編碼方式] 選項設為 [JPEG] 時的檔案壓縮量與影像品質等級。低設定值所產生的檔案大小會小於高設定值所產生的檔案。但高設定值所產生的影像品質會優於低設定值所產生的影像品質。

    預估大小

    檢視最佳化影像的檔案大小近似值。

  9. 在 [最佳化檔案] 下執行下列其中一項動作，設定 Expression Web 將產生之檔案的位置與檔案名稱：

    • 按一下 Cc295422.4d33764f-2875-4f4b-8480-f1e071ba7582(zh-tw,Expression.10).png 按鈕使用 [另存新檔] 對話方塊瀏覽至所要的位置，然後輸入新的檔案名稱，或選取想要取代的現有檔案。

    • 輸入路徑與檔案名稱。

編輯匯入的 Photoshop .psd 檔案

  1. 開啟內含您以 Expression Web [匯入 Adobe Photoshop PSD] 對話方塊產生之影像的網頁。

  2. 在 [設計] 檢視中，以滑鼠右鍵按一下影像，指向 [Adobe Photoshop PSD]，然後按一下 [編輯來源]。

    Cc295422.alert_note(zh-tw,Expression.10).gif注意事項：

    若系統上沒有指定用來開啟 Photoshop .psd 檔案的預設程式，即無法使用 [編輯來源] 命令。

    此時會啟動編輯 .psd 檔案的預設程式。它會自動開啟與影像相關聯的 .psd 檔案。

  3. 在您的 .psd 檔案預設編輯應用程式中，進行變更並儲存 .psd 檔案。

  4. 若要更新網頁中的影像，請在 Expression Web 中以滑鼠右鍵按一下影像，指向 [Adobe Photoshop PSD]，然後按一下 [從來源更新]。

  5. 在 [匯入 Adobe Photoshop .PSD] 對話方塊中設定所要的選項，然後按一下 [匯入]。

    Cc295422.alert_note(zh-tw,Expression.10).gif注意事項：

    若您先前曾使用 [匯入 Adobe Photoshop PSD] 對話方塊以外的方式對產生的影像 (.png、.jpg 或 .gif) 進行過變更，則會出現對話方塊要求您確認是否要覆寫變更。

從 Photoshop .psd 檔案匯入最新的變更

  1. 開啟內含您以 Expression Web [匯入 Adobe Photoshop .PSD] 對話方塊產生之影像的網頁。

  2. 以滑鼠右鍵按一下影像，指向 [Adobe Photoshop PSD]，然後按一下 [從來源更新]。

  3. 在 [匯入 Adobe Photoshop .PSD] 對話方塊中，設定所需的選項，然後按一下 [匯入]。

    Cc295422.alert_note(zh-tw,Expression.10).gif注意事項：

    若您先前曾使用 [匯入 Adobe Photoshop PSD] 對話方塊以外的方式對產生的影像 (.png、.jpg 或 .gif) 進行過變更，則會出現對話方塊要求您確認是否要覆寫變更。

請參閱

概念

設定影像的協助工具屬性

新增或移除中繼資料