画像はWebサイトの「顔の担い手」ですが、適切に扱わなければ、Webサイトを遅くする「お荷物」となり、SEO改善の機会も逃すことになります。画像最適化の核心は、「視覚効果を損なわずに容量を減らし」「検索エンジンに画像の内容を理解させる」ことであり圧縮サイズとaltタグを追加するが最も基本的で効果的な2つの方法である。
まず、なぜ画像を最適化するのか?
このステップに真剣に取り組む前に、まず最適化の重要性を理解することが重要だ:
- 読み込み速度の向上最適化されていない大きな画像は、ページの読み込みに時間がかかり、訪問者は読み込みが終わるのを待たずに離脱する可能性があります(調査によると、53%の訪問者が読み込みに3秒以上かかるページを放棄しています)。
- サーバースペースの節約圧縮画像のサイズが小さくなるため、サーバーのストレージ容量とトラフィックの消費を抑えることができます(トラフィックで課金するサーバーでは特に重要です)。
- SEOランキングに貢献検索エンジン(BaiduやGoogleなど)は画像を直接「読む」ことはできず、テキスト情報(altタグなど)を通してしか内容を理解できないため、画像を最適化することで検索結果での露出を増やすことができる。
- モバイル機器への適応携帯電話のユーザーはトラフィックが限られているため、小さいサイズの画像は読み込みの消費を減らし、モバイル体験を向上させることができます。
第二に、画像圧縮:画質を損なうことなく、音量を下げる。
画像圧縮の原理は、画像から冗長なピクセル情報(肉眼では区別できない色の違いなど)を取り除き、視覚効果を維持したままファイルサイズを小さくすることです。初心者におすすめプラグイン自動圧縮手動操作は必要ない。
方法1:プラグインによる自動圧縮(初心者におすすめ)
推奨プラグイン:SmushまたはShortPixel(無料版で十分)
以(Yǐ) スマッシュ 一例として、手順は以下の通り:

- プラグインのインストール:背景[プラグイン]→[プラグインのインストール]→「Smush」で検索→[インストール]→[有効化]をクリック。
- 基本設定:
- 有効化後、プラグインの設定ページで「新しくアップロードされた画像を自動的に圧縮する」にチェックを入れます(新しくアップロードされた画像は自動的に圧縮されるので、手動で圧縮する必要はありません)。
- バッチ圧縮」をクリックし、「すべての画像を圧縮」を選択します(メディアライブラリにアップロードされた古い画像の場合)。
- 圧縮の完了を待つ:プラグインは、圧縮の進行状況と節約された容量を表示します(例:「50枚の画像が圧縮され、20MBの容量を節約しました」)。
最先端完全自動処理、バッチ圧縮に対応、中小規模のウェブサイトのニーズに応える無料版(Smush無料版は1画像5MBまで、ShortPixel無料版は月100画像まで圧縮可能)。
方法2:アップロード前の手動圧縮(極端な最適化のため)
画像のサイズが特に大きい場合(例えば、カメラで撮影したオリジナルの写真は簡単に10MBを超えます)、ウェブサイトにアップロードする前に、コンピュータで手動で圧縮することをお勧めします:
- オンラインツール(ソフトウェアのインストールは不要):
- タイニーPNG (\ntinypng.com):PNGとJPGをサポートし、圧縮率が高く、画質の劣化が少なく、一度に20枚の写真をアップロードできる。
- 画像圧縮ツール、WebP形式(JPG 30%-50%よりも小さいサイズ)をサポートしています。
- 手続き:
- ツールを開く→画像をアップロードする→圧縮が完了するのを待つ→圧縮された画像をダウンロードする→WordPressのメディアライブラリにアップロードする。
シナリオ手動圧縮は、より正確に画質を制御することができます。
コンプレッション・ノート
- 通常の画像(記事に付随するものなど)は、圧縮されて 200KB以内 以上で、ホームページの全体像のコントロールは終了だ。 1MB以内。
- 優先順位付け WebPフォーマット(WordPress 5.8+はネイティブサポート)、サイズは同じ画質でJPGよりも約50%小さくなります。
- 過度な圧縮を避ける:80%を超える圧縮率は、特にテキストが多い画像(スクリーンショットやインフォグラフィックなど)が不鮮明になる可能性があります。
第三に、altタグを追加する:検索エンジンが画像を「理解」できるようにする。
“altタグ」(正式名称は「alt属性」)は画像の「テキスト説明文」であり、ネットワーク上の問題で画像が読み込めない場合に表示される。より重要なのは、検索エンジンがこのタグを通して画像の内容を理解し、検索結果での画像の順位に影響を与えることです。
なぜaltタグを付けなければならないのですか?
- 例1:「赤いトレーナー」の写真、altタグがない場合、検索エンジンはこれが写真であることしか知らないかもしれない。altタグ「赤いトレーナー軽量で通気性が良い」を追加すると、検索エンジンは「赤いトレーナー」に関連する検索キーワードと関連付けられる。赤いトレーナー」関連の検索キーワード
- 例2:画像の読み込みに失敗した場合、訪問者はaltタグのテキストを見て、(空白や「画像を表示できません」アイコンの代わりに)画像がどうあるべきかを知る。
altタグはどのように追加するのですか?
方法1:画像のアップロード時に直接追加する(推奨)

- 画像をアップロードし(メディアライブラリまたはエディタ経由で)、画像設定ポップアップウィンドウで代替テキスト(つまりaltタグ)入力ボックスを見つけてください。
- 説明を記入してください:
- 簡潔かつ正確に(10~15文字程度が適切)、画像の核となる内容を含める(例:「社屋の正面」「2023年製ノートパソコンの外観」)。
- キーワードの積み重ねは避けること(例えば、「WordPress ウェブサイトビルダー ウェブサイトデザイン会社」は無効な説明文として)。
- 画像が装飾的な場合(例:仕切り、背景パターン)、空白のままにするか、「装飾画像」と記入してください(検索エンジンに誤解を与えないため)。
- 投稿に挿入」をクリックすると、altタグが自動的に有効になります。

方法2:アップロードされた画像のaltタグを追加/修正する
- メディア]→[ライブラリ]で修正したい画像を探し、画像をクリックして編集画面に入ります。
- 右側の「代替テキスト」ボックスに内容を記入または修正し、[更新]をクリックします。
altタグ vs タイトル vs キャプション:混同しないように!
多くの初心者はこの3つの概念を混同し、単純に区別している:
- altタグSEOに影響する検索エンジンや負荷の不具合については、必ず記入してください。
- タイトル画像の上にマウスを置いたときに表示されるテキスト(オプション。)
- 説明(キャプション)写真の下に表示されるテキスト(写真のキャプションのようなもの。)
IV.初めての方によくある質問
- すべての画像にaltタグを付ける必要がありますか?ほとんど。純粋に装飾的な画像(無地の背景や縁取りなど)は別として、実際のコンテンツを含む画像(商品画像、人物画像、風景画像など)は、SEOの基本要件として追加する必要がある。
- 圧縮後に写真が不鮮明になった場合はどうすればよいですか?圧縮強度を下げる(圧縮率はプラグインで調整可能)か、手動圧縮ツール(TinyPNGなど)で再圧縮して、より高い画質を保つ。
- WebP形式の画像が古いブラウザで表示されない?WebPはモダンブラウザ(Chrome、Edge、Firefox、Safari 14+)でサポートされており、古いブラウザ(IEなど)は過度な心配なしにほとんど使用されていません。互換性のために、自動的に古いブラウザ用のJPGの代替を提供するプラグイン “WebP Express ”をインストールしてください。
- 画像最適化後、サイト速度に変化なし?他の要因(サーバーが遅い、プラグインが多すぎるなど)も考えられますので、まずはGTmetrixツールで「画像サイズ」が主な問題かどうかを確認してみてください。
画像の最適化は「ローコスト・ハイリターン」の作業です。プラグインの設定とaltタグの追加に10分費やすだけで、サイトのスピードとSEOパフォーマンスが劇的に向上します。アップロードして最適化する」習慣を身につければ、あなたのサイトは訪問者や検索エンジンの人気を集めるでしょう。