こんにちは。
滋賀や関西のお客様を中心にホームページ制作を承っているエムクアです！
SEO対策に欠かせないのが内部対策・外部対策・コンテンツ対策という三本柱でしたが、昨今は【4本目】が追加されています。それがコアウェブバイタルです。
2021年5月から運用開始されているので最新のSEO対策といっても過言ではありません。
今回はコアウェブバイタルについて解説していきます。
SEO対策におけるCore Web Vitalsとは？
Core Web Vitals【コアウェブバイタル】は、Googleが2021年5月に発表した新たなSEO対策における重要指標とされています。
Web Vitals【ウェブバイタル】というのは、サイト管理者側がユーザーに対して、本質的に重要（Vitals）な構造を見直すべきであるというGoogleの公式発表から始まり、その中でも核となる部分を【Core（コア）】と呼び、内部や外部、コンテンツの対策が重要なのではなく、もっと本質的な部分の改善をSEO対策における新たな指標とする事で管理者もユーザーも満足度の高いサイト運営を可能にしました。
主に3つの指標が追加されています。
LCP
LCPとは、【Largest Contentful Paint】の略で、ユーザーがホームページを検索してクリックした際のホームページ表示までの速度を言います。ホームページは基本的に動画や画像が多いと表示速度が低速になってしまうので、これをコアウェブバイタル3本柱の1つとして考えることで、ユーザーにより良い環境になります。
2.5秒以下での表示を【良好】と判断し、4秒以下を【要改善】、4秒以上を【改善必須】と覚えておくと分かり易いですね。
このLCPはPCサイトに限った話ではなく、スマートフォンやタブレット端末においても重要視されています。今の時代のホームページは、レスポンシブデザイン（PCでもスマホでも表示可能なサイト構成）を基本としているので、端末ごとに表示速度が違うという事が無いのが理想です。
LCPの速度計算が行われるポイントとしては
①ページ最上部にあるメイン画像
②段落のある文章
の2点といわれており、これが検索順位にも大きく関係してくるようになりました。
主な原因はサーバーの応答時間が長い事や、JavaScriptやCSSのレンダリングブロックなどが挙げられます。
LCPの改善方法
サーバー応答時間の解消
サーバーの応答速度計算の指標であるTTFBを利用します。
Googleが提供している【Page Speed Insight】でTTFBを参照し、サードパーティの接続時間を早める事を行う事や、サーバーの最適化を行います。
レンダリングブロックの解消
コメントの削除や不要なJava Scriptの削除、場合によっては非同期で読込を行うなどの対処を行います。
リソース読込の解消
画像を次世代フォーマット（JPEG2000・WebPなど）にフォーマットを変更する事で解消させますが、全ての画像がサポート対象ではありません。画像の最適化を行い、圧縮やレスポンシブ画像の導入を行います。
FID
FIDとは、【First Input Delay】の略で、閲覧中のホームページ上において
①文字又は画像などのリンクを選ぶ
②問い合わせフォーム等に文字等を入力し、送信する
の2点を注視し、反応速度やインタラクティブ性を測る指標の事を言います。この反応速度が遅いといくら高品質なコンテンツを作成していてもユーザーは『反応が悪い』と認識してしまい、サイト直帰に繋がります。
FIDは反応速度100ミリ秒以下（0.01秒以下）を【良好】と判断し、300ミリ秒以下（0.03秒以下）を【要改善】、300ミリ秒以上（0.03秒以上）を【改善必須】としているので、スマホのタップからの初速をイメージすると分かり易いのではないでしょうか。
このFIDはスマホであればある程度容量が抑えられたサイト構成が可能ですが、PCの場合は重くなってしまう傾向にあり、これを改善させることが出来れば、PCでのSEO対策＋FIDの改善完了という事で検索上位表示される可能性が大幅に高くなるでしょう。
主な原因として挙げられるのはJava Scriptとされており、これを改善する為には、2つの方法を用います。
1つ目は無駄なJava Scriptの削除を行いますが、1つ1つのコードをすべて確認する必要があります。
その際、どれが無駄でどれが必要なのかというのは見つけづらいので、ChromeのCoverageを利用して発見スピードを上げましょう。Coverageでは不必要なJava Scriptは赤色に、必要又は現在使用しているJava Scriptは青色に表示されます。
ですが、削除の前に全てのページを確認しましょう。
現在表示しているページでは【赤色】でも、他のページでは【青色】の可能性も十分あるので、注意が必要です。
2つ目は全てのWebページの構成を【Minify化する】という事です。
Minify化とは、Web上のCSSやJava Scriptを軽量化し、簡単に高速表示させることが可能になりますが、ファイルコードが見にくくなるので、コード編集を行ってから実装しましょう。
どちらでもファイルの軽量化は可能ですが、ホームページは作って終わりではありません。
1つ目の方法の方が確実にコードの量を減らしたもので、2つ目は緊急時や時間的猶予があまりない場合に活用してはいかがでしょうか。
CLS
CLSとは【Cumulative Layout Shift】の略で、主にページ読込の際のレイアウトのずれを示し、サイトの視覚的な安定性を数値化したものを指します。最も管理者にとってはわかりづらい印象ですが、ユーザー目線で見ると分かり易くなるでしょう。
例えば、ECサイト内で商品を購入しようか迷っている時に【購入】と【キャンセル】が並んでいたとします。ユーザーは【購入】しようとしましたが、CLSにずれが生じ、【キャンセル】を押してしまいました。
とはいったものの、上記事例が発生した場合は戻ればいいだけの話です。
ですが、そもそもCLSのずれが発生しなければ、ユーザーはその様な手間をとる必要がありません。この事例によってユーザーが購買意欲をなくし、経済的損失を招く可能性があるので、CLSの改善は必要なのです。
CLSは【Layout shift score（レイアウトシフトスコア）】を使い、0.1以下を【良好】、0.25以下を【要改善】、0.25以上を【改善必須】とされていますが、これはレイアウトの変動発生件数でカウントされているようです。
この3つの【コア】がウェブバイタルの中でも重要で、これらを改善する事でUser Experience（ユーザー体験）を改善していくのがコアウェブバイタルの狙いです。
コアウェブバイタルを改善する事で、内部・外部・コンテンツのSEO対策を講じたサイトでも順位が必ずしも上昇するとは限らなくなりましたが、ユーザーから見るとネットの使いやすさが格段に向上しているので、自然と様々な検索を行いたいという欲求が生まれてきます。
Googleが提供しているサービス【Lighthouse】とは？
LighthouseはGoogleが運営していたWebアプリ監査ツールです。PWA（プログレッシブウェブアプリ）のサイト評価に特化しているので、大手企業も採用しています。
PWAの必要品質を満たしているかどうかなど細かいチェックも可能ですが、SEOに対するチェック項目が追加されたので、SE対策を行う上では重要な対策ツールとなっています。
世界No.1の検索エンジンであるGoogleが公式に提供しているサービスで、自サイトの評価を高めることで、検索順位上昇の可能性も飛躍的に上がるでしょう。
Lighthouseでは数種類の項目に分けてサイト全体の評価を行い【Passed Audits(合格)】か【Failed Audits（不合格）】で判断できるのでどこが悪いのかが明確です。
Lighthouseでポイントとなる12項目
SEO対策で重要なHTMLタグ等もここで精査出来るので、役立てて見てはいかがでしょうか。
①メタタグでViewport幅が適正指定されているか
②メタタグでTitleの記載があるか
③メタタグでDescriptionの記載があるか
④HTTPステータスコードが正常作動しているか
⑤リンク先テキストが明確なものになっているか
⑥インデックスに対して阻害等はないか
⑦言語指定が適正か
⑧rel＝”canonical”設定が適正か
⑨プラグインによるページ閲覧は必要ないか
⑩CSSやJavaScriptの内、必要のない物は削除されているか
⑪画像は全てalt指定しているか
⑫fontは適正に使用されているか
ここで記載したものはあくまでも評価基準の一部にすぎません。
ですが、自身で取りこぼした場所を明確に見る事が出来るので、修正箇所も明確です。
分類できるチェック項目は全部で5項目
前述した12項目をポイントとして、5つの項目に分類されるので解説していきましょう。
Ⅰ：Performance
こちらの項目は主に【サイト内のスピード】のチェックが行われます。
ページの読み込み速度や適正なFID構成、ユーザー操作によるレスポンス速度などが評価対象となり、CSSやJavaScriptの最適化に対する解説も見る事が可能です。
特にコアウェブバイタルの【コア】の部分はPerformanceに凝縮されており、LCP・FID・CLSのいずれも含まれています。
大手サイトをLighthouseで確認しても軒並みこのPerformance部分のスコアはそこまで高くはありませんが、他が全て100に近い数字となっています。
Ⅱ：Progressive Web App
こちらの評価基準はサイト自体をPWA化するうえで必要なチェック項目を基に評価されます。ユーザーが任意のビューポートで画面サイズを変更した際のずれや検索での情報検出可能かどうかが評価の一部です。【ユーザーが使いやすいかどうか】という事でしょう。
Ⅲ：Accessibility
こちらは主にサイト外部からの訪問者（ユーザーやクローラー）に対して適正な構成かどうかを評価します。テキストの大きさや色、フォントサイズが適正かどうか、オブジェクト要素にalt属性が適正に設定されているか等のHTMLタグ適正使用が評価対象となります。内部SEO対策を行う際には一度チェックしながら構成する必要がありそうです。
Ⅳ：Best Practices
こちらは【セキュリティ面とユーザビリティ】に関する評価を行います。
特にパスワードへのペーストを禁止しているかどうか？や廃止予定のAPIの使用、セキュリティ対策のドメインページを対象として構成しているtarget=”_blank”付きのリンクにrel=”noopener”やrel=”noreferrer”属性を付け加えているか？HTTPSを使用しているかなどが評価対象となります。
Ⅴ：SEO
こちらはSEOに対するチェック項目となります。
プラグインコンテンツを使用していないか？titleタグの使用、適正なHTPステータスコードの返答やRrobots.txtファイルの適正使用などが評価対象です。
ここで重要になるのが
・Pege is mobile friendly（モバイル端末でも利用しやすいページか）
・Structured data is valid （ページ内構造化データは適正か）
の2つです。特にモバイル端末でも利用しやすいかどうかというのは、現在のホームページ制作においては必須項目をなっています。
PCユーザーが多かった昔と比べても、今は殆どの人がスマートフォンを所持しており、スマホでの検索が殆どでしょう。ですがPCサイトの構造ばかりに気を取られているとスマホユーザーはサイトが見づらく、結果として顧客の流出に繋がってしまいます。
このSEOで不合格の場合は自動修正可能なものもありますが、前述した2箇所については手動での修正となるので、直ちに修正部分を洗い出し時間を掛けて修正しなければなりません。
Lighthouseでの評価をする前に
Lighthouseでの評価を行う前に、各項目に分けて無料ツールを使って現在の自サイトを評価してみましょう。Lighthouseはコアウェブバイタルで必要な指標ではありますが、1つ1つ分けて修正を行ってからでも遅くはありません。
Googleサーチコンソール
Googleサーチコンソールでは【ウェブに関する主な指標】という項目があります。そこを選ぶと、LCP・FID・CLSの3つに関して【良好】【要改善】【不良】の3段階評価をして頂けます。いずれもLighthouseの基準同様で評価してくれるので、Googleサーチコンソールで改善点を見つけ、修正し、Lighthouseで改めて評価してもらうと修正箇所も少なくなるのではないでしょうか。
モバイルフレンドリーテスト
こちらはサイト自体が正常にレスポンシブデザイン構造になっているかどうかを確認する為のツールです。対象サイトのURLを入力するだけなので簡単に確認が出来ます。
また、スクリプトや画像にクローラーがページを読み込む際に障壁となるものがあるか無いかも確認出来るのも便利です。
test my site
こちらはモバイルサイトでの読込速度をチェックできます。
自身ではなかなか出せないサイト訪問者の離脱率も確認できるので、コアウェブバイタルの評価以前にある基本的なSEO対策の場面でも十分活躍してくれます。他社サイトとの比較も可能なので、自サイトの弱みを他サイトはどのように克服しているのか？自サイトが他サイトに勝つためにはどこを修正したらいいのか？など具体的な修正案も出てきやすいのではないかと思います。
現在のSEO対策では不安という方や、なかなか結果がでないサイトを運営している企業にとってはLighthouseでの評価を高める事で今以上の結果を生んでくれるのではないでしょうか。
ですが、あくまでもLighthouseでの評価は【1つの指標である】という事は理解しておきましょう。使用しているPCの状況やPC環境によって多少変動も確認されています。1つの指標ではありますが、重要な指標になっていて他サイトもLighthouseでの評価を重要視しているという事です。
他サイトに勝つためには他サイトが行っている事＋＠の対策が必要になってきます。
まとめ
以上がホームページ制作においてのコアウェブバイタルについての説明になります。集客ができるホームページを作成するにはコアウェブバイタルは必須と考えておきましょう。
尚、エムクアではお客様にSEO対策のサービスを提供しております。
これらの新サービスは長年SEO対策に取り組んできた弊社が自身を持って提供できる内容になります。
SEO業者はよく小手先だけのSEO対策でSEOの順位を上げようとしますが、そういった対応は一次的には順位に変動があっても、継続的に順位をキープすることは難しいことが多いです。エムクアではSEO内部対策とコンテンツSEOをメインにお客様に提供し、長期的なスパンでサポートをさせて頂きますのでご安心ください。
また、対策費用も他社に比べるとお手頃で費用対効果が高いサービスとなります。
その他、SEOに強いホームページ制作なども行っております。
弊社では、googleが出しているLighthouseというツールを使い、お客様に実際にサイトの評価の数値を見てもらい制作をしていきます。ですので、ホームページ製作時に数値的にサイト評価やSEOスコアが高いことの確認が可能です。
ご興味がある方は気軽にご相談ください！
