WebサイトのSEOを劇的に改善する全136項目のチェックリストを公開

デジタルマーケティングの中でも代表的な施策の一つがSEO。SEOの基本は「ユーザーの検索意図に応えられる高品質のコンテンツを提供すること」に変わりはありませんが、忘れてはならないのがWebサイト自体のSEOパフォーマンスです。

内部対策やテクニカルSEOと呼ばれる施策で、ルネイムでは「技術を用いてユーザーのサイト内体験を向上させる施策」と定義しています。GoogleもUX向上を検索エンジンにおける至上命題と捉えており、アルゴリズムもそのように変化しています。

そこで、WebサイトのSEOパフォーマンスを高める全136項目のチェックリストを公開しました。私たちが顧客様のWebサイトを改善する際も使用しているチェックリストで、必ずと言って良いほど、改善後のSEOパフォーマンスを高めることに成功しています。

なお、本チェックリストで紹介している多くの施策は、コーディングに関する知識を有していることが前提です。社内での対応が難しい方は、制作会社などの外部パートナーと本チェックリストを参考に取り組んでいただければと思います。

下記よりメールアドレスの入力のみ（会社名・氏名等は不要）でダウンロードできますので、お役立ていただけますと幸いです。

サイト全体

本チェックリストの約3分の1に該当し、①信頼性②サイト構造③URL構成④ユーザービリティ⑤モバイルフレンドリー、の5項目に分けて紹介しています。改善工数は多いですが、SEOへの影響範囲が広いため、着手できるものから取り組んでいただきたいです。

信頼性

企業が、社外向けの情報を公開するWebサイトの信頼性は重要です。サイト閲覧時のセキュリティ・運営会社情報の充実・エラー対策など、企業として最大限考慮すべき事項であり、本項目では以下のようにまとめています。

• 常時SSL化（https）を設定
• 「.co.jp」「.com」「.jp」などの一般的なドメインを利用
• アクセス不可（エラー等）ページを削除
• サイトの運営元情報（会社情報）を可能な限り詳しく掲載
• 各ガイドラインを掲載（プライバシーポリシーやソーシャルガイドライン等）
• ページ内に暗号化されていない（http://から始まる）ファイル・サイトへのリンクを記載しない
• ページ内のJavascriptエラーを放置しない

サイト構造

サイト内のコンテンツを正しく検索エンジンに伝える取り組みをクローラビリティ最適化と呼び、検索エンジンのクローラー（情報を探すロボット）が巡回しやすい構造のサイトを目指します。言い換えるなら、サイト内に案内標識を立て、クローラーが迷わないように交通整理をする取り組みです。

検索エンジンは、日々膨大な数のWebページをクローラーが巡回し、あらゆる指標に基づいて検索順位を定めています。可能な限り早く・正確にサイト内のコンテンツを把握してもらうことが重要です。

そんなサイト構造について、チェックリストでは以下の項目を設けています。

• 制作者からサイトマップ及び導線図が共有されており、流入箇所とCVの定義が共通化されている
• パンくずリストを作成し、構造化データとして設定
• パンくずリストには、該当ページの概要を記述
• XMLサイトマップを作成
• robots.txtファイルを作成
• セマンティックなhtmlのコーディングをする
• htmlタグにlang属性を設定
• DOCTYPE宣言を記述
• meta charset属性を記述
• ページネーションを正しく設定
• 使用しないタグを削除
• 第３者配信ソースの最小化
• hreflang属性を記述
• viewportを設定
• OGPシェア用の各種タグを設定

URL構成

URL構成はSEOにも影響し、Google検索セントラルでも、シンプルでユーザーが分かりやすいURL構成を推奨しています。下記ページに、複数の推奨例・非推奨例があげられていますので、あわせてご確認ください。

URL構成は、以下の項目を実施してください。

• URLにページ内容が分かる名称を付与
• URLは英数字で記載
• ドメイン(wwwの有り・無し)を統一
• 重複ページURLの正規化（canonicalを付与）
• ページネーションURLの最適化
• リダイレクト回数の最小化（最大5回）

ユーザビリティ

ユーザビリティは、一般的に「使いやすさ」を意味する言葉として使用されていますが、国際規格のISO 9241-11では以下のように定義しています。

特定のユーザが特定の利用状況において、システム・製品又はサービスを利用する際に、効果・効率及び満足を伴って特定の目標を達成する度合い

ここでは、「Webサイトのユーザビリティ＝ユーザーが迷うことなく目的のページへ到達しやすく、ストレスを感じずに操作できる仕様を実現する取り組み」と定義して、以下の項目を設けています。

• グローバルナビゲーションを設置し、スクロール固定
• グローバルナビゲーションに重要ページへのリンクを記載
• グローバルフッターを設置
• グローバルフッターに簡易的なサイト情報及び基本ページへのリンクを記載
• 視認性を考慮したテキストサイズ、太さ
• ユニバーサルデザインを意識したデザイン
• ファーストビューに（ = スクロールせずとも）メインコンテンツが見える
• フォントのジャンプ率・種類を統一
• padding, marginのサイズを統一
• デザイン４原則（整列・近接・対比・反復）などのように、規則性と統一感のあるデザインとなっている
• 使う色が４色以内に収まっている
• 色の配分がメイン：サブ：アクセント=70：25：5となっている
• CTAなどのCV要素に対してアクセントカラーを採用
• 黒色を利用する場合、#000000の利用を避ける
• 背景色と前景色に十分なコントラスト比を持たせる
• スクロールハックを利用しない
• buttonタグなどのクリッカブル要素にはaria-labelを設定
• 要素に合わせたcursorを設定
• SP時、クリッカブル要素のtransitionが0sになっている
• PC時、クリッカブル要素にフォーカスしたらアニメーションが作動

モバイルフレンドリー

モバイルフレンドリーとは、モバイル（スマホ）用に表示を最適化し、快適にWebサイトを閲覧できる取り組みを意味します。Googleもその重要性を明確に示しています。

モバイルフレンドリーに関するアクションは、前述のユーザビリティに近い概念で進めていただければと思いますが、ここでは特に下記の項目をあげています。

• スマホ閲覧時でも可読性の高いテキストサイズを設定（16pxを目安）
• レスポンシブウェブデザインを採用
• モバイルフレンドリーテストに合格
• タップ要素同士の間隔を空ける
• セーフエリア対応

コアウェブバイタル

2021年から新たなランキングシグナルとして導入されたのがコアウェブバイタルです。

ユーザーエクスペリエンス（UX）の向上はWebサイト運営者が継続的に取り組むべきである一方、その度合いを測る指標は多くの側面がありました。

その背景を踏まえてGoogleは3つの指標を定義し、数値化することで検索順位を決めるポイントの一つとしたのがコアウェブバイタルです。ここでは3つの指標それぞれで取り組むべき項目をご紹介します。

なお、コアウェブバイタルの各数値はサーチコンソールやPageSpeed Insights等のツールで計測可能です。

LCP（読み込み時間）

LCPとは、ユーザーのページ読み込み時間を表す指標です。読み込みが遅いWebサイトは著しくUXを低下させるため、必ずクリアしておきたい指標となります。

ここでは下記の項目を設けていますが、項目数が多いため、全てを一度にやりきるのは難しいかもしれません。社内エンジニアや制作会社等の外部パートナーと協力しながら進めていただけますと幸いです。

• 不要なJavaScript/CSSを削除
• script, cssを可能な限り１ファイルに統合して配信
• script, cssをキャッシュして配信
• 初期での読み込みが不要なscriptタグに対して、遅延読み込み設定
• CSSサイズが100KBを超える場合、ファーストビューに利用されるスタイルのみインラインで配信
• ファーストビューに利用されないCSSを非同期読み込み
• CSSのセレクタで全指定（*）など対象が多いものを利用しない
• CSSのセレクタを可能な限り簡素化・共通化
• Webフォントを利用する際、preconnectを利用し読み込み高速化
• Webフォントを利用する際、ファイルサイズが大きい場合はサブセット化を実施
• 画像を次世代フォーマット（JPEG2000、JPEG XR、WebPなど）で配信
• 画像の遅延読み込み設定
• 画像のファイルサイズを圧縮して配信
• 不要な画像を削除
• 画像CDNを利用して配信
• ファーストビューに利用される画像をpreloadで読み込む
• 不要な画像のメタデータを削除
• 応答速度が遅いサーバーを使用していない
• Adaptive servingを活用
• サーバーサイドレンダリングもしくはサーバーサイドジェネレートを使用
• SSRの結果をキャッシュしページをhtmlとして返却
• サーバー側でgzip圧縮
• オートスケール可能なサーバーを利用する
• Service Workerを使ったキャッシュの利用
• AMP HTMLの利用
• メディア系のサイト（アクセス頻度が多いサイト）の場合、PWAの導入

FID（ファーストアクション応答時間）

FIDとは、ユーザーがページで最初に行う操作（クリック・タップ・ボタンの押下など）に、ブラウザが応答するまでの時間を表す指標です。商品購入・問い合わせ・資料請求など、何らかの操作を行う必要があるコンバージョンページでは、離脱率やコンバージョン率に影響を与える重要な指標となります。

FIDの改善は、上記記事を参考に以下の項目を実施してください。

• ロングタスクの分割
• Webワーカーを使用
• Cookieのスクリプト実行からの影響を削減
• JavaScriptの量を減らす

CLS（ページレイアウトの安定性）

CLSとは、ページの読み込みフェーズで、予期せぬレイアウトの移動がどれだけ発生したかを測る指標です。ページ読み込み時の画像表示のズレやテキスト表示のズレなどは、UXを低下させる要因としてマイナス評価対象となります。

CLSの改善は、上記記事を参考に以下の項目を実施してください。

• 画像サイズを事前指定（適切なサイズ、アスペクト比で配信）
• 広告表示領域を予約
• Webフォント設定の最適化（CDN利用やfont-display記述等）
• Iframeの利用廃止

コンテンツ（ページ）

ユーザーの検索意図を満たす高品質なコンテンツを提供することがSEOでは最も重要とされていますが、技術的な取り組みも忘れてはなりません。ここではコンテンツ品質を高める技術的要件について紹介しています。

タイトルタグ

タイトルタグとは、ページのタイトルを付けるHTMLタグの一種です。ご存知の方も多いと思いますが、SEOでは非常に重要な要素の一つで、対策（上位表示化を狙う）キーワードを用いてタイトルを構成します。

しかし、対策キーワードの過度な使用はNGです。自然な形で使用して、検索結果へ表示された際にユーザーがクリックしたくなるタイトルを心掛けましょう。ここでは以下の項目を設けています。

• 文字数は32文字程度
• 対策キーワードは極力前半に挿入（前半の方がSEO効果が高いわけではないが、ユーザーが検索したキーワードを前半に置き、探していたページということを示しやすくするため）
• ページごとに異なるタイトルを設定する
• コンテンツ（ページ）のテーマと整合

メタディスクリプション

メタディスクリプションとは、検索結果に表示されるページの概要文です。ユーザーは、表示されたページが自身の検索意図と合っているのか、メタディスクリプションを見て判断することができます。

メタディスクリプションは、直接的なSEOへの影響はありませんが、発見したページのクリック率には大きく影響します。正確なページ情報やページを訪問するメリットを文章にしてください。ここでのポイントは以下の項目をあげています。

• 対策キーワードを前半に挿入
• 最初の75文字以内にモバイル用の紹介文を、76文字目から120文字目までを省略されても問題が無い紹介文を記述
• 各コンテンツ（ページ）固有で設定
• キーメッセージとなる部分を要約して記述

hタグ（見出し）

hタグとは、HTMLの一種で、ページの見出しを設定するタグであることから「見出しタグ」とも呼ばれています。hタグはh1〜h6まであり、検索エンジンへコンテンツの構造を正確に伝える役割があります。

また、コンテンツの内容を、ユーザーへ視覚的に分かりやすく伝えるためにも有効です。

上記のように、hタグを設定しているコンテンツと設定していないコンテンツでは、コンテンツ内容の理解度に大きく差が出るため、hタグの最適化は必ず取り組んでください。ここでは以下の項目を設けています。

• h1→h2→h3のツリー構造で設定
• h1は各ページに1つのみ設定
• h1にページの内容を示したテキストを設定
• hタグを階層順に設定
• hタグとコンテンツを同階層に配置する（hタグを連続させない）
• 対策キーワード（メインもしくはサブキーワード）を適切に挿入（過度で不自然な使用はNG）

リンク

ここでのリンクとは、外部サイトからの被リンクに関することではなく、自社サイトの内部リンクや外部サイトへの発リンクについて記載しています。

内部リンクの最適化は、ユーザーのサイト滞在時間に影響するだけでなく、クローラーがサイト内を巡回しやすくなる（サイト内のページを漏れなく巡回できる）ため、下記項目は必ずチェックしてください。

• 内部リンク最適化
• サイト内の全てのページに３クリック以内で辿り着けるよう設計
• リンク切れがないことを確認
• 重要度の高いページへ内部リンクを設置
• アンカーテキストへリンク先の内容に即したキーワードを挿入
• aタグにaria-label属性を付与
• 1ページあたりの発リンク数が100以下
• 外部リンクはnoreferrerもしくはnoopenerを設定
• リンクはクリック可能なサイズで設定
• クリック可能要素の間隔を空ける

静止画/動画

画像（静止画/動画）は、コンテンツをリッチに仕上げる要素の一つです。しかし、ファイルサイズが重くなるため、適切に実装しなければSEO評価がマイナスになるだけでなく、ユーザーのサイト体験を阻害します。

ここでは以下の項目を設けています。

• ファイルの内容がわかるようなalt属性を付与
• ファイル名にad, advertisementを利用しない
• 動画にはposter属性を設定
• サイズを圧縮して配信
• フォーマットがGoogle推奨の形式に対応
• ストリーミング配信などの読み込み速度対策が行われている
• autoplayの場合、バックグラウンドで動かないようになっている

フォーム

SEOの観点だと、フォームページの検索順位はさほど気にする必要はありませんが、フォームはコンバージョン率に大きく影響するセクションです。流入数が増えても、ユーザーがフォーム入力をしなければビジネスに繋げることが出来ません。

前提として、フォーム入力＝面倒とユーザーは思っています。そのため、フォーム入力における手間を極力省き、フォーム通過率を少しでも高めるアクションを以下のとおりまとめています。

• フォームにautocompleteを設定
• リアルタイムバリデーションを導入
• バリデーションエラーは各フォーム要素の近くに表示する
• 可能な限り入力項目数を減らす
• プライバシーポリシーを記載して同意のチェックボックスを設置
• 氏名欄は名字と名前のボックスを統一
• labelタグとinputなどのフォームタグを対応させる
• disable要素は編集不可であることがわかるようデザインを分ける
• 確認画面及び完了画面（サンクスページ）を設置

404

404とは、何らかの原因（リンク先URLの設定ミスやページ削除等）でアクセスしたページが存在しないエラーを指します。404ページの存在がSEOに悪影響を与えるわけではなく、Googleも明確に問題ないと答えてはいるものの、ユーザー視点で考えると、エラーページの表示は極力避けたいところです。

そこで404に対する対処法を以下のとおりまとめています。

• ファイルの存在しないページで正しく404が返る
• ユーザーに対して探しているページが見つからないことを明確に伝えている
• 404ページのデザインを同サイトの他ページのデザインと統一
• 人気のある記事や投稿へのリンク、トップページへのリンクを追加
• ウェブサーバーが404HTTPステータスコードを返すことを確認

その他

• OGPシェア用のタグに記載の内容をページごとに最適化
• コンテンツ量の少ないページはクロール対象から外す
• 検索結果への表示が不要なページ、質が低いページをno index化している
• 記事ページには著者/監修者情報を詳しく掲載し、SNSアカウントや関連サイトURLへのリンク等を設置

さいごに

冒頭でもお伝えしたように、本チェックリストで紹介している施策は、コーディングに関する知識を有していることが前提です。必要に応じて、制作会社などの外部パートナーとの連携が必要になると思います。

しかし、本チェックリストがあることで、「何をやればいいか分からない」という事態は避けられるはずです。「自社が何をやるべきか」を外部パートナーへ明確に示すことができ、プロジェクトのスコープを定義する際にもお役立ていただけると思います。

これが本チェックリストを公開した理由です。

コンテンツの品質や外部評価等、様々な要件と掛け合わせながら、本チェックリストの各施策に取り組んでみてください。