WordPressブログの画像を最適化する7つの施策【まとめ】

  • URLをコピーしました!
はじめ

WordPressブログに挿入する画像を最適化したい。
WordPressに挿入するまでの流れや手順がわからない。
ブログに適している画像のサイズ・大きさもわからない。

本記事では、上記のようなブログに使う画像に関する様々な疑問を解消することができます。

この記事を読めば、私が普段から心がけて実践している画像の最適化する施策を知ることができますよ。

お洒落なサイトが誰でも作れる!

ブログを書くのが楽になるテーマ「SWELL」

  • 誰でも簡単にオシャレなブログが作れます!
  • WordPressの使いやすさがアップします!
  • キャッシュ機能とページ高速遷移機能で初心者も簡単にWordPressの高速化が可能です!
  • アフィリンクの一元管理機能が標準装備されてます!

\一度使うと他のテーマには戻れません!/

※実際に私の当ブログは「SWELL」を使って運営しており、大満足のテーマです!

この記事を書いてる人

溝口 剛
Tsuyoshi Mizoguchi

   

1986年生まれ 33歳 札幌在住
8年間会社員として働くも会社員としての生き方が嫌になり、フリーランスへ。現在はブログより年間1,000万円の収益を得ています。

この記事の内容

1. WordPressブログにおすすめのフリー画像素材はこの4サイトOK!

WordPressブログにおすすめのフリー画像素材は以下の4つです。

正直、この4つのサイトを覚えておけばブログ運営で画像素材に困ることはないと言っても良いです。

ちなみに、私のこのブログで使用している画像も全て「ODAN」のものです。

アフィリエイト初心者の方は是非参考にしてみてください。

フリー画像サイト・アイコン画像サイトについて以下の記事でお話していますので、詳しく知りたい方は参考にしてみてください。

2. WordPressブログの最適な画像サイズを調べる方法

WordPressブログの中に挿入する画像は大きく分けて2種類あり、調べる方法も2つです。

  • 文章中に挿入されている画像(デベロッパーツールを使う)
  • アイキャッチ画像(「function.php」の記述を確認)

こちらの画像のサイズは使用しているWordPressのテンプレートによってサイズが異なるので、

綺麗な画像配置にするためには画像のサイズをしっかりと把握することが大事です。

2-1. WordPressブログに挿入する最適な画像のサイズを調べる方法

WordPressブログに挿入する最適な画像のサイズを調べる方法は、Google Chromeに備わっているデベロッパーツールを使い調べていきます。

Google Chromeを使った場合ですと、以下の手順ですぐに最適な画像サイズを調べることができます。

  1. 調べたいブログにアクセスします
  2. Google Chromeの「検証」を開く
  3. 記事の「Body」の横幅サイズを確認する

WordPressブログに挿入する画像サイズの調べ方は、以下の記事で詳細に解説していますので参考にしてみてください。

2-2. WordPressのアイキャッチ画像のサイズを調べる方法

アイキャッチ画像のサイズを調べるためにはWordPress管理画面の「外観→テーマ編集」の「function.php」内の記述を確認することで調べることができます。

アイキャッチ画像のサイズを調べ方は以下の方法です。

  1. 「function.php」を開く
  2. サムネイルサイズ(set_post_thumbnail_size)のコードを確認する
  3. 「set_post_thumbnail_size」のコードがない場合

また、先ほど記事内の画像の調べ方でもご紹介したデベロッパーツールを使っても、アイキャッチ画像のサイズを調べることができますので、やりやすい方でOKです。

WordPressのアイキャッチ画像のサイズを調べる方法については、以下の記事で詳しく解説していますので、参考にしてみてください。

3. WordPressブログの画像を軽量化・圧縮する方法【必須】

WordPressブログに画像を挿入する際に必須の工程が「リサイズ→圧縮」です。

この作業を飛ばしてしまうと、画像を重たいまま使用することになり、ブログの表示速度が遅くなる最大の原因となります。

なので、WordPressブログに画像を挿入する際は、必ず「リサイズ→圧縮」を行うようにしましょう。

画像の圧縮におすすめのツール・プラグインは以下の通りです。

  1. Optimizilla(アップ前の圧縮)
  2. TinyPNG(アップ前の圧縮)
  3. iLoveIMG(アップ前のリサイズ)
  4. EWWW Image Optimizer(アップ後の圧縮)

ブログ画像の軽量化・圧縮はこの4つのツールとプラグインの知っておけばOKです。

こちらの4つの画像を軽量化・圧縮するツール・プラグインの詳しい使い方は、以下の記事で解説していますので参考にしてみてください。

4. おしゃれなアイキャッチ画像の作り方とデザインのコツ

ブログの個性・雰囲気・デザインに大きく関わっているのが「アイキャッチ画像」です。

そして、おしゃれなアイキャッチ画像の作り方のコツは「画像の上にテキストを配置する」というものでOKです。

簡単ではありますが、ユーザーに記事の内容が伝わりやすくなり、デザイン性も向上するのでおすすめです。

アフィリエイト初心者のうちは、アイキャッチ画像にそこまで力を入れる必要はありませんが、中級者以上の方は、アイキャッチ画像を自身で作成編集することを私は推奨しています。

1画像の何時間もかけるのは正直無駄な時間ですので、サクッとおしゃれにわかりやすいアイキャッチ画像を目指しましょう。

無料ソフト・ツールで簡単に作ることが可能で、慣れてしまえば非常に簡単です。

そして、おしゃれなアイキャッチ画像を作るのにおすすめのツールは以下の通りです。

おしゃれなアイキャッチ画像の詳しい作り方・編集ソフトの使い方については以下の記事で解説していますので参考にしてみてください。

5. WordPressに挿入した画像に枠線を付ける方法

WordPressに挿入した画像に枠線を付けたい時は、CSSで簡単に設定することができます。

全ての画像に枠線をつけることも可能ですし、特定の画像だけにつけることも可能!

画像に枠線をつける方法は以下の手順です。

  1. CSSにコードを追記する。
  2. 枠線を付けたい画像のCSSクラスを指定する。

ブログを運営していくと、挿入した画像が背景と同化してわかりづらい、挿入画像を目立たせたいと感じる時があります。

そんな時には、CSSで枠線をつける方法は非常に便利です。

WordPressに挿入した画像に枠線を付ける方法の詳細については、以下の記事で解説していますので参考にしてみてください。

6. WordPressのプロフィール画像の設定方法

WordPressのプロフィール画像を設定を簡単にしてくれるプラグインが「Simple Local Avatars」です。

WordPressでプロフィール画像を設定するためには、「Gravatar」というサービスを利用する必要がありますが、英語サイトだし、登録が面倒と感じる人も多いでしょう。

その手間を省いてくれるのがプラグイン「Simple Local Avatars」です。

「Simple Local Avatars」を使ったプロフィール画像の設定方法は以下の手順です。

  1. プラグイン「Simple Local Avatars」をインストール
  2. WordPress管理画面の「ユーザー一覧」からプロフィール画像を設定したいユーザーを選択
  3. 「プロフィール」の中のUpload Avatarからお好みのプロフィール画像を選択する

ブログのプロフィール画像を軽視している方も多いですが、ユーザーは「このブログは誰が書いているのだろう?」という疑問を持つ可能性が高いです。

その時にプロフィール画像が設定され、著者情報が記載されていることでブログの信頼性につながります。

近年のSEOでは、E-A-T(専門性/権威性/信頼性)が重要であるといわれていることから、ブログの著者情報を示すプロフィール画像の設定は必須なのです。

WordPressのプロフィール画像をプラグインで簡単に設定する方法の詳細については、以下の記事で解説していますので参考にしてみてください。

7. 知っていると便利!WordPressの画像に関する「プラグイン」

その他にWordPressにてブログ運営をしていく中で、知っておくと便利な画像に関するプラグインをご紹介。

  1. WP Pixabay
  2. Easy FancyBox

7-1. WordPressに簡単に画像を挿入できるプラグイン「WP Pixabay」の使い方

1つ目が画像の挿入が簡単になるプラグイン「WP Pixabay」です。

「WP Pixabay」を使えば、フリー画像サイト「pixabay.com」にアップされている画像素材をブログの記事内に簡単に挿入することができます。

そのため、画像をPCに保存してからWordPressにアップするという手間を省くことができます。

「WP Pixabay」の使い方は以下の通りです。

  1. 「WP Pixabay」をインストール→有効化する
  2. 「pixabay.com」で自身のAPI Keyを取得する
  3. 「WP Pixabay」にAPI Keyを入力する
  4. 記事に「WP Pixabay」を使い、画像を挿入する

「WP Pixabay」を使うことで、サーバーに画像ファイルをアップロードしなくて済むため、サーバーの容量節約にもつながるというメリットもあります。

WordPressに簡単に画像を挿入できるプラグイン「WP Pixabay」の使い方の詳細については、以下の記事で解説していますので、参考にしてみてください。

7-2. 画像を拡大(ポップアップ)させるプラグイン「Easy FancyBox」の使い方

2つ目がブログに挿入した画像を拡大(ポップアップ)させるプラグイン「Easy FancyBox」です。

例えば「Easy FancyBox」を使えば、ブログの記事内では小さくて見えずらいという画像を拡大することができるようになるので、ユーザビリティも向上します。

「Easy FancyBox」の使い方は以下の通りです。

  1. 「Easy FancyBox」をインストールする
  2. 記事に拡大させたい画像を挿入する
  3. 画像のリンク先を「メディアファイル」にする
  4. 画像に説明文を入れる時は「代替えテキスト」に入力

「Easy FancyBox」は、特に解説系記事などで重宝するプラグインです。

画像を拡大(ポップアップ)させるプラグイン「Easy FancyBox」の使い方の詳細については、以下の記事で解説していますので、参考にしてみてください。

まとめ

今回は、WordPressブログの画像を最適化する7つの施策についてお話してきました。

ブログで稼ぐためには、ユーザーに記事を読んでもらう必要があります。

ユーザーの滞在時間が延び、ユーザーからの信頼が高まれば、上位表示される可能性も高まります。

そんなユーザビリティを高めるのに重要な要素が「ブログの画像」です。

なので、文章(コンテンツ)が重要なのは当たり前ですが、ユーザーがより見やすいように画像をしっかりと使うこともブログで稼いでいくためには重要なポイントなのです。

【PR】現役ブロガーの実践ノウハウをこっそり教えちゃいます。

当サイトでは、私が月7桁稼ぐまでに至ったノウハウ・現在実践しているノウハウを「ツヨシウェブSHOP」で有料コンテンツとして販売しております。実際にブログで月7桁稼いだ実績を持っており、また現在もブログ収益で生活をしていますので情報の信頼性は高いと感じています。

しかし、有料コンテンツで提供している情報は「楽して稼ぐ!」というものにはなっておらず、これから私と同じようにブログ・発信者として生活していきたい方に向けて書いておりますので「継続的に作業できる方のみ」ご購入いただければ幸いです。

また、コンテンツには自信を持って提供させて頂いておりますので、もし購入後ご不満がございましたら「返金対応」させて頂きます。

月7桁をを達成したサイト設計方法です!

初心者のための「サイト設計方法」月7桁を実現するブログの作り方を解説。

  • 見込み客→キーワード選定→サイト導線が重要。
  • 「成約から近い見込み客」の考え方について解説。
  • 狙うべきキーワードについて解説。
  • サイト導線の考え方について解説。

\月7桁を達成したサイト設計方法が学べます!/

初心者のための「サイト設計方法」月7桁を実現するブログの作り方を解説。
  • 見込み客→キーワード選定→サイト導線が重要。
  • 「成約から近い見込み客」の考え方について解説。
  • 狙うべきキーワードについて解説。
  • サイト導線の考え方について解説。

\月7桁を達成したサイト設計方法が学べます!/

初心者のための「サイト設計方法」月7桁を実現するブログの作り方を解説。
  • 案件を選ぶ際の7つのポイントが学べます。
  • 購入されやすい商品の特徴。
  • 案件選びで重要な見るべきポイント。
  • 案件を取り組む際に確認すべき事項。

\アフィリ案件を選ぶ秘訣が学べます!/

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
この記事の内容
閉じる