フォトショップ エレメンツ ビギナーのために
                        Windows編

トリミング&画像サイズ縮小

ホームページ作成において掲載写真の各種画像編集が必要になります。 当サイトでは、PhotoshopElements初心者を対象として ホームページ作成・運営で必要な各種画像編集を中心とした操作を紹介します。

トリミング&画像サイズ縮小 − 概要



ホームページへ画像を掲載する時、オリジナル画像をそのまま掲載するのではなく、余分な部分を削除し必要な部分だけ切り抜き掲載する場合があります。
また画像の構図を調整する意味でも切り抜きを行う場合もあります。

画像の不要な部分を削除し、必要な部分を切り抜くことをトリミングといいます。

この 「トリミング&画像サイズ縮小」 ページでは、オリジナル画像からその一部分を切り抜き、さらに縮小しホームページのタイトル用画像などに使用される横長画像の作成操作を説明します。

■ トリミング(切り抜き)&画像サイズ縮小イメージ ■

トリミング&画像サイズの縮小
 


トリミング&画像の縮小 − 操作方法


1. 画像を開く

ファイルの開き方は、「 ファイルを開く 」を参照ください。
2. オリジナル画像の表示
オリジナル画像の表示
オリジナル画像の表示
オリジナル画像が、
表示倍率 25% で表示されています。







3. トリミング(切り抜きツール選択)
切り抜きツールの選択
切り抜きツールの選択
ツールボックスから
『切り抜きツール』を選択します。

切り抜きツールは、切り抜く部分の横と縦の比率により切り抜きます。
切り抜く方法は、 次の三通りがあり、オプションバーの 『縦横比を選択』、『幅』、『高さ』で指定します。

@ 『カスタム』
  切り抜く部分の縦と横の比率を指定し切り抜きます。

A 『自由な形に』
  縦と横の比率を指定せずに、自由な形(四角形)で切り抜きます。

B 『写真の縦横比を使用』
  現在表示されている画像の縦と横の比率で切り抜きます。

上記三通りを以降に説明します。

トリミング(切り抜き)・・・横と縦の比率を指定した切り抜き(カスタム) − 操作方法


4. トリミング(切り抜きツール・カスタム − 縦横比率の指定)
カスタム・切り抜き
カスタム指定の切り抜き
オプションバーの『幅』 および 『高さ』 に比率を指定します。
ここでは、切り抜き・縮小後の画像サイズ570×200pxを比率として指定します。

『幅』、 『高さ』 を指定すると 『縦横比を選択』 には 『カスタム』 の表示に変更されます。
※『縦横比を選択』 のプルダウンメニューには 『カスタム』 の選択表示はありません。
5. トリミング(切り抜きツール・カスタム − 切り抜き範囲の指定)
カスタム・切り抜き範囲指定・範囲調整
カスタム・切り抜き範囲指定・範囲調整
画像上の切り抜く部分をドラッグし切り抜く範囲を選択します。

左写真の例では、A(左)からドラッグ開始し、B(右下)でドラッグ終了しています。
ドラッグが終了すると選択された範囲内は明るく、範囲以外は暗くなります。

選択範囲の回りに8か所のマーク(写真の赤○印)部分をドラッグし切り抜き範囲を調節できます。
また選択範囲内をポインターでドラッグすると、選択範囲を移動することができます。
さらに選択範囲外(暗い部分の四隅付近)でドラッグすると角度の調整ができます。
6. トリミング(切り抜きツール・カスタム − 切り抜き範囲の確定)
カスタム・切り抜き範囲の確定
カスタム・切り抜き範囲の確定
切り抜き範囲が決まったら右下の○印、あるいは選択範囲内をダブルクリックします。
これで切り抜きが確定し、選択範囲部分のみの表示になります。
7. トリミング(切り抜きツール・カスタム − 切り抜き後のサイズ)
切り抜きされたままのサイズ
切り抜きされたままのサイズ
切り抜きされた画像のサイズは、オリジナル画像の大きなサイズから切り抜かれた状態で大きなサイズです。

縮小する必要があります。
左の画像は、表示倍率25%です。
表示確認
100% 表示確認
100%表示確認すると切り抜きされたままのサイズです。

次に画像サイズを570×200に縮小します。
8. トリミング(切り抜きツール・カスタム − 画像の縮小(サイズ変更指示))
『画像解像度』ダイアログボックスの表示
『画像解像度』ダイアログボックスの表示
メニューバーから 『イメージ』 → 『サイズ変更』 → 『画像解像度』 を選択します。
選択すると 『画像解像度』 ダイアログが表示されます。
9. トリミング(切り抜きツール・カスタム − 画像の縮小(『画像解像度』ダイアログ))
画像解像度情報の表示
画像解像度情報の表示
『画像解像度』ダイアログボックスには、現在表示されている画像のサイズ情報が表示されます。

幅 : 3117px(ピクセル)
高さ: 1094px

10. トリミング(切り抜きツール・カスタム − 画像の縮小(変更後画像サイズの指示))
画像サイズの変更
画像サイズの変更
『画像解像度』ダイアログ 『ピクセル数』 の 『幅』 に縮小後の幅(570px)を指定します。
『ピクセル数』 の 『高さ』は指定しません。
※『縦横比を固定』にチェックを入れているため 『幅』または 『高さ』のどちらかに縮小後の値を入れると自動的に他方が表示されます。

左下の 『縦横比を固定』 および 『画像の再サンプル』 にチェックを入れます。
11. トリミング(切り抜きツール・カスタム − 画像縮小の完了)
画像サイズ縮小後の表示
画像サイズ縮小後の表示
画像サイズが縮小され表示倍率 25%で小さく表示されています。

ズームツール(虫めがね)にて拡大表示し100%表示の確認ができます。

12. 画像ファイルの保存く

ファイルの保存は、「 ファイルを保存 」を参照ください。

トリミング(切り抜き)・・自由な形の切り抜き  − 操作方法


13. トリミング(切り抜きツール・自由な形の切り抜き − 設定)
自由な形の切り抜き
自由な形の切り抜き
横縦比を指定せずに自由な形で切り抜く方法です。

オプションバーの 『縦横比を選択』 から 『自由な形』を選択します。
『幅』、『高さ』には指定しません。 これで準備は完了です。
14. トリミング(切り抜きツール・自由な形の切り抜き − 切り抜き範囲選択)
自由な形で切り抜く範囲をドラッグ
自由な形で切り抜く範囲をドラッグ
画像上で切り抜きたい範囲をドラッグ選択します。
選択範囲の調整以降は、『項番5.のカスタム』と同じです。

例では、A(中央の上)からB(右下)までをドラッグしています。


トリミング(切り抜き)・・写真の横縦比を使用した切り抜き − 操作方法


15. トリミング(切り抜きツール・写真の横縦比を使用した切り抜き − 設定)
写真の縦横比で切り抜き
写真の縦横比で切り抜き
表示されている写真の横縦比により切り抜く方法です。

オプションバーの 『縦横比を選択』 から 『写真の縦横比を使用』を選択します。
『幅』、『高さ』には写真の横縦比が表示されます。 これで準備は完了です。

16. トリミング(切り抜きツール・写真の横縦比を使用した切り抜き − 切り抜き範囲選択)
写真の縦横比で切り抜く範囲をドラッグ
写真の縦横比で切り抜く範囲をドラッグ
画像上で切り抜きたい範囲をドラッグ選択します。
選択範囲の調整以降は、『項番5.のカスタム』と同じです。

例では、A(中央の上)からB(右下)までをドラッグしています。