育児ブログに最適な画像サイズを確認する

育児ブログに最適な画像サイズを確認する

f:id:marubaff:20180812234030j:plain

画像サイズの最適化@双子育児おやじのまるばです。

macに標準インストールされているPhotoScapeXで作りました。

当ブログのテーマ

このブログははてなブログで、テーマは「ZENO-TEAL」を使っています。

画像は大きいと綺麗ですが、容量が大きくなり読み込みが遅くなります。

しかし画像が小さすぎると、見辛くなります。

そこで最適なサイズを検証しました。

検証方法

オリジナル画像を、PhotoScapeXでリサイズしました。

縦と横の比率はオリジナルの比率16:9を維持しています。

ファイルの保存形式はjpgのまま変更していません。

サイズの変更のみで、圧縮などはおこなっていません。

画像

オリジナル画像は、1280px×720pxのjpgファイルです。

オリジナルのファイル容量は348KBです。

1280px ×720px( 348KB)

f:id:marubaff:20180812233131j:plain

オリジナル画像です。 

1024px ×576px( 241KB)

f:id:marubaff:20180812233608j:plain

800px ×450px( 156KB)

f:id:marubaff:20180812233735j:plain

720px ×405px( 142KB)

f:id:marubaff:20180812234030j:plain

自分のパソコンで見た時に最適なサイズ

700px ×394px ( 137KB)

f:id:marubaff:20180812234138j:plain

 パソコンの場合、記事幅が720なので、余白ができます

640px ×380px( 121KB)

f:id:marubaff:20180812233248j:plain

500px ×281px( 79KB)

f:id:marubaff:20180812233923j:plain

400px ×169px( 34KB)

f:id:marubaff:20180813001257j:plain

300px ×225px( 55KB)

f:id:marubaff:20180812233412j:plain

200px ×113px( 19KB)

f:id:marubaff:20180813000838j:plain

スマホでも余白ができる

100px ×56px( 8KB)

f:id:marubaff:20180813000341j:plain

50px ×28px ( 5KB)

f:id:marubaff:20180813000555j:plain

モザイクっぽくなる

10px ×6px ( 4KB)

f:id:marubaff:20180813001421j:plain

見えない

まとめ

僕のブログの場合、記事幅にぴったりの最適画像サイズは「720px ×405px」だと思います。

皆さんも自分のブログなどの最適画像を調べてみてはいかがでしょうか。

ブログ運営カテゴリの最新記事