Google Chrome Extension / v1.1.1

公開前レビューを、
ページを見ながら。

Web Review Toolkit — Pre-launch Website Review Tool

Web Review Toolkitは、公開前のWebサイトを実際のページ上で確認するためのChrome拡張機能です。 見出し、画像のAlt、メディア情報、リンク、仮コンテンツ、ページ設定に加え、 ページ全体のHTML構造まで可視化し、見落としやすいポイントへの「気づき」をサポートします。

v1.1.1ではページ構造レビューと4視点のAIレビューに対応。 HTML・ボット・アクセシビリティ・ユーザーの視点からページを確認できます。 通常レビューとページ構造の可視化はAPIキーなしで利用できます。

Web Review Toolkitの機能概要

Concept

公開前に「一度WRTを開く」を習慣に。

DevToolsを何度も開かなくても、公開前に確認したい基本項目をページ上へ直接表示。問題を自動で決めつけるのではなく、制作者が判断しやすい形で情報を見せます。

H

見出し

h1〜h6をページ上に表示し、階層と件数を確認。見出し構造の抜けや偏りに気づきやすくします。

A

画像のAlt

ALTなし・ALT空・ALTあり・要確認を可視化。必要に応じてAlt CheckerのAIレビューまで行えます。

M

メディア情報

画像の容量・元サイズ・表示倍率・Lazy Load、動画情報などを確認。重すぎる画像や過度な拡大表示に気づけます。

L

リンク

通常・外部・PDF・TEL・MAILを識別。空リンクなどの要確認・要修正ポイントをページ上で確認できます。

D

仮コンテンツ

公開時に残したくない仮テキストや仮画像を検出。制作途中の置き忘れを見つける補助に使えます。

P

ページ設定

noindex、Analytics / GTM、title、description、canonical、lang、favicon、apple-touch-iconをまとめて確認します。

S

ページ構造

header / main / section / navなどのHTML構造や見出しをツリーで可視化。ページ表示と照らし合わせながら確認できます。

AI

4視点のAIレビュー

HTML・ボット・アクセシビリティ・ユーザーの4視点からページ構造をレビューし、強みや優先課題を整理します。

Screenshots

ページ上に重ねて、直感的にレビュー。

チェック結果だけを見るのではなく、「実際のページのどこにあるか」が分かることを重視しています。v1.1.1ではSide Panelを中心に、レビューとページ構造を切り替えて確認できます。

Web Review Toolkit v1.1.1のページレビュー画面

ページレビュー

見出し・画像Alt・メディア・リンク・仮コンテンツなどを同じページ上で確認。Side Panelから必要な項目だけ表示できます。

Web Review Toolkitのモノトーン表示

モノトーン表示

ページ本来の色による情報量を抑え、WRTのマーカーや確認対象を見つけやすくできます。

リンクの要修正理由を吹き出しで表示している画面

理由まで確認

リンクなどの要確認・要修正箇所は、ページ上のマーカーと理由を照らし合わせながら確認できます。

Page Structure / AI Review

ページ全体の構造を見て、4つの視点から深掘り。

ページ構造をツリーで可視化。Google Gemini APIを設定すると、構造をHTML・ボット・アクセシビリティ・ユーザーの4視点からレビューできます。

Web Review Toolkitのページ構造総合レビュー画面

総合レビュー

4視点の評価をまとめ、ページ全体の強み・確認したい点・改善の優先順位を整理します。

Web Review Toolkitのページ構造4視点レビュー画面

HTML・ボット・A11y・ユーザー

総合結果から各視点へ切り替え、セマンティクス、機械可読性、アクセシビリティ、ユーザー体験を個別に確認できます。

HTMLセマンティクス・見出し・文書構造
ボット検索エンジンやAIクローラーからの理解しやすさ
アクセシビリティ支援技術やキーボード利用を含む利用しやすさ
ユーザー理解しやすさ・迷いにくさ・行動しやすさ

※AIによる評価は品質を保証するものではありません。公開前レビューで確認するポイントや改善の優先順位を考えるための参考情報としてご利用ください。

Page Settings

公開事故につながる基本設定も確認。

ページ設定では、公開前に確認しておきたい基本項目をコントロールパネル内にまとめます。

  • noindex の残り
  • Google Analytics / Google Tag Manager
  • title / meta description / canonical
  • html lang
  • favicon / apple-touch-icon

「未設定=必ずエラー」と決めつけず、公開時に意図した状態か確認するための情報として表示します。

ページ設定チェックを含むコントロールパネル

Alt Checker Included

Alt CheckerのAI Altレビューを内包。

Web Review Toolkitには、Alt Checkerで培った画像Altレビュー機能が含まれています。Altだけを確認するツールから、ページ全体をレビューするツールへ発展しました。

Altが空の画像に対するAIレビュー前の画面

AIを必要なときだけ使う

通常チェックはAPIキー不要。AIレビューを実行したときだけGemini APIを利用します。

画像の精密AIレビュー結果

画像を確認する精密レビュー

画像本体とページ文脈を確認し、「Alt Checker推奨」「SEO重視」「アクセシビリティ重視」の候補を提示します。

Gemini APIキーについて: AI Altレビューおよびページ構造のAIレビューを利用する場合は、ご自身のGoogle Gemini APIキーを設定します。無料枠でも利用できますが、多数のページを継続的にレビューする場合は、有料利用が可能なAPI環境をおすすめします。

Review Style

情報を出しすぎず、気づきやすく。

Web Review Toolkitは、ページを解析するだけの一覧表ではありません。対象の近くにアイコンを置き、問題の強さを色で整理し、必要な情報だけを確認できるようにしています。

  • 紫:通常の情報・要素
  • 赤:要確認・要修正
  • 緑:Altありなど正常な状態
  • レビュー中は本来のリンク遷移を抑止
要修正箇所を見つけやすく表示した画面

プライバシーについて: 通常のレビュー機能では、閲覧中ページのHTML・テキスト・リンク・画像・動画・meta情報などをブラウザ内で処理します。これらを開発者のサーバーへ送信しません。AIレビューを実行した場合のみ、レビューに必要なページ情報をGoogle Gemini APIへ送信します。

Chrome Web Store

Web Review Toolkit v1.1.1 をChrome Web Storeで公開しています。

ページレビューに加え、ページ構造の可視化と4視点のAIレビューに対応しています。通常レビューとページ構造の可視化はAPIキーなしで利用でき、AIレビューを利用する場合のみGoogle Gemini APIキーを使用します。