新しく追加されたGoogleページ検証ツール、”Audits”を試す

ページ検証ツールのWhat’s Newにて紹介されていた”Audits”が面白そうだったので、試してみました。プログレッシブウェブアプリ、挙動(パフォーマンス)、アクセス性(アクセシビリティー)、最良事例(ベストプラクティス)の4部門に分けて、ウェブページの総合的な評価をしてくれます。

“Audits”とは

Google Developers Update, New Audits panel, powered by Lighthouse

The Audits panel is now powered by Lighthouse. Lighthouse provides a comprehensive set of tests for measuring the quality of your web pages.
The scores at the top for Progressive Web App, Performance, Accessibility, and Best Practices are your aggregate scores for each of those categories. The rest of the report is a breakdown of each of the tests that determined your scores. Improve the quality of your web page by fixing the failing tests.

AuditsパネルがLighthouseによって搭載されました。Lighthouseは、あなたのウェブページの品質評価を包括的に行うためのテストセットを提供します。
上部に表示されているスコアは、プログレッシブウェブアプリ、パフォーマンス、アクセシビリティー、そしてベストプラクティスのそれぞれのカテゴリーでのスコア集計結果です。残りのレポートは、スコアを決定づけた個々のテスト結果の内訳です。不合格部分の修正を行うことによって、あなたのウェブページの品質を改善してください。

うーん。なんだか、Google翻訳に分かりやすさで負けている気がする。

どんまい。私。

What’s newで拾った情報なので、このツールの従来機がどんなツールだったのかを知らないため、比較はできませんが、W3CのHTML、CSSのバリデーションツールやモバイルフレンドリーテストを一つにギュッと集めたテストツールでした。

Auditsの開き方

  1. テストしたいウェブページを開き、右クリック→検証
  2. 検証のメニューにて、Auditsを選ぶ。隠れている場合は、二重矢印でドロップダウンメニューを表示させてください
  3. 灯台の画像の下の「perform an audit…」をクリック
  4. ポップアップの「Run audit」をクリック
検証メニューのAudits
検証メニューのAudits

テストの項目があれやこれや変わっていって、一回30秒~1分ぐらいかかります。

私のサイトのテスト結果

私のサイトでも3種類のページをテストしてみました。

FC2、スマホ用テンプレート

メインブログでは、文字だけのページを選択したにも関わらず点数が悪いです。スマホテンプレートに大きな改良の余地ありですね。いっそのこと今のテンプレートのレスポンシブへの書き換えに挑戦しようかな…

メインブログの"Audit"検証結果
メインブログの”Audit”検証結果

ワードプレス、レスポンシブテンプレート

当ブログ「ウラとボツ」は、ちょっとマシ。画像やリンクがついているページの結果です。ただの文字だけのページだとパフォーマンスとベストプラクティスが上がりました。

当ブログ「ウラとボツ」の"Audits"テスト結果
当ブログ「ウラとボツ」の”Audits”テスト結果

ワードプレス、Accelerated Mobile Page テンプレート

当ブログのAMPページは、なかなかいいんじゃない?

当ブログ「ウラとボツ」のAMPページの"Audits"テスト結果
当ブログ「ウラとボツ」のAMPページの”Audits”テスト結果

不合格部分の詳細を見る

不合格部分の折り畳み矢印マークをポチポチと広げて行くことで、問題個所の概要説明文やLearn moreリンクで更に詳細な専用ページのタブが開けたり、当該ソースデータを表示することができるので、すごく作業がしやすい作りになっていました。

Audits、問題個所を掘り下げていく
問題個所を掘り下げていく

合格部分の詳細を見る

合格の部分も折り畳みを解除すれば、どういう項目がチェックされているのか見ることができますよ。

合格部分も同じように掘り下げられる
合格部分も同じように掘り下げられる

独学者にはありがたい

私はウェブ技術について体系的に学んでいるわけではないので、こういうセルフチェックツールは非常にありがたく参考にさせてもらいます。

コメントを残す

メールアドレスが公開されることはありません。