・大きすぎる画像を小さくしたい。
・指定サイズで画像を作りたい。
・部分的に切り取った画像を作りたい。
こんな状況の方へ。
リサイズ(画像サイズの変更)&トリミング(画像の切り取り)方法についてご紹介。
インターネット上で探してみるとピンポイントで使えるツールはいろいろあります。
直観的に使えそうなものがあれば、チェックしてみてはいかがでしょうか。
今回は、ピンポイントのツールではなく、ウェブ用ならばphotshop並に使える?!「pixlr editor」を使って、「画像のリサイズ」と「画像のトリミング」方法をご紹介します。
以下、各画像は、クリックすると拡大表示できます。
準備)画像を用意する
JPG、PNG、GIFの画像を用意します。(写真画像は、JPG、PNG)
指定サイズで画像を作りたい場合は、そのサイズより大きい画像を用意します。
例えば、横幅960px、高さ300pxの画像を作りたい場合は、横幅960px以上かつ、高さ300px以上の画像を用意します。
※厳密にいうと、小さい画像でも300dpi以上など高解像度であれば別途ウェブ用解像度に変換することで使用できますが、ここではその説明は割愛します。
pixlr editorを立ち上げて、画像を表示させます。
A)画像をリサイズする(縦横比固定で画像を小さくする)
使用しているレイアウト、使用箇所によって様々ですが、例えばNewUIの背景画像の場合1600 × 1200px、全般的には800 × 600pxとサポートに記載されています。
Jimdo公式サポート→ Jimdoを利用する際の画像の形式について(推奨サイズなど)
上部にメニューの中から「画像」→「画像サイズ」を選択。
「画像サイズ」指定画面でサイズを指定します。
「縦横比を固定」は、必ずチェックをいれます。
保存は、「ファイル」→「保存」をクリック。
「画像を保存」画面が表示されたら、名前(ファイル名)を入力し、フォーマットで「JPEG」または「PNG」を選びOKをクリック。
画像の保存場所を指定し完了です。
B)画像をトリミングする(指定サイズで切り取る)
画像を取り込んだら、左側のツールの左上「切り抜きツール」を選択し、サイズを設定します。
・固定化・・・出力サイズ
・幅・・・任意
・高さ・・・任意
※サイズ指定せず切り取りたい場合は、「固定化:固定なし」を選択します。
次に、画像の上にマウスのポインタをあて、ドラッグして切り取る箇所を選択します。
事前に出力サイズを指定していることにより、縦横比が固定された状態で指定できます。
※この時、元画像を極端に小さく切り取りたい場合は、注意が必要です。
例えば、横幅1000pxの画像を960pxへ変更したい場合。1000pxの画像の半分で切り取ると、実質500px程度になったものを960pxで表示させることになり、結果、画像が荒くなってしまいます。
切り取り箇所が決まれば下記いずれかの方法で確定します。
・enterキーで決定する。
・切り抜きツールをクリック。「変更を適用しますか?」→「はい」で決定する。
画像が指定サイズで表示されたら
「ファイル」→「保存」をクリック
「画像を保存」画面が表示されたら、名前(ファイル名)を入力し、フォーマットで「JPEG」または「PNG」を選びOKをクリック。
あとは、画像の保存場所を指定し完了です。
以上、ご参考まで