Home » ご案内 » 画像について

ご案内

画像について

ブログに画像を載せる時などに、役立つかもしれません。

画像の解像度とファイルサイズ(容量) その3

10 3月 2009

Webでは、「画像の解像度=パソコン上での画像の見え方」みたいな感じに思ってもらってもよいかもしれません。

デジカメで撮影する時、
「画像サイズ」「画像画素数」「画像ファイルの大きさ」・・・『ピクセル(画素)』を設定しますね。

大きいのを選択すると、どうでしょう・・・、
2272×1704px(ピクセル、画素)とかでしょうか?
それとも3872×2592px(ピクセル、画素)とかでしょうか?
これらの大きさは、「印刷用」です。Webで使用する場合は「かなり」大きすぎます。

これらの大きさを設定して撮影したものを、ブログなどでアップしたい場合、「大きさを調整」する必要がありますね。
そうですね。
「その2」で申しましたように、大きくても「640×480px(ピクセル)」くらいまで縮小する必要があります。

どうやって調整するのか??

「画像 ツール 無料 ブラウザ」などの組み合わせで検索してみてください。
Photoshopなどのソフトがなくても大丈夫。簡単にブラウザ上で画像加工できる無料ツールがたくさんありますよ。

ここからちょっと、おまけです。

同じ解像度の画像でもファイルサイズ(容量)によって見え方が違う場合。

ファイルサイズ(容量)が22kB(キロバイト)

ファイルサイズ(容量)が22kB(キロバイト)

ファイルサイズ(容量)が6kB(キロバイト)

ファイルサイズ(容量)が6kB(キロバイト)

いかがですか?
上の22kB(キロバイト)の方が、綺麗に見えますね。

次に、同じ解像度の画像でファイルサイズ(容量)が違っても、それほど見え方に差がない場合。

ファイルサイズ(容量)が84kB(キロバイト)

ファイルサイズ(容量)が84kB(キロバイト)

ファイルサイズ(容量)が22kB(キロバイト)

ファイルサイズ(容量)が22kB(キロバイト)

今度はどうですか?
84kB(キロバイト)、22kB(キロバイト)とファイルサイズ(容量)の違いがあっても、それほど見え方に差がありませんよね。

「それがどうした?」

と言われるかもしれませんが、
Webでは「解像度」も、それから「ファイルサイズ(容量)」もそれほど大きくなくても、『それなりに見える』ということなのです。

画像の解像度とファイルサイズ(容量) その2

16 2月 2009

Webサイトに載せる画像の解像度の上限は、横幅480px(ピクセル)まで、あるいは縦幅480px(ピクセル)までがよいのではないかな・・・と思います。

普段、デジカメで撮影される時、今撮った画像がWebで表示した場合どれ位の大きさで表示されるか?
なんて、考えながら撮る方はよほどの方だと思います。

ほとんどの方は、
大きなサイズの方がいいかな?とか、
画質モードは「FINE」の方が綺麗かな?
などと、「良い条件」で撮影されることが多いかもしれませんね。

「良い条件」=「印刷する場合」と思ってもらってもいいかもしれません。

「Webで使用する場合(HPやブログの記事内に載せる画像)」は、それほど「良い条件」で撮らなくても、PCのディスプレイ上では「それなりに綺麗な画像」に見えますよ。

下の画像は320×240px(ピクセル)です。

QVGA

デジカメで一番小さい画像サイズを選択して撮影したとしても、その画素数が640×480px(ピクセル)なら、上の画像の4倍の大きさ(幅が2倍、高さが2倍)に表示される、って事ですね。

画像の解像度とファイルサイズ(容量) その1

15 2月 2009

デジカメを気軽に持ち歩いたり、
携帯電話のカメラの性能が昔に比べてかなりよくなってる今日この頃ですが、

ブログに画像を載せる時、どうされてますか?

「よし今日の記事に画像を載せよう!」
と思われた時、
携帯でパシャッしてPCに送って、その画像をブログにアップ!
が一番お手軽だと思います。
(携帯で投稿可能の方はそのまま投稿出来て楽ですね。)

携帯のカメラを立ち上げ、まず「サイズ(画像サイズ)」を選択しましょう。

ブログに載せる画像の解像度は人それぞれのお好みでよいのですが、
だいたい「QVGA」前後を選択されると、
失敗は少ないかな・・・、
と思います。

ちなみに「QVGA」というのは、320×240px(ピクセル)の解像度のこと。

こんな感じの大きさです。

QVGA

Webサイトに載せる画像の解像度の上限は、横幅480px(ピクセル)まで、あるいは縦幅480px(ピクセル)までがよいのではないかな・・・と思います。

Valid XHTML 1.0 Transitional 正当なCSSです!