第6章 GIMPから画像を引き出す

目次

1. ウェブ用の画像の作成
1.1. 画像の容量最適化と品質
1.2. さらにファイル容量を削減
1.3. 透過画像の保存
<xi:include></xi:include>

1. ウェブ用の画像の作成

GIMPの主な用途にはウェブサイト用画像の作成があります。 ここでの課題はできるだけ小さなファイル容量を保ちつつ画像をいかに良好に見せるかということです。 この節は、 画像の劣化を最小限にしつつファイル容量の小さな画像を作る方法について順を追って実演します。

1.1. 画像の容量最適化と品質

画像をウェブでも使いやすくするとき肝心なのは、 どんな画像形態とファイル形式にするかということです。 写真は大抵がたくさんの色を持ちとても緻密なので JPEG を使いましょう。 ボタンやアイコンやスクリーンショットのような色が少ない画像には PNG がふさわしい形式です。

  1. まずは、いつも通り画像を開いてください。 ここには例として我らがウィルバー君の画像をとりあげます。

    図6.1 RGBAモードで開かれたウィルバー君の画像

    RGBAモードで開かれたウィルバー君の画像

  2. この画像はRGBモードに アルファチャンネル が加えられたもの (RGBA) になっています。 普段ウェブ用画像にはアルファチャンネルは不要です。 アルファチャンネルは 画像の統合 で削除できます。

    写真画像にアルファチャンネルがつくことはめったにありませんので、 画像はRGBAモードではなくRGBモードで開かれるはずです。 つまりアルファチャンネルの削除を行う必要はないと考えられます。

    [注記] 注記

    もしも画像に半透明な部分があり、 全く透明な部分へ徐々に変化する透過効果がついているなら、 アルファチャンネルを外してはなりません。 [インデックス化も避けるべきです。] この部分に用いられているなだらかな色変化の情報がファイルに保存されなくなるからです。 透明部分がある画像でも、 徐々に変化する部分を含まないのであれば、 ( GIFの場合と同じく) アルファチャンネルを外しましょう。

  3. 画像を統合したあとは、 ウェブサイト用に PNG形式画像を保存 します。

[注記] 注記

画像をPNG形式で保存するときは既定の設定が利用できます。 画像を作成するときはいつも最高の圧縮率を使うことになりますが、 画像の品質には全く影響がなく、 しかも表示に要する時間も変わりません。 ただし保存のときだけは処理時間が長くなります。 これに対し JPEG 形式は圧縮率を上げると画質の劣化が進みます。 色数が大変多い写真画像ならJPEG形式を使うべきでしょう。 品質と圧縮の最高の兼ね合いを探ることが肝心です。 この話題に関する情報は前述の ??? の節にもあります。

1.2. さらにファイル容量を削減

画像のファイル容量をもっと小さくしたいときは、 画像をインデックスモードに変換することになるでしょう。 つまり全色数を 256 色に減らすのです。 徐々に色が変化する画像やグラデーション効果があるものはインデックスモードに変換してはいけません。 なぜなら徐々に変化していた色が数色の縞に変えられてしまうからです。 とくにインデックスモードは写真に使うと粗末な仕上りになるためおすすめできません。

図6.2 インデックス化した画像

インデックス化した画像

インデックス化した画像はややギザギザになってしまう。 左上の画像が元の大きさのウィルバー君、 右の大きい画像が300パーセントにズームしたもの。


  1. モード の節で述べられているコマンドを用いてRGB画像をインデックスモードに変換します。

  2. 画像をインデックスモードに変換したら、 こんどは PNG形式保存 しましょう。

1.3. 透過画像の保存

画像の透明部分をサポートするのに使える画像ファイル形式は2つあります。 単純二極化透過とアルファ透過です。 単純二極化透過は GIF 形式でサポートされています。 この形式はインデックス化された色パレットのうちの1色を透過色として扱います。 アルファ透過は PNG 形式でサポートされています。 この形式は アルファチャンネル という別個のチャンネルに透明度の情報を収めています。

[注記] 注記

GIF形式はあまり使われません。 GIFのすべての機能とそれ以上の (アルファ透過などの) 性能をPNGがあわせもつからです。 とはいえ、 アニメーションのためにこの形式もまだ使われています。

手順6.1 透明部分のある画像の作成 (アルファ透過)

  1. まずはGIMPのマスコット、 ウィルバー君の前回演習に使ったのと同じ絵を使いましょう。

    図6.3 RGBAモードで開かれたウィルバー君の画像

    RGBAモードで開かれたウィルバー君の画像

  2. アルファ透過つきの画像で保存するにはアルファチャンネルが必要です。 画像のアルファチャンネルの有無は、 チャンネルダイアログ を開いて、 赤・緑・青のほかにアルファ値の層があるかどうかで確かめます。 もし無ければ、 画像ウィンドウのメニューより レイヤー透過効果アルファチャンネルを追加 と辿り、 そのレイヤーに アルファチャンネルを追加 します。

  3. XCF形式の画像は初期状態では背景レイヤーがついてきますがこれは削除できます。 GIMPにはグラデーション作成をサポートする標準的なフィルタが付属しています。 画像ウィンドウのメニューより フィルタ照明と投影 サブメニュー内を探してみましょう。 ここはあなたの想像力次第です。 アルファ透過の効果の実演として、 ウィルバー君の背後に後光をつけました。

  4. 画像が仕上がったら、 PNG形式保存 しましょう。

図6.4 透過効果つきのウィルバー像

透過効果つきのウィルバー像

GIMP上での作業では背景レイヤー越しに中間色をみて保存された画像の透明部分を確かめる