WEB素材作成ソフト？

Question

WEB素材（自分のホームページで使う用の素材）を作りたいと思っています。
具体的には自分で書いた絵や文字を使おうと思っているのですが
どのように作るのが一番良いのでしょうか。
最初は「ペイント」で作ろうと思ったのですが、どこのサイトでも
素材やサイトのタイトルなどはGIF形式になっていて、リンク用バナーは
JPEG形式になっているところもありました。
ペイントだとbmp形式になり、無理矢理GIF形式などで保存しようとすると
色情報の一部が失われる可能性があると表示されます。
（JPEG形式なら問題なく保存できるようですが・・・）

まったくの素人なのでいくつかお聞きしたいことがあります。
まず、なぜ素材はGIF形式が多いのでしょうか。
リンク用バナーもGIF形式のところもあるようです。
それと、バナーはJPEG形式のところもいくつか見つけたのですが
JPEG形式でも問題ないのでしょうか。（ペイントで作れるので）
最後に、素材はできるだけGIF形式のほうがいいという場合は
素材作成に向いているソフトウェアを教えて下さい。
フリーでもシェアでも市販のものでも何でも構いません。
よろしくお願い致します。

kyanasaki · Accepted Answer

BMPは無圧縮形式で非常に重いからだと思います。
現在インターネットではBMPを使う事をあまり進めていません。
通常画像(BMP)はgifやjpg等に画像圧縮を行う必要があります。
仮に画面をキャプチャーした画像ですと、
BMP形式で保存した場合、2MBほどになりますが、
JPG形式の場合は50KB～200KBで済むのです。
また、色もあまりBMPと遜色ありませんので利用されています。

仮にBMPで画像を保存しネットで表示した場合、
利用者は500KB～1MBの画像を表示する必要があります。
これでは、光回線でも10秒程かかるばあいもあります。
ISDNなら、もうどうしようもありません。
しかし、gifやjpgで表示した場合100kb程度になるので、
どんな回線でもスイスイ表示されるっと言う事です。


通常使用した色の数によって保存形式を変更します。
画像が256色以内だった場合はgifにすると美しくなりますが、
jpgにすると、色を最大限に美しく表現する為、
画像にむらができます。
この事を、通常画像が荒れると言いますが…。

逆に、写真などの256色以上の場合はjpgで保存します。
これを間違ってgifにした場合写真が汚くなります。
何故なら写真を256色で表現してしまうからです。


何故素材形式はgifが多いかというと、
上記の点から踏まえて、その素材が256色以内で、
また、BMP形式，jpg形式より容量が軽くなるからです。
バナーはjpg形式！と言う決まり事は全くありません。
256色以内であれば、gif形式と考えた方が良いです。
これを理解していない人は大抵、gifやjpgを混乱して使用してしまいます。


i-to-ziさんが作る画像が256色以上の場合はgif形式
それ以上の場合はjpg形式で保存した方が良いですね。
例えばペイントソフトで制作した場合はgif形式ですが、
紙に書いて、それをスキャナで取り込んだ場合は、
jpg形式の方が綺麗な画像になる可能性が高いです。


画像処理に関してはやはり、PhotoShopが一番お薦めですね。
プロでも使いますし、自由度が高いのが特徴です。
その分価格が7万円(?)程度だった気がします。
フリーの場合はEDGEが現在最強と言われています。(恐らく)
シェアでも通用するくらいのレベルがありますよ。
ドット絵を描く時や素材を作る時はこれが一番です。


■EDGE
http://www.tkb-soft.hmcbest.com/
ドット絵制作ツール
現在絶大な人気を誇るフリーソフト

kowaza · Answer

フォトショップのファイル＞Web用に保存で、GIFにして、落としたくない色をスポイトアイコンで吸い取って、錠のアイコンをクリックしてロックする。そしてすこしづつ減色していけば、軽い素材が作れると思いますよ。画像の重さも表示されますし、便利です。

sion_fs · Answer

＃５さんのを参考に、私も実際に比較してみました。

（１）猫の写真（携帯で撮影）
２５６色保存
BMP  77.88k
GIF  33.10k
PNG  28.20k

フルカラー保存
BMP 230.45k
PNG  94.09k
Jpeg 49.95k
Jpeg-80% 2.05k


（２）イラストバナー（全107色の画像）
88ｘ31サイズ
Jpeg 4.31k
BMP  3.81k
Jpeg-80% 2.05k
GIF  1.47k
PNG  1.39k
Jpeg-45% 1.38k

640ｘ225サイズに拡大
BMP  145.08k
Jpeg  63.55k
GIF   31.90k
PNG   22.84k
Jpeg-80% 20.11k

（３）写真200x50サイズ
BMP24bit 30.05k
PNG24bit 15.76k
Jpeg100% 13.80k
BMP 256  11.86k
GIF 256色 6.12k
PNG 256色 5.19k
Jpeg-80% 3.14k

このような結果になりました。
この表を見れば明らかですが、

１）色数が少ない画像では、GIF／PNGの圧縮率が非常に高くなる。
２）サイズが小さい画像では、JPEGの利点はあまり無い。
３）個人的には、ＰＮＧがＧＩＦより圧縮度が高い事も証明されて満足です（笑）

といった感じですね＾－＾

なお、Jpeg とだけ記述してあるのはJpeg-99% を意味します。この％は圧縮率で、低ければ低いほど、高圧縮＝画像の劣化が激しいという事になります。
一般的には８０％程度が良く利用されます。



なお蛇足ですが、ＧＩＦの著作権問題に関しては、既に昨年、ＧＩＦの著作権は期限切れとなりました。現在はそのまま利用して全く問題がありません。

kowaza · Answer

素材などを作成するなら
アドビの「フォトショップ」がダントツでいいです。
バージョンが高ければいいと言うわけではないようで
5.5が人気なようです。
今でもあるかわからないですが「イラストレーター」とセットになってるものは割安な感じがします。
5.5以上では、「WEB用保存」というものが追加されGIF、JPEG、PNGなどの保存形式や画像の重さをかえるのは簡単です。

GIFはイラスト。JPEGは写真。とおぼえればいいと思います。

pupu3sjp · Answer

＃３です。

試しに「ペイント」で「カラフルな花びらの薔薇」を作成して保存してみました。

16色BMP：77.6KB
256色BMP：156KB
24ビットBMP：465KB
（※減色すれば画像も悪くなる）
GIF：4.69KB
JPEG：16.5KB

やはり、素材はGIFで作成する方が無難です・・・。(^^;)

sion_fs · Answer

ＢＭＰとはWindowsの標準形式ですが、Macでは標準形式ではありません。
すなわち、Macでは表示できない場合がある、と言うのが一つ目の理由で、２つめの理由として、ＢＭＰは原則では圧縮をサポートしていません。

この為、ファイルのサイズが極端に重くなります事は＃２さんの仰るとおりです。


ＧＩＦは、そうした欠点を排除する為の形式の一つです。色数を原則では２５６色まで落としてしまい、その代わりに繊細な画像をそのままで高い圧縮率で保存できます。

ＪＰＥＧは、逆に写真向けの圧縮形式です。色数を極力落とさずに圧縮率を高めますので、その代わりに繊細な部分はぼやけてしまいます。


ＧＩＦは色数が落ちるので、写真などグラデーションには不向きですが、画像がぼやける事は有りません。ＪＰＥＧは画像がぼやけるので、文字やキャラクタなどには不向きですが、写真などのグラデーションの表現が得意です。


なお、ＧＩＦは著作権で一時期問題となり、ＧＩＦやＪＰＥＧに代わる形式としてＰＮＧが使われました。ＰＮＧはＧＩＦと同じ画像をＧＩＦより高圧縮出来る上、ＪＰＥＧの代わりとしても利用出来ます。ＨＴＭＬで画像を利用する際、最も推奨される（Ｗ３Ｃ推奨）画像形式です。

ただ、歴史があまり深くない為にＰＮＧに対応した画像作成ソフトはあまり多くないです。
（※表示はＩＥでもモジラでも出来ますしVodafoneなんかは標準形式でした。）


バナーは、ＪＰＥＧでもＧＩＦでもＰＮＧでも問題有りません。が、その画像に合った形式を使うのが良いでしょう。（写真を使ったバナーならＪＰＥＧ、文字が中心ならＰＮＧやＧＩＦ、といった形）


pixiaなんかは結構有名なソフト（フリー：GIFは非対応）ですね。
http://homepage2.nifty.com/~maru_tacmi/

市販ソフトではPaintShopなどが有ります。
http://paintshoppro.jp/

参考URL：http://homepage2.nifty.com/~maru_tacmi/

pupu3sjp · Answer

GIFが使用できる色彩は256色と、他の形式に比べデータ容量を少なく出来るので、
写真以外の画像をGIFで作成すると、HPでは負担が軽くなるからです。

逆を言うと、写真などは256色では再現できないので、現状で一番適しているのは
JPEGのようですし、デジカメの保存形式がJPEGに統一されているようですね。

BMPは「モノクロ」「16色」「256色」「24ビット：フルカラー：16,777,216色」と
保存が出来るオールマイティーなところが有ります。
もちろん上記の各色順に保存すれば、容量は増大していきますよね。

素材は好みの形式で作成しても特に問題はありませんが、いわゆる「HPが重い」
状態を回避するには、容量の少ない画像にした方が無難と言えば無難です。

Win 98時代は「ペイント」でGIF形式で保存が出来なかったような気がしますが、
現状のWin XPの「ペイント」ではGIFもJPEGもBMPも保存が出来るようなので、
用途に合わせて使い分けるのが良いでしょうね。
（この点は、ちょっと疑心暗鬼なので、間違っていたらスミマセン）

なお、JPEGは保存をする度に圧縮が掛かり、色彩も退色していきます。
修正・保存を繰り返すと、徐々に画像が潰れた感じになったり、ゴミが付着
したような汚れが目立っていきますので、注意が必要です。

rightegg · Answer

こんにちは。

GIFでもJPEGでもどっちでも良いです。
ルールは無いですよ。

それぞれの特徴を踏まえて使い分けているだけです。
GIFってのは色数を限定することでファイルサイズを抑えています。
例えば縞模様ならGIFの方が便利。気をつけるべきなのは、例えば白黒なら白と黒であり「灰色」は含まれないということ。
つまり直線でハッキリ分かれた色でない場合は、そのグラデーションを表現するために色数が必要って事です。

つまり写真のような画像にはGIFは向かないと言うこと。そう言う画像はJPEGの方が優秀です。

そして全体的に見れば、JPEGの方が軽い事になります。
でもGIFも多いですよね。これは「表示の軽さ」の問題です。JPEGとGIFでは、GIFの方が表示が速いんですよね。だから大して重さが変わらないような小さな画像では、GIFの方が好んで使用される傾向にあります。

別にペイントで自由に作れるならペイントで構いませんよ。GIF変換がいまいち綺麗にいかないならJPEGにするか、別のソフトを買えばいい。JPEGだけでサイトを作っても何の問題もないですからね。

もちろんFireWorksとかPaintShopを購入しても良いし、本格的にやりたければPhotoShopを買っても良い（高いから手が出ないでしょうけど）です。
どのソフトでもJPEGやGIFは書き出せます、あとは各種フィルターや操作性、扱える容量の差です。

WEB素材作成ソフト？

BMPは無圧縮形式で非常に重いからだと思います。

フォトショップのファイル＞Web用に保存で、GIFにして、落としたくない色をスポイトアイコンで吸い取って、錠のアイコンをクリックしてロックする。

＃５さんのを参考に、私も実際に比較してみました。

素材などを作成するなら

＃３です。

ＢＭＰとはWindowsの標準形式ですが、Macでは標準形式ではありません。

GIFが使用できる色彩は256色と、他の形式に比べデータ容量を少なく出来るので、

こんにちは。

似たような質問が見つかりました

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング