【現在2000名】無料のフリーランスコミュニティ『東フリサロン』はこちらからどうぞ!

12. 【SEO一括設定】メタ要素・ソーシャルシェア・XMLサイトマップを設定する

12. 【SEO一括設定】メタ要素・ソーシャルシェア・XMLサイトマップを設定する

こんにちは!フリーランスエンジニア兼ディレクターのショーヘー(@showheyohtaki)です。

この記事は、Web制作初心者のかた向けに『実務で使えるWordPressを使ったサイト制作手法』ついて解説していく連載です。

前回の記事はこちら↓

11. 開発したWordPressサイトを本番環境に移行する

12thステップであるこの記事では、公開したサイトにメタ要素・ソーシャルシェア・XMLサイトマップを設定した後、更にサイトのユーザビリティを向上させていきます。

 

1. プラグイン『All in One SEO Pack』をインストールする

実は今日の課題はこれをインストールするだけで終わりです。

<title>や<description>などのメタ要素・ソーシャルシェア・XMLサイトマップなど、全て『All in One SEO Pack』一つで完結できます。

Webマーケティング業界のレジェンド、バズ部さんが詳しい設定の解説記事を出してくれてますので、こちらを参考に設定してください。

GoogleアナリティクスやSearch Consoleへの登録、XMLサイトマップの送信も必ずやっておきましょう。

 

All in One SEOで設定したメタタグやOGPタグは『wp_head()』関数の中で呼び出されます。

現在header.phpの中に残っている静的なタグと重複しますので、以下のように編集してください。

header.php

コピー
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="format-detection" content="telephone=no">
<?php wp_head(); ?>

<link rel="icon" href="./img/icon-home.png">

</head>
<body>
・
・
・

なお、実案件では本番環境のファイルを直接編集するのは絶対にNGです。

最低限、ローカル環境で開発→動作確認してOKなら本番環境に反映という手順を踏みましょう。

今回もローカル環境でheader.phpを編集した上で、動作確認してから本番環境にアップロードしてください。

サーバー上のファイルを直接編集してエラーを起こすリスクは必ず回避しましょう。

All in One SEO Packの設定とheader.phpのアップロードができたら、サイトの基本的なSEOも無事に完了です。

 

2. クローラーに更新を通知するプラグイン『WebSub/PubSubHubbub』をインストールする

ここまでで、GoogleアナリティクスとSearch Consoleの設定、XMLサイトマップ作成と送信まで完了したので、運用に便利なプラグインも導入していきます。

ページの更新や新規ページの追加があった際、クローラーに素早く通知してくれるプラグイン『WebSub/PubSubHubbub(ウェブサブ/パブサブハブバブ)』をインストールしましょう。

このプラグインは、検索エンジンのクローラーにサイトの更新を自動通知してくれるツールです。

 

いくらサイトを更新しても、検索エンジンにインデックスされていなければ、そのページは存在していないのとほぼ同義です。

クローラーにサイトの更新を素早く通知することで、ページのインデックスを早めることができます。

また、サイトの更新を素早く通知することでコピーコンテンツへの対策にもなります。

せっかく作った記事なのに、内容をパクったコピペ記事の方が早くインデックスされたばかりに、オリジナル記事が検索エンジンからマイナス評価を食らったら嫌ですよね。

そのため、サイトを更新したらすぐにクローラーに通知する必要があるんです。

PubSubHubbub』は、その作業を自動化してくれます。

 

使い方はインストールするだけで、特に設定は必要ありません。

メディアやブログ機能をつけたコーポレートサイトを作ったら、必ず入れておきましょう!

 

3. 画像のリサイズ&圧縮で画像を最適化する

サイズの大きすぎる画像の読み込みは、ページの表示速度の低下、ひいてはユーザーの離脱に繋がります。

特に、Webに詳しくないクライアントの場合、どんな画像サイズでアップロードするかわからないので、メディアファイルのリサイズ・圧縮ができるプラグイン『EWWW image Optimizer』をインストールしておきましょう!

このプラグインのいいところは、自動で新規にアップロードされた画像のリサイズ・圧縮を行ってくれるだけでなく、過去にアップロードされた画像の一括最適化までできるところです。

詳しい設定方法と使い方は、バズ部さんのこちらの記事を参考にしてください。

記事中にもありますが、過去の画像を一括最適化するときは、念のために必ずバックアップを取ってから実行してくださいね!(作業前にAll in One WP MigrationでエクスポートすればOKです👍)

 

また、記事の中で紹介されていませんが、大きすぎる画像は元の容量も大きいので、圧縮をかけても容量は大きいままです。

表示遅延にも繋がりますし、無駄にサーバーの容量を圧迫してしまいますので、大きすぎる画像は自動でリサイズされるよう上限サイズを設定しておきましょう。

 

4. リンクが切れたURLや画像がないかを検知する

サイトを運営していると、むかし貼った外部リンクページが無くなっていたり、内部リンクを貼っていたページのURLを変更したりする場合があります。

そういうリンクを放置していると、リンクをクリックしたユーザーに404ページが表示されてしまうので、ユーザービリティの面でよくありません。

こうした問題のあるリンクを自動検知してくれるプラグインが『Broken Link Checker』です。

インストールするとサイドバーの『ツール』の中に『リンクエラー』という項目が追加され、自動でリンクエラーを検出してくれます。

問題のあるリンクと、そのリンクが含まれているページを表示してくれるので、リンクエラーを検出したら修正するようにしましょう。

リンクエラーの報告・修正は、運用保守プランの『定期検診項目』として含めておくと、Webに詳しくないクライアントにとっても安心ですね。

 

5. キャッシュを有効化してサイトの表示速度を上げる

最後に、キャッシュを有効化してサイトの表示速度を上げていきましょう。

そもそもキャッシュが何かわからない方は、サルワカさんの初心者向け記事を参考にどうぞ。

キャッシュの概要が理解できたら、このキャッシュを有効化するプラグイン『WP Super Cache』をインストールしましょう。

WP Super Cacheの良いところは、無料でモバイル用キャッシュ機能まで付いているところです。

詳しい設定方法は、バズ部さんのこちらの記事をどうぞ。

なお、こちらも記事中で解説されていますが、導入前に必ずバックアップを取ってください。

また、ECサイトにキャッシュを残すとえらいことになるので、ECサイト制作の場合は導入は避けてくださいね。

 

これでメタ要素・ソーシャルシェア・XMLサイトマップを設定と、サイト運用において必要な設定も完了です。

お疲れ様でした☺️

30DAYSトライアルのコンテンツは、皆様からのサポートで運営しています。

今後も良質なコンテンツを作成していきますので、よろしければサポートをお願いいたします。

サポート特典として、【コーディング練習用デザインカンプ】をメールアドレスにお送りします。


LINE@にて限定情報公開中!

CTA-IMAGE 『転職したい!』 『理想的なライフスタイルを実現したい!』 『フリーランスになりたい!』 そういう要望を持っている方向けに、週に1度リアルなお役立ち情報を配信しています。 登録すれば、LINE@限定「最短でプログラマーになるための転職ロードマップ」も確認できます!

WordPressカテゴリの最新記事