David Dias

HTTPで開いたサイトがHTTPSへ正しく転送されるかを点検します。301応答とパス・クエリの保持を確認し、サーバーやCDNの転送設定の修正を支援します。

• サイト公開前に転送を確認したいとき
• 転送時のパスやクエリを確認したいとき
• サーバーの転送とHSTS設定の見直し

フォームの入力欄に合うHTMLのtype属性とautocomplete属性を点検・修正し、スマートフォンのキーボード表示やブラウザの自動入力を整えるスキル。

• 既存フォームの入力属性を点検したいとき
• スマホのメール・電話入力を整えたいとき
• ブラウザの自動入力を設定したいとき

HTTPSサイトに残るHTTPのリンクや画像・スクリプトのURLを調べ、内部・外部・リソース別に整理し、リンク先の対応状況を確かめて修正するスキル。

• HTTPS移行時のリンク確認
• 直接書かれたHTTPのURLを探したいとき
• 画像やスクリプトの参照先確認

検索エンジンがたどれないリンクをHTMLから洗い出し、空のhrefやJavaScriptだけの画面遷移を、適切なURLや要素へ修正するスキル。

• JavaScript中心の画面遷移の点検
• 動的に生成するリンクを確認したいとき
• 画面遷移と操作ボタンの使い分け

ページの読み込みが遅い原因を測定し、HTTP/2・HTTP/3の利用状況を確認します。通信上の問題に応じて、WebサーバーやCDNの設定変更を案内します。

• ページの読み込み遅延の調査
• リソース配信のHTTP方式の確認
• WebサーバーやCDNの設定見直し

URL内の単語区切りを点検し、アンダースコアや空白をハイフンへ統一するためのスラッグ生成、301転送、内部リンク更新までの手順を整理するスキル。

• URL内のアンダースコアや空白の点検
• タイトルからスラッグを生成したいとき
• 301転送を伴うURL移行の計画

キーボードのTab操作で移る順番が画面の並びと合っているかを点検し、HTMLの要素順やダイアログ開閉時のフォーカス移動の修正を支援するスキル。

• ページのTab移動順の点検
• ダイアログ開閉時のフォーカス確認
• HTMLの要素順とtabindexの見直し

文字のないリンクやラベルのないアイコン、リンク切れを点検します。説明文や読み上げ用の名前を補い、移動先が分かるリンクへ修正するスキルです。

• ページ内の空リンクを探したいとき
• アイコンリンクに移動先の説明を追加
• リンク切れを点検・修正したいとき

JavaScriptの非同期処理やReact画面で起きるエラーの扱いを点検し、例外の捕捉、原因を追うためのログ、画面側のエラー処理の追加を案内するスキル。

• 非同期処理のエラー対応を点検したいとき
• React画面のエラー処理の追加
• 原因調査に使うログの改善

フロントエンドのチェック項目に合うnpmパッケージを調査し、利用数と更新時期の基準を満たす候補を選び、ルールファイルのメタデータに追記するスキル。

• チェック項目にnpmの参照を加えたいとき
• 利用数と公開時期で候補を絞りたいとき
• ルールの検出・修正・テスト用ツール探し

ログインや購入など、利用者の一連の操作を確かめるE2Eテストの不足を調べ、追加を支援します。自動テストの構成やCI/CDでの継続実行、失敗時の扱いも確認します。

• ログインや購入のテスト範囲を確認したいとき
• フォーム送信のテストを追加したいとき
• CI/CDのテスト実行と失敗対応の点検

画像と説明文のHTML構造を点検し、figureとfigcaptionで正しく関連付けます。代替テキストとの重複も確認し、読み上げ時に意味が伝わる形へ整えます。

• 説明文付き画像のHTMLを点検したいとき
• 画像説明と代替テキストの重複確認
• 読み上げ時の画像説明を改善したいとき

GIF・動画・CSSアニメーションの速い点滅を点検し、光に敏感な利用者への影響を考慮して、点滅の除去や速度変更、代替表現への修正を支援するスキル。

• アニメーションGIFの点滅確認
• 動画やCSSアニメーションの点検
• 点滅をフェードや静止表示に変えたいとき

ブログやニュースサイトの編集方針ページを点検・下書きします。著者の専門性、調査と事実確認、訂正や利益相反の説明を整理し、記事やサイトからの案内も確認します。

• 編集方針ページを作りたいとき
• 著者基準と事実確認の体制の見直し
• 訂正方針や資金関係の説明整理

画面に表示されたHTMLで、ARIA属性の参照先IDの重複を調べます。ラベルや説明の誤読につながる箇所を特定し、IDと参照の修正、確認方法を案内します。

• 読み上げるラベルの誤りを調べたいとき
• 繰り返し部品のID重複の点検
• デザインシステムのARIA参照確認

用語と説明を表すHTMLの構造を点検し、単独で使われているdt・ddをdlにまとめる修正を支援します。読み上げ支援で両者の関係を伝えるための確認も扱います。

• 用語集のHTML構造の点検
• 項目名と値を並べる表示のレビュー
• dlに囲まれていないdt・ddの修正

複数ページで重複するメタディスクリプションを探し、ページの内容に合う固有の説明文を作成します。CMSや共通テンプレートの設定も見直すスキルです。

• サイト全体の説明文の重複調査
• 記事ごとの説明文を作りたいとき
• 共通SEO部品の設定レビュー

ファイル選択欄やドラッグ＆ドロップ領域を点検し、ラベル、形式・容量の案内、進捗やエラー通知を改善します。読み上げやキーボードで使えるか確認するスキルです。

• アップロード欄のラベルと説明の確認
• ドラッグ操作の代替手段の点検
• 進捗やエラーの読み上げ改善

独自のHTML要素やWeb Componentsを点検し、読み上げ用の役割・名前、キーボード操作、フォーカス管理、フォーム連携の不足と修正案を整理するスキル。

• 独自部品の読み上げ対応を確認したいとき
• メニューのキーボード操作の点検
• 独自入力欄のフォーム連携

固定ヘッダーやバナーがキーボード操作中の選択先を隠していないか点検します。拡大表示やモバイル画面も確認し、余白やスクロールの修正を支援します。

• 固定ヘッダー周辺のキー操作確認
• バナーやチャット表示中の動作確認
• 拡大時やモバイル画面の重なり確認

プロジェクトで使う外部パッケージの既知の脆弱性を調べ、更新・修正・置き換えや、継続的に検査するためのCI設定と依存関係の固定を支援するスキル。

• 本番公開前に依存関係を点検したいとき
• パッケージの脆弱性報告に対応したいとき
• CIに依存関係の自動検査を加えたいとき

Webサイトのダークモード対応を点検し、OS設定に合わせた配色や手動切り替えを整えます。固定色やコントラスト、画面幅・操作状態ごとの表示も確認します。

• OS設定に配色を合わせたいとき
• 暗い背景で崩れる固定色の点検
• 選択を保存するテーマ切り替えの追加

Webページのスクリプト読み込みを点検し、defer・async・type=moduleの使い分けと修正を支援します。ブラウザに届くHTMLまで確認します。

• ページ表示を遅らせるタグの点検
• スクリプトの読み込み方式を選びたいとき
• 共通部品が出力するHTMLのレビュー

装飾用の画像やアイコンが、スクリーンリーダーで不要に読み上げられないかを点検します。空のaltやaria-hiddenを確認し、実際に問題がある要素の修正を支援します。

• 装飾画像の不要な読み上げの点検
• SVGやアイコンの読み上げ確認
• 共通の装飾コンポーネントの点検