画像のバイト数を落とす

*このページは、IE(Internet Explorer)で猫の里親募集掲示板を利用される方を対象に書きました。他の各種掲示板につきましても、この応用で書き込めると思います。
画像処理ソフトは、Adobe Photohop Elements2 を使っています。

画像のバイト数を落としてWeb用に保存する

掲示板に貼り付けられる写真/画像のバイト数が制限されている掲示板は、とても多いです。

ほとんどの里親募集掲示板は、50KB(キロバイト)から300KBくらいまでの間に、上限が設定されていますが、中には20KBと少ないものもあります。まれに上限無しという掲示板もあります。

また、里親募集掲示板では少ないのですが、一般の画像掲示板では、バイト数だけでなく、縦横のピクセル数も制限されているものがあります。 そのような掲示板の場合は、ピクセル数も制限以内のサイズにする必要があります。

制限より大きい/重い画像を貼ろうとした時、掲示板によって、その対処は次のようになります。

  • 「画像は100KB以内にしてください」等のエラーメッセージが出る掲示板
  • エラーメッセージ等は出ず、単に画像がない記事が投稿される掲示板
  • 強制的に添付可能なサイズまで画質を落として添付する掲示板

エラーメッセージが出れば問題点がすぐわかるので、ある意味対処しやすいです。

強制的にサイズダウンさせてしまう 掲示板は、一見ちゃんと貼れているので、画質が落ちているということに気が付かないかも知れません。芸術作品でしたら画質が落ちるのは許せないかも知れませんが、里親募集掲示板なら多少落とされても普通はあまり気にならないのではないでしょうか。 (ちなみに、私の里親募集掲示板はこのタイプです。)

初心者の方が一番慌てるのは、エラーメッセージも何も出ないで、ただ写真だけが表示されないタイプの掲示板でしょう。

正しく操作したはずなのに、写真が表示されなかった場合は、ファイル形式がJPEGになっていなかった、または、バイト数制限に引っかかったかの、どちらかである可能性が高いと考えられます。

そもそもバイト数とか、ピクセルとか、重いとか軽いとかって?

バイト(byte)というのは、情報を表す単位のことです。アルファベットや数字・カタカナなどは1バイトで1文字を表現できますが、漢字の場合は2バイト必要だったりします。

1キロバイト(Kilo-Byte、KB)は、1024バイトです。

バイト数は、画面に出てくる写真の実際の大きさ(何センチx何センチ)とは必ずしも連動しません。 大きな写真であれば、それだけ情報量が多いわけですから、バイト数もそれだけ大きくはなります。 しかし、見た目小さな写真でも、画質が大変細かい場合は、やはりバイト数が大きくなります。

ピクセル(pixel、画素)というのは、ディスプレイ上の点を指す画像の最小単位のことです。解像度によって、画素の個数もきまります。たとえば解像度が640x480なら307200個の画素があることになります。

画像を保存する時に、バイト数は50KB以内、ピクセル数は300x300ピクセル以内に収めるように処理すれば、ほとんどの里親募集掲示板に貼れることになります。

多くの里親募集掲示板はバイト数だけに制限がありますから、まずはバイト数を50KB以内にするようにすると良いでしょう。

バイト数やピクセル数は、画像処理ソフトで画像を保存する時に、どこかに必ず表示されるはずです。

画像を小さく/軽くする方法については、お使いの画像処理ソフトのマニュアルをご覧ください。

Adobe Photoshop Elements2 の場合

私が使っている画像処理ソフトは Adobe Photoshop Elements2 というものです。 これしか使ったことがありませんので、他の画像処理ソフトについては全くわかりません。 他のソフトをご使用の方は誠に申し訳ありませんがご自分でお調べください。

デジカメなどで普通に撮った写真は、普通、バイト数があまりに大きすぎてWeb(掲示板など)で使うには適しません。 Web用に保存しなおしてから、掲示板に投稿しましょう。

Elementsの場合は、「Web用に保存」という機能があるので便利です。

photoshop elements

[ファイル]の中に[WEB用に保存(W)]というのがあります。 また、このアイコンをクリックしても同じです。

photoshop elements

すると、こんな画面が出てきますので・・・

photoshop elements

保存しようとしている画像(向かって右)の下のバイト数を確認します。 この例では6.759KBと出ています。 このサイズなら問題ありませんね。

photoshop elements

この数字が大きすぎるなら、50KB以内になるように調整します。

photoshop elements

調整は、横にある欄で行います。

今、この画像は[標準画質]を選んでいます。 もっと荒い=バイト数が少ない画像にするなら[低画質]を、もっときめ細かい=バイト数が多い画質にするなら、[高画質]や[最高画質]を選びます。

その横にある画質欄に直接数字を打ち込むこともできます。 低画質=10、標準画質=30、高画質=60、最高画質=80が目安です。

あまり高画質にすると、表示されるのに時間がかかり見る人に負担をかけますので、里親募集用の写真であれば、標準画質で十分です。

ピクセル数に制限がある掲示板に貼る時で、写真のピクセル数が大きすぎる場合は、下の方の枠にある幅または高さを変更します。

里親募集用の写真であれば、その下の[縦横比を固定]のチェック欄は消さないようにしてください。縦横比がかわってしまうと、動物の写真も変にゆがんでしまいますから。

バイト数やサイズが調整できたら、[OK]をクリックします。 すると、「最適化ファイルを別名で保存」という、こんな画面が出てきますので・・

ファイル

下の欄の[ ファイル名(N) ] に、半角英数字でファイル名を入れて、[ 保存(S) ]をクリックします。(このとき、.jpg 等の拡張子をつける必要はありません)。

なお、この画像がどのフォルダに保存されるのかを確認するときは、上の[ 保存する場所(I) ]欄を見ます。今は 05-09フォルダとなっています。

別のフォルダに保存したい場合は、横の▼をクリックして、保存したいフォルダを選びます。

これで、Web用に写真を保存できました。 こんどこそ、ちゃんと掲示板に添付できるはずです。・・・と、思います・・・

もし、これでも添付できない場合は、どなたか身近な人に教えて貰ってください。よろしくお願いします。

猫

⇒次は:添付ファイルとは

《超初心者の為の掲示板の書き方》目次