今回は、WordPressでトップページ以外の時にh1タグを別のタグに切り替える方法について解説します。
この処理を実装しないとサイト構成によって、SEO評価が悪くなってしまう可能性もあるから、頑張って覚えましょう!
別のタグに切り替える理由と判断基準
判断基準
まず始めに、別のタグに切り替える判断基準について解説します。
Webサイトでよく見られる構造として、ヘッダーで使用している会社名やロゴにh1タグを使うことがあります。WordPressでは基本的にヘッダーは別ファイル(header.php)に分け、各テンプレートに読み込ませて使うため全てのページにh1タグとして表示されてしまいます。
このような構造を取っているサイトは、トップページ以外では別タグに切り替えた方が良いです。(理由は後述します)
ヘッダーではなく、トップページのメインコンテンツにh1タグを使用している場合は切り替えは不要です。キービジュアルにテキストで会社名などを入れているサイトなどが挙げられます。
理由
続いて、なぜ別のタグに切り替えなくていけない理由について解説します。
HTMLのh1タグは、1ページに対して複数設定してもSEO評価が下がることはありませんが、それは正しいh1タグを複数設定した場合です。
例えば、今みなさんが見ているこのページは「【WordPress】トップページ以外の時にh1タグを別のタグに切り替える」というタイトルをh1タグに設定しています。
これはページのコンテンツ内容と一致しているタイトルを設定しているため問題ありませんが、ここにヘッダーの「WEB助」をh1タグに設定した場合を考えてみましょう。
サイトタイトルは、WEBサイトの顔とも言えますがコンテンツ内容と関連性が特にないため不要だと考えるのが無難でしょう。
別のタグに切り替えるコード紹介
<header>
<?php if(is_front_page()): ?>
<h1>
<a href="<?php echo esc_url(home_url('/')); ?>">
<?php bloginfo('name'); ?>
</a>
</h1>
<?php else: ?>
<a href="<?php echo esc_url(home_url('/')); ?>">
<?php bloginfo('name'); ?>
</a>
<?php endif; ?>
</header>
上記コードの一番重要なポイントは、2行目のis_front_pageです。この関数は、閲覧しているページがトップページの場合にtrueを返し、それ以外のページはfalseを返します。
つまり、trueだった時の処理に<h1>タグを使用し、falseだった時の処理に別のタグに置き換えることで、今回の課題「トップページ以外の時にh1タグを別のタグに切り替える」を実装することができます。