新しい！ GoogleLighthouseとiThemesSyncProの統合

公開: 2020-08-26

iThemes Sync Proでは、Google Lighthouse APIを利用して、同期ダッシュボードにあるすべてのWebサイトのパフォーマンス、SEO、およびアクセシビリティを監査できるようになりました。

監査するURLを入力するだけで、SyncProはGoogleLighthouseを使用してページで一連のチェックを実行します。

検査が完了すると、Sync Proダッシュボードに、ページのパフォーマンスを示す概要が表示されます。監査の概要には、ページが成功した場所と注意が必要な場所が表示されます。

本当にすばらしいのは、各監査に、監査の概要にある問題を解決するために実行できる、チェックのさまざまな要素が不可欠で実行可能な手順である理由の説明が含まれていることです。

注：Sync Pro WordPressメンテナンスレポートに監査の概要を含めるオプションが必要な場合は、コメントでお知らせください。

Google灯台とは何ですか？

GoogleのLighthouseは、ウェブページの品質を向上させるためのオープンソースの自動化ツールです。パブリック、または認証が必要なWebページに対して実行できます。パフォーマンス、アクセシビリティ、プログレッシブWebアプリ、SEOなどの監査があります。

グーグル灯台対ページスピード

Googleが提供する2つの監査ツールであるGooglePageSpeedとLighthouseの違いは何ですか？

PageSpeed Insightsはパフォーマンスメトリックのみを測定しますが、LighthouseはWebサイトの他の側面（SEO、アクセシビリティ、プログレッシブWebアプリなど）も監査します。
Google PageSpeedはラボと実世界のデータの「組み合わせ」を使用しますが、Lighthouseは（一貫した条件下で）ラボデータのみを使用して監査サマリーを作成します。

LighthouseがPageSpeedInsightsに組み込まれました。これはPageSpeedの統合分析エンジンです。

Webページの品質を監査する必要がある8つの理由

実際のサイト監査を見る前に、Webページの品質を監査する必要がある理由について説明しましょう。

検索エンジンの発見可能性の向上– Googleは、デスクトップページとモバイルページのページ速度をランキングに使用します。サイト監査のパフォーマンスのヒントを使用して、ランキングを向上させます。
バウンス率を下げる–モバイルページの読み込みに3秒以上かかると、訪問者の半数以上がWebサイトを放棄します。
聴衆を広げる–障害を持つ人々があなたのウェブサイトにアクセスできるようにすることで、あなたのウェブサイトを使用できる人々の数が増えます。
マージンを改善する– Web開発のベストプラクティスに従うと、より良いカスタマーエクスペリエンスが作成されます。実際、購入者の86％は、より良い顧客体験のためにもっとお金を払っても構わないと思っています。
検索エンジンとのコミュニケーションの改善–サイト監査のヒントを使用して、検索エンジンがコンテンツを理解できることを確認します。
既知のセキュリティ脆弱性を持つJavaScriptライブラリ–サイト監査は、既知のセキュリティ脆弱性を持つフロントエンドJavaScriptライブラリを含むページをチェックしてフラグを立てます。開発者は、プラグインやテーマでJSライブラリなどのサードパーティコードを使用するのが一般的です。残念ながら、ライブラリが適切に維持されていないと、攻撃者がWebサイトをハッキングするために利用できる脆弱性が作成される可能性があります。既知の脆弱性を持つコンポーネントの使用は、OWASPトップ10リストにあります。
クロスオリジン宛先への安全でないリンク–この監査では、ページのクロスオリジン宛先へのリンクが安全かどうかを確認します。 target="_blank"属性を使用して別のサイトのページにリンクすると、サイトのパフォーマンスとセキュリティの問題が発生する可能性があります。
HTTPS上にないページ–サイト監査は、最初のページ要求がHTTPS経由で提供されているかどうかだけでなく、ページリソースがすべてHTTPS経由で読み込まれているかどうかも確認します。 SSLで暗号化されていないリソースを使用している場合、侵入者が訪問者とWebサイト間の通信を傍受する可能性があります。

実行中のサイト監査を参照してください

サイト監査を開始するには、iThemes Sync Proダッシュボードにログインし、リスト内のサイトをクリックします。

次に、新しい[サイト監査]タブをクリックして、灯台の設定を表示します。

ここでは、サイト監査のいくつかの異なるオプションを見つけることができます。

プライマリURL–この選択を使用して、Webサイトのホームページで監査を実行します。
ページURL–このオプションを選択して、監査するWebページのURLを入力します。
既存の監査サマリーをロードする–このドロップダウンから、以前に完了した監査のサマリーを表示することもできます。
生成–このボタンをクリックして、新しいWebページ監査を実行します。

[生成]ボタンをクリックして、同期ダッシュボードで最初のサイト監査の概要を作成および表示します。

サイト監査カテゴリ

ページの上部に、パフォーマンス、アクセシビリティ、ベストプラクティス、 SEOの4つの監査カテゴリのスコアが表示されます。 SyncProサイト監査の各セクションを詳しく見てみましょう。

1.パフォーマンス

監査の[パフォーマンス]セクションでは、ユーザーがWebページのコンテンツを表示および操作できるようにページが最適化されていることを確認します。全体的なスコアが上部に表示され、詳細は以下に表示されます。

[メトリック]トグルをクリックして、Webサイトのスキャンに使用される各メトリックの説明を表示します。

このビューでは、パフォーマンスのスコアリング方法に関するいくつかの詳細を分析します。

最初のコンテンツフルペイント–これは最初のテキストまたは画像が読み込まれる時間です。
インタラクティブになるまでの時間–これはページが完全にインタラクティブになるまでにかかる時間です。
速度インデックス–速度インデックスは、ページのコンテンツが視覚的に表示される速度を示します。
合計ブロッキング時間–FCPからインタラクティブまでの時間までのすべての期間の合計。
最大のコンテンツフルペイント–最大のコンテンツフルペイントは、最大のテキストまたは画像が読み込まれる時刻を示します。
累積レイアウトシフト–累積レイアウトシフトは、ビューポート内の表示要素の動きを測定します。

パフォーマンススコアがどのように集計されるかをよりよく理解するには、[電卓を参照]リンクをクリックします。

「機会」セクションでは、ページの読み込みを高速化するための提案を提供します。

ページのパフォーマンスに関する情報は、[診断]セクションにあります。概要には、Webページが合格したパフォーマンスチェックのリストも表示されます。

2.アクセシビリティ

アクセシビリティ監査は、障害を持つサイト訪問者がWebページを使用できるかどうかを確認します。

監査では、アクセシビリティに関連するすべての考慮事項をテストできるわけではないことに注意してください。しかし、心配しないでください、灯台はあなたをぶら下げたままにしません。監査の概要には、確認およびテスト手順を実行できる追加項目のリストが表示されます。

このセクションの下部には、ページが正常に合格したすべてのアクセシビリティチェックのリストもあります。

3.ベストプラクティス

監査では、自動チェックも実行され、WebページがWeb開発のベストプラクティスに従っているかどうかが確認されます。

ベストプラクティス監査では、ページがHTTPSを使用しているかどうかなど、ページが基本的なベストプラクティスに従っているかどうかを確認し、ユーザーがパスワードフィールドに貼り付けることができるようにします。

4.SEO

最後に、 SEO監査は、ページが検索エンジンの結果のランキング用に最適化されていることを確認します。

このSEO監査は、コンテンツのベストプラクティスに従っているかどうかを確認し、ページが合格したSEO監査項目のリストを提供します。

ページが監査に失敗した場合の対処方法

あなたのウェブページがサイト監査のいずれかの部分に失敗しても心配しないでください。概要には、レビューで明らかになった問題を解決するために必要な手順が記載されています。

私の監査要約を見てみましょう。私のウェブページがSEOメタディスクリプション監査に失敗したことがわかります。もう少し情報を取得するには、トグル矢印をクリックします。

トグル矢印をクリックすると、メタディスクリプションとは何か、メタディスクリプションが重要である理由の説明と、詳細を確認するためのリンクが表示されます。

リンクをクリックすると、灯台のドキュメントに移動します。このドキュメントでは、ページがメタディスクリプション監査に失敗した理由を説明し、失敗を解決するための手順を示します。

指示に従って要約にある問題を修正した後、監査を再実行して新しいスコアを確認できます。

まとめ

新しいiThemesSync Pro Site Auditは、Webサイトのパフォーマンス、アクセシビリティ、 SEO 、およびWeb開発のベストプラクティスを監査するための新しい自動化ツールです。監査の概要は、ページの読み込み速度を上げ、すべての訪問者に優れたエクスペリエンスを提供し、オーディエンスを増やすために実行できる特定のアクションを提供します。

同期ダッシュボードへの同期ProLoginの取得

マイケル・ムーア

Michaelは毎週、WordPressの脆弱性レポートをまとめて、サイトを安全に保つのに役立てています。 iThemesのプロダクトマネージャーとして、彼は私たちがiThemes製品ラインナップを改善し続けるのを手伝ってくれます。彼は巨大なオタクであり、新旧のすべての技術について学ぶのが大好きです。マイケルが妻と娘と一緒に遊んだり、仕事をしていないときに音楽を読んだり聞いたりしているのを見つけることができます。