マニュアル キャンセル

画像の最適化

  1. Photoshop Elements ユーザーガイド
  2. Photoshop Elements の概要
    1. Photoshop Elements の新機能
    2. 必要システム構成 | Photoshop Elements
    3. ワークスペースの基本
    4. ガイドモード
    5. フォトプロジェクトの作成
  3. ワークスペースと環境
    1. ホーム画面の説明
    2. ワークスペースの基本
    3. 環境設定
    4. ツール
    5. パネルとエリア
    6. ファイルを開く
    7. 定規、グリッド、ガイド
    8. 機能強化されたクイックモード
    9. ファイル情報
    10. プリセットとライブラリ
    11. マルチタッチサポート
    12. 仮想記憶ディスク、プラグインおよびアプリケーションのアップデート
    13. 操作の取り消し、やり直しおよびキャンセル
    14. 画像の表示
  4. 写真の補正および画質調整
    1. 画像のサイズ変更
    2. 切り抜き
    3. Camera Raw 画像ファイルの処理
    4. ぼかしの追加、色の置き換え、画像領域のコピー
    5. シャドウとライトの調整
    6. 写真のレタッチと修正
    7. 写真の合成
    8. 写真をシャープにする
    9. 変形
    10. 自動スマートトーン補正
    11. 再構成
    12. アクションを使用した写真の処理
    13. Photomerge Compose
    14. パノラマの作成
    15. 動くオーバーレイ
    16. ムービングエレメント
  5. シェイプおよびテキストの追加
    1. テキストの追加
    2. テキストの編集
    3. シェイプの作成
    4. シェイプの編集
    5. ペイントの概要
    6. ペイントツール
    7. ブラシの設定
    8. パターン
    9. 塗りつぶしおよびストローク
    10. グラデーション
    11. 日本語テキストの操作
  6. クイックアクション
  7. ガイド付き編集、効果、フィルター
    1. ガイドモード
    2. フィルター
    3. ガイドモード Photomerge 編集
    4. ガイドモード - 基本編集
    5. 色調補正フィルター
    6. 効果
    7. ガイドモード - 楽しい編集
    8. ガイドモード - 特殊編集
    9. アーティスティックフィルター
    10. ガイドモード カラーの編集
    11. ガイドモード - 白黒の編集
    12. ぼかしフィルター
    13. ブラシストロークフィルター
    14. 変形フィルター
    15. その他のフィルター
    16. ノイズフィルター
    17. 描画フィルター
    18. スケッチフィルター
    19. 表現手法フィルター
    20. テクスチャフィルター
    21. ピクセレートフィルター
  8. カラーの使用
    1. カラーについて
    2. カラーマネジメントの設定
    3. カラーおよび色調補正の基本
    4. カラーの選択
    5. カラー、彩度、色相の補正
    6. カラーバランスの補正
    7. 画像モードとカラーテーブルの使用
    8. カラーと Camera Raw
  9. 選択範囲の使用
    1. Photoshop Elements での選択範囲の指定
    2. 選択範囲の保存
    3. 選択範囲の修正
    4. 選択範囲の移動とコピー
    5. 選択範囲の編集と調整
    6. アンチエイリアスおよびぼかしで選択範囲のエッジを滑らかにする
  10. レイヤーの使用
    1. レイヤーの作成
    2. レイヤーの編集
    3. レイヤーのコピーとアレンジ
    4. 調整レイヤーと塗りつぶしレイヤー
    5. クリッピングマスク
    6. レイヤーマスク
    7. レイヤースタイル
    8. 不透明度と描画モード
  11. フォトプロジェクトの作成
    1. プロジェクトの基本
    2. フォトプロジェクトの作成
    3. フォトプロジェクトの編集
    4. 写真リールの作成
  12. 写真の保存、プリント、共有
    1. 画像の保存
    2. 写真のプリント
    3. オンラインでの写真の配信
    4. 画像の最適化
    5. JPEG 形式として最適化
    6. Web 画像のディザ
    7. ガイド付き編集 - 配信パネル
    8. Web 画像のプレビュー
    9. 透明ピクセルとマットの使用
    10. GIF や PNG-8 形式として最適化
    11. PNG-24 として画像を最適化
  13. ショートカットキー
    1. ツールの選択時に使用するキー
    2. オブジェクトの選択時と移動時に使用するキー
    3. レイヤーパネルのショートカットキー
    4. パネルの表示/非表示を切り替えるときに使用するキー(エキスパートモード)
    5. 塗りつぶしおよびブラシのキー
    6. テキスト使用時のキー
    7. ゆがみフィルターのショートカットキー
    8. 選択範囲の変形に使用するキー
    9. スウォッチパネルのショートカットキー
    10. Camera Raw ダイアログボックス使用時のキー
    11. フィルターギャラリーのショートカットキー
    12. 描画モード使用時のキー
    13. 画像の表示時に使用するキー(エキスパートモード)

最適化

Web 用に最適化すると、インターネットでの表示に最適になるように、画像の圧縮や表示オプションの設定が行われます。画像をインターネットで配信する場合、ファイルサイズは重要です。ダウンロード時間が極端に長くならない程度に小さく、カラーやディテールを十分に保持できる程度に大きくなくてはなりません。Web で使用されるグラフィックファイルには、主に GIF、JPEG、PNGの 3 つの形式が使用されています。

画像を Web で配信するときは、ファイルサイズを考慮する必要があります。ダウンロード時間が極端に長くならない程度に小さく、カラーやディテールを十分に保持できる程度に大きくなくてはなりません。

Web で使用されるグラフィックファイルには、主に GIF、JPEG、PNG の 3 つの形式が使用されています。次のいずれかの方法を使用して、画像をこれらの形式で最適化します。

  • 画像を Adobe® Dreamweaver® などの Web オーサリングアプリケーションで使用できるように最適化するには、「Web 用に保存」コマンドを使用します。Web 用に保存ダイアログボックスでは、画像を異なるファイル形式と異なる最適化設定でプレビューできます。透明部分やアニメーション設定も変更できます。

  • 基本的な最適化を行う場合は、「別名で保存」コマンドを使用します。ファイル形式に応じて、画質、透明な背景またはマット処理、カラー表示、ダウンロード方法を指定できます。

Web 用に保存ダイアログボックスの使用

Web 用に保存ダイアログボックスを使用して、Web で共有する写真に対する異なる最適化オプションの効果をプレビューします。作業は簡単です。写真を開いて、ファイル/Web 用に保存を選択します。ファイル形式メニューから形式を選択し(GIF、JPEG、PNG‑8 または PNG‑24)、必要に応じてオプションを設定します(ファイル形式メニューはプリセットメニューの下にあります)。ファイルのコピーが保存されるので、元の画像が上書きされることはありません。

Web 用に保存ダイアログボックス

A. ツールボックス B. スポイトツールカラー C. 最適化設定とその他のオプションのメニュー D. 画像サイズ E. アニメーションオプション F. ズームレベルメニュー G. ブラウザープレビューメニュー H. 元の画像 I. 最適化した画像 

最適化オプションは、Web 用に保存ダイアログボックスの右側に表示されます。Web ファイル形式を選択するとともに、圧縮およびカラーオプションを選択したり、透明な背景またはマット処理を選択したり、画像のサイズを変更することができます。定義済みの設定を使用したり(プリセットメニューから形式を選択)、形式固有のオプションを選択して最適化を微調整することもできます。

画像ウィンドウには、元の画像(左)と最適化した画像のプレビュー(右)が表示されます。それぞれのウィンドウの下には、最適化の情報(現在の設定、最適化したファイルのサイズ、推定ダウンロード時間)が表示されます。調整を行うと、最適化した画像に新しい設定が反映され、画像の下の情報が変化します。

ダイアログボックスの左上隅には小さなツールボックスが表示されます。画像の別の部分を表示するには、手のひらツールを選択して画像をドラッグし、該当する部分が表示されるように移動します。画像をズームインするには、ズームツールを選択して表示領域内でクリックします。Alt キーを押しながらもう一度クリックすると、ズームアウトします(または、ダイアログボックスの下にある「ズーム」ボックスを使用します)。マットカラーを作成するには、スポイトツールカラーを使用します。

Web 用に最適化されたファイル形式

Web 用のファイルは 4 種類の形式から選択できます。Web 画像用の形式を選択するときは、次のガイドラインを参考にしてください。

JPEG

ほとんどの写真の保存に最適な形式です。

PNG‑24

JPEG と同様に、写真に適した形式です。画像に透明部分が含まれている場合のみ、JPEG ではなく PNG‑24 を選択します(JPEG は透明ピクセルをサポートしません。透明部分はマットカラーで塗りつぶす必要があります)。PNG‑24 ファイルは、同じ画像の JPEG ファイルよりサイズがはるかに大きくなります。

GIF

GIF は、ラインアート、広いべた塗り部分と鮮明なディテール部分を含むイラストレーション、テキストなどに適した形式です。また、アニメーション画像を書き出す場合は、GIF を使用する必要があります。

PNG‑8

PNG‑8 は、あまり知られていませんが GIF と同等の形式で、GIF と同じ用途で使用します(アニメーションを除く)。

GIF および PNG‑8 形式の画像(インデックスカラー画像と呼ばれる場合もあります)は、最大 256 色で表示することができます。画像をインデックスカラーに変換するために、Photoshop Elements はカラールックアップテーブルを作成します。元画像のカラーがカラールックアップテーブルに表示されていない場合は、テーブル内で最も近いカラーを使用するか、利用可能なカラーを用いてそのカラーをシミュレートします。

JPEG および PNG‑24 ファイルは 24 ビットカラーをサポートし、最大 1600 万色で表示することができます。形式に応じて、画質、透明な背景またはマット処理、カラー表示、ブラウザーが画像をダウンロードしているときの画像の表示方法を指定できます。

Web での画像の表示は、コンピュータープラットフォーム、オペレーティングシステム、モニター、ブラウザーで表示されるカラーによっても異なります。異なるブラウザーやプラットフォームで画像をプレビューして、Web でどのように表示されるか確認することもできます。

既定の最適化設定の適用

Web 用に保存ダイアログボックスの右上にあるプリセットメニューからあらかじめ定義された設定(プリセット)を選択することで、画像を Web 用にすばやく簡単に最適化できます。プリセットは、様々な種類の画像の最適化ニーズを満たすように定義されています。

各プリセットの名前から、そのプリセットが対象とするファイル形式と画質レベルがわかるようになっています。例えば、「JPEG 高」を選択すると、JPEG 形式の画像を高画質/低圧縮率で最適化します。「GIF 32 ディザ」を選択すると、GIF 形式の画像のカラー数を 32 色に減らし、ディザ処理を行って最適化します。

  1. Web 用に保存ダイアログボックスで、プリセットメニューから設定名を選択し、「OK」をクリックします。
  2. 最適化ファイルを別名で保存ダイアログボックスで、ファイル名を入力して「保存」をクリックします。
    注意:

    プリセットのオプションを変更した場合は、プリセットメニューに「[名称なし]」と表示されます。カスタム設定は保存できませんが、Web 用に保存ダイアログボックスを次に開いたときに現在の設定が表示されます。

ヘルプをすばやく簡単に入手

新規ユーザーの場合

Adobe MAX 2025

Adobe MAX Japan
クリエイターの祭典

2025 年 2 月 13 日
東京ビッグサイト