2019/08/18 (更新日: 2022/08/09)

【テキトー禁止】ブログの画像サイズは、何ピクセルがベストか【検証】

世界No.1の“本物のオールインワンツール”をゾノ先生と同じように使えるビデオコース「はじめてのコンテンツ作成コース（49,700円相当）」が大人気です。30日間無料の特別招待ページをご用意しているので、下のバナーをタップして詳細をご覧ください！
こちらから確認することができます↓

ブログの画像サイズについて悩んでいる人「何かサイトが重たいなぁ…。画像のサイズを調べてみると、超大きいサイズ（汗）ブログに挿入する画像サイズって、大体どのくらいなのかなぁ。」

今回の記事では、上記のような質問に答えます。

こんにちは、ゾノです。

この記事を書いている僕は、現役でWebデザイナー＆マーケターとして活動しつつ、ブログを運営しながら生活しています。今では、外出せずに学べるパソコン教室を運営し、ブログ初心者に特化したブログ指導活動にも取り組んでいます。

本記事の内容

ブログの画像サイズを意識しないと、サイトが激重になる
ブログの画像サイズは、何ピクセルにすべきか
ブログの画像サイズを意識して、圧縮する習慣をつける

動画で見る（所要時間：9分10秒）

ブログの画像サイズを意識しないと、サイトが激重になる

ブログには、表示速度というものがあります。
ページの表示が遅いと、「もういいや」とブログを閉じられてしまう可能性が高まります。

「PageSpeed Insights」というGoogleのツールで点数チェックできるので、まずはしてみましょう。

ネットサーフィンしていて、「このサイト重たいなぁ」と感じたサイトでチェックしてみた結果がこちらです。

大体の理由が、画像サイズに問題があります

スマホの進化によって、スマホで撮影した画像サイズは超高画質ですね。

例えば、ブログ執筆中にiPhone XSで撮影したこの写真のサイズは、なんと、、、

ヤバめですね。

ちなみに、僕は「横：1200ピクセル（px）」にしています

「PageSpeed Insights」でテストした、当ブログの結果（2019年8月17日の検証結果）

パソコン

スマホ

なぜ、1200ピクセル（px）にしているのかという理由ですが、小さくもなく大きくもなく程よいからです。

あと、Appleのサイトで使われている画像が900〜1500ピクセル（px）で、この平均値が1200だからですね＼(^o^)／

細かいことは、考えなくてOKです

ブログ運営は細かいことを考えすぎると、萎えまくります。

「うぇー、過去記事の画像とかどうしよう…」と思った人もいると思います。

結論：これから気をつければOKです

あとはスキマ時間を見つけて、リサイズしていきましょう。

ブログの画像サイズは、何ピクセルにすべきか

上記で、僕は1200ピクセル（px）にしているという話をしましたが、自分のブログは何ピクセルがベストなのか、疑問に感じると思います。

なので、調べ方を教えます。

１：Google Chromeでブログを開く

「Google Chrome」で自分のブログを開きます。

２：右クリックして「検証」をクリックする

右クリックをすると、メニューが出るので「検証」を押します。

３：画像が配置される「横幅」のサイズを見る

「７５０」と表示されているのがわかります。大体これが目安ですね。
ただ、今はレスポンシブデザインなので、各種媒体でサイズは変動します。なので、若干大きめにしておけばOKです。

※下記の画像は、クリックすると大きくなります。

備考：レスポンシブデザインとは、閲覧者の画面サイズや、Webブラウザに応じてサイズが変動するデザインです。

これで終わりです。

まぁ、時代も５Gになるので、画像サイズがある程度重たくてもサクサク操作できる時代が来ると思いますが、適正サイズで画像を配置するといいと思います。

結論、700〜1600ピクセル（px）でいいんじゃないでしょうか。
画面いっぱいで表示するデザインとかだと、もうちょい大きくですね。

ブログの画像サイズを意識して、圧縮する習慣をつける

大前提として、画像のサイズを意識することが大事です。
そして、大きければ圧縮しましょう。簡単にできます。

２ステップだけです。

ステップ１：画像のサイズをチェックする

ファイルを右クリックする
「情報を見る」をクリックする
「大きさ」でサイズを確認する

ステップ２：画像を圧縮する

僕は、イラレでリサイズする or 「画像を縮小する」という無料ツールで圧縮しています。
» 画像を縮小する

これで、完了です＼(^o^)／

まとめ：ブログの画像サイズは、絶対に意識すべき

面倒だな、、、と思ってもやるべきです。
ちゃんとブログ運営をしていくなら、こういう作業は面倒くさがってはいけません。

サイズ確認する
リサイズする

たった、この２ステップを疎かにする者、ブログを制することはできませんm(_ _)m（過去の自分にも言いたい…）

実際の操作動画も用意していますので、ご覧ください。

動画で見る（所要時間：9分10秒）

画像関係に関する参考記事はこちらです。

最後までお読みいただき、ありがとうございます。「オールインワンWeb集客サイト完全レポート」というレポートが大人気です。ぜひご覧になってくださると嬉しいです。
こちらから受け取ることができます↓

お知らせ：厳選した下記のコンテンツがおすすめです

個人から、中小企業様向けに対応しており、Webメディア構築 or リモートワーク（テレビ会議システム）の導入をご検討の方は、ぜひどうぞ🙇‍

無料コンテンツ

有料コンテンツ

当ブログと他のサイトの圧倒的な違いは、様々な疑問や悩みを解決するために【無料体験レッスン】３０分の無料相談会＆体験レッスン（オンライン開催）に初回限定で参加できることです。

どうしても分からなかったり、１人で悩むことがあればご相談ください。

その他、ご相談＆ご質問がございましたら、お気軽にどうぞ。
» お問い合わせ

無料から学べる「01BLOG COLLEGE」に参加はお済みですか？メディア運営の基礎から応用を、順序立てて学べるオンライン学習サイトです。この機会にぜひどうぞ💁‍♂️

僕は、こんな人です

ゾノ@オンラインティーチャー
オンラインティーチャー養成講師（Kajabi特化型）・メディア運営の基礎・ヒット商品企画。『２〜３歩先を行く実験屋』をコンセプトにオンライン社会を前進。手軽にスマホからも学べる『01BLOG COLLEGE』を運営し生徒は累計約510名。「オンラインで先生開業を目指すための講座」を無料配信中！

チップをいただけると、心から喜びます

無料配信【先生2.0】完全在宅＆好きなことで稼ぎ毎日感謝される働き方【無料】

人気記事【Zoom】会議などの案内メールのテンプレート【セミナー時にも使える】

ブログ参考ネタ｜ワードプレス学習用