【即解決】ブログ画像の最適サイズと容量！圧縮方法も紹介

この記事１つでブログにおける画像について解決することができます。盛り込んだ内容になっているので最後まで読んでください。これからブログ画像サイズについて紹介するのですが、その前にブログの画像がなぜ重要なのかについて簡単に紹介しておきます

「画像を最適化することでＳＥＯにプラス影響が働く」と聞いたことがあるでしょう。ブログの画像を最適化するメリットは主に2つあります

ブログ画像最適化は「読者のため自分のため」と覚えておけばＯＫ！

それでは具体的に画像について紹介していきます。読むだけでなく実際に手を動かしながら確認すると覚えやすいので記事を見ながら同時に作業することをオススメします

ブログで必要な画像作業全て解決（画像圧縮・サイズ変更・フリー素材・デザイン・ファイル指定）はCanvaで可能7500万点の素材が無料

最適な画像サイズは自身のブログ横幅を確認

画像の最適なサイズはブログにより異なります。基本的に自身のブログの横幅サイズに合わせます。とは言えベースのサイズを知りたいことでしょう

画像サイズは横幅1000px以下で調整

大きなサイズで画像を貼った場合は調整されるのですが、逆に小さなサイズでアップロードしてしまうとそのまま表示されるため自身のブログ横幅を知っておかなければいけません

このようにブログの画像サイズを誤ってしまうと見にくくなります。解決策はブログの横幅を確認してサイズを知っておくこと。そうすれば自分のブログの横幅を確認することができるのか、それはとても簡単なので紹介します

「検証」でブログ横幅を確認

横幅の確認はとても簡単です。ＰＣで自身のブログを管理画面ではなく検索エンジンから開きます。サイトを開けば「右クリック」

右クリックでサイト検証
GoogleChrome→右クリック「検証」
Bing→右クリック「開発者ツールで調査する」

上記の画像の説明をします。まず右クリックをして「検査」を選択するとツールが表示、ツール左上の「カーソルマーク」をクリックしてページに当てると色別でサイズを確認することが可能になります

記事の横幅を確認するためには青色部分を確認

当ブログ（エヌブログ）の横幅は700px←検査の青色部分で確認

このブログの場合は横幅が700pxなので画像サイズはそれに合わせる形になります。もし700pxを超えたサイズでアップロードした場合は調整が入り勝手に700pxとなります

画像容量は200K以下

画像の容量は200KB(キロバイト)以下にすると覚えておいてください

これらは個人的に調べたものです。しかし基本的に容量は200KBより大きくなると考えておいてほしい。200KBを目安にした場合上記の方法で画像をそのままブログにアップロードするとどうなるかは理解してもらえるはず

画像は小さい容量であればあるほど良い！容量を気にせずバンバン画像を貼っているとあなたのブログはいずれ鉛のように重くなってしまう

画像容量を小さくすることでブログ全体が軽くなりページ速度が上がります。速さの重要性についてはGoogleが掲げる10の真実で、「遅いよりも速いほうがいい。」と紹介されています

画像の種類はPNGまたはJPGを使い分けろ

画像の種類はPNGまたはJPGを使用するようにしてください。理由は両者ともメリットがあるからです

場合によってはPNGがいいし、また別のところではJPGが良かったりします。そんなこと言って結局どちらにすればいいんだよと思ったあなたにどちらを優先的に利用するべきかお教えしよう

結論、ブログ画像はJPGを使う。場合によりPNGを利用

理由は簡単でJPGの方が軽いからです

画像の綺麗さは両者にあまり差は無く少しだけJPGの方が軽い。ブログの画像は極力画像を軽くすることが望ましいためJPGが良し

ぶっちゃけブログにおいて画質は重要ではない。軽さが命

軽い画像を用いればページ速度が向上して読者が読みやすい、そして多くの読者が読んでくれることであなたのブログが評価される、まさにWinWin

とはいえブロガーさんによって画質をこだわる人もいるでしょう。そんな方のためにPNGとJPEGの特徴を紹介しておきます。下記を参考にしてそれぞれ使いわけしてみるといいでしょう

ブログに用いる場合、テキストを入れるかどうかで悩むことが多いはず。画像を入れるならPNGで入れないならJPGを使うと知っておくと今後便利でしょう

ここまでのおさらい
1‘　画像サイズは自身のブログ幅を確認
2　画像容量は200KB以下
3　基本JPG使用
3‘　画像にテキストを入れるならPNG

ここまででブログ画像の知識を習得できました。次に画像の圧縮方法について紹介します

ブログに載せる画像は至るところから引っ張ってきますよね。スマホで撮影・スクリーンショット、フリー素材サイトからダウンロード、ＰＣでスクリーンショットなどなど

画像容量のところで説明した通り画像を引っ張て来た時点だと容量が大きいです。そのまま画像をアップロードするのではなく圧縮作業を挟んでからブログに貼り付けます

次に画像圧縮法について教えます

画像圧縮におすすめな方法

画像を様々なところからダウンロードすると思います。ダウンロードした際の画像容量は大きいためそのままブログに貼ると重たくなってしまいます。ですから圧縮作業が必要

圧縮におすすめなのはTinyPNG(タイニーピング)！画像を綺麗に圧縮できるサイトです←無料

⇨　タイニーピングはここから

使い方はとても簡単。上のマークに画像をアップロードした後ダウンロードするだけ

1.8ＭＢもあった画像が約90％圧縮され173ＫＢになりました

ドロップできる画像はPNG・JPEG・WebPです。ブログに必要な画像はここで圧縮すればＯＫ！まず使ってみると良いでしょう

Canvaはデザインで生産性を向上 だけでなく圧縮・ファイル指定・サイズ変更・素材使い放題ブログで必要な作業をココ１つに凝縮されたプラットフォーム

ブログ画像に関する知識と圧縮方法まで終わりました。これで今後ブログ運営をする時画像に困りません。でも中にはすでにブログを数か月以上運営していて重たい画像をそのまま貼って困っている人もいることでしょう

ブログ画像に関するＱ＆Ａに答えていきます

ブログ画像Ｑ＆Ａ

ブログ画像の質問に答えていきます

1⃣：すでにアップした画像を最適化したい
2⃣：どのページの画像が重たいか知りたい

それでは回答していきます

すでにアップロードした画像を最適化したい

すでにアップロードした画像を軽くするにはプラグイン「EWWW Image Optimizer」を使おう！

「画像を最適化」をクリックすれば過去にアップロードした画像を一括で最適化してくれます。処理がとても速いのが特徴なので活用あるべきです

これまでに膨大な画像を貼っているのであればこれ１つでOK！まずはインストール

自動ですべての画像を最適化してくれて便利ですが、自分の目で数値として本当に自分のブログ記事速度が早いのか気になるという方もいるでしょう。そんな方は次で説明する方法で遅い記事を確認してください

どのページの画像が重たいか知りたい

すでに記事をたくさん作っていてどのページの画像が重たいか１から調べるのが面倒。そもそも画像サイズの調査方法がわからないといったところでしょう

新しくツールやプラグインを入れる必要はありません

使うのは、みんな大好きGoogleアナリティクス！これを使えば画像サイズが大きいページを発見することができます。まずGoogleアナリティクスを開きましょう

遅いページのURLが記載されているためその記事の画像を改善してください。 確認することは①画像幅②画像サイズ（200KB以下にする）⓷画像種類（PNG or JPG）

ここまで対策すればあなたのブログ速度は以前よりも大幅に解決されます。この記事で紹介したこと全てを試してください

デザイン・サイズ変更・圧縮・ファイル指定全てCanvaで解決！

当ブログはCanvaを使用しています。ブロガー・デザイナーに最高のパフォーマンスを提供してくれるため多くの人が利用しています

有料フリー素材サイトと違う点は「デザイン・圧縮・ファイル指定・サイズ変更」ができる点。これって全部ブログでいる要素なんですよね

画像ダウンロードは素材サイトで圧縮は別サイト、サイズ変更はツールを使って、、、、ぶっちゃけめんどくさい。できることなら素材集め～画像最適化を全て１つにまとめたい、そんな方はCanva利用一択しかありません

素材が少ないんじゃない？と不安に感じるかもしれまんせんがCanvaには7500万点以上の写真素材があります。さすがに多すぎ

参考ブログ初心者のためのSEO講座【準備運動編】

続きを見る

参考ブログアフィリエイトするならASP登録必須【厳選6社紹介】

続きを見る

参考ブログ初心者のためにキーワードの選び方を解説

続きを見る

当ブログ使用テーマ

余談ですが、今回の記事で使用した画像サイズは620KB（13枚）