「vin」の検索結果

大量の行やカードを表示する画面を調べ、見えている範囲だけを描画する仮想化を検討し、操作性やアクセシビリティを保ちながら表示負荷の改善を支援するスキル。

• 管理画面の表が重い原因を調べたいとき
• 長い検索結果の表示を見直したいとき
• フィードの描画負荷を減らしたいとき

JavaScriptファイルの圧縮後の容量と読み込み負荷を調べ、コードの分割や未使用部分の除去、依存関係の見直しで表示や操作の遅れを改善するスキル。

• 圧縮後200KB超のJSを探したいとき
• ページ操作開始までの遅れを調べたいとき
• コード分割で容量を減らしたいとき

テストで外部依存を代役に置き換えるモックの使い方を点検し、過剰な置き換えや後片付け漏れを修正します。CIで問題を継続的に検知できるかも確認します。

• モックが多すぎるテストの見直し
• テスト間の後片付けの確認
• 実際に近いAPIモックへの改善

実店舗や地域密着型ビジネスのサイトで、店名・住所・電話番号・営業時間などを検索エンジンに伝える構造化データを点検し、追加や修正を支援するスキル。

• 地域ビジネスの構造化データ点検
• ホームや問い合わせページへの事業情報追加
• 飲食店や店舗に合うタイプの選択

ページのHTMLを調べ、body内などに誤って置かれたメタタグを特定して、headへの移動やスクリプトの挿入先の修正を支援するスキル。

• CMSプラグイン変更後のタグ配置を確認
• JavaScriptによるbody内への挿入を調査
• robotsやOGなどの配置を点検

Webページや画像などの配信時に、ファイルの種類とHTTPヘッダーが一致しているかを点検し、CSSやJavaScriptが読み込めない原因とサーバー設定の修正箇所を整理するスキル。

• CSSやスクリプトの読込不良を調べたいとき
• 静的ファイルの配信設定の監査
• 文字コードとnosniff設定の確認

本文中のリンクが色だけに頼らず見分けられるかを点検します。下線、文字色のコントラスト、ホバーやフォーカス時の表示を確認し、CSSの修正案を示します。

• 本文リンクの下線を外す際の確認
• リンクと本文のコントラスト確認
• ホバーやフォーカス表示の点検

モダンブラウザに不要な旧形式のJavaScriptや互換コードを調べ、実測で負荷を確かめながら、配信方法とビルド設定の見直しを支援するスキル。

• ページ読み込みの遅さを調べたいとき
• 不要な互換コードの点検
• モダンブラウザ向けビルド設定の見直し

フロントエンドのコードや公開ページを386のルールで点検します。アクセシビリティや表示速度、SEOなどを横断し、根拠のある問題と具体的な修正方法を整理します。

• 公開前のページを点検したいとき
• フォームや操作部品のコードレビュー
• 表示速度とセキュリティの点検

HTMLに直接書かれたJavaScriptを点検し、外部ファイルとaddEventListenerへ整理して、保守性やキャッシュ利用の改善を支援します。

• HTML内のJavaScriptを分離したいとき
• onclickをaddEventListenerに変更
• キャッシュ利用と保守性の見直し

画像を使った入力ボタンのHTMLを点検し、操作の目的を伝える代替テキストの不足を見つけます。検索や送信などの動作が読み上げでも分かるよう、alt属性の修正を支援します。

• 画像入力ボタンの代替テキスト点検
• 検索・送信ボタンの説明を整えたいとき
• 共通の画像ボタン部品のレビュー

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

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

子要素の状態や入力内容に応じて親要素の見た目を変える処理を見直し、JavaScriptのクラス切り替えをCSSの :has() に置き換える支援をします。

• クラス切り替え処理をCSSに移したいとき
• 入力状態に応じたフォームの装飾
• 子要素の有無に応じた親要素の装飾

本文を覆うポップアップやモーダルを点検し、モバイルでの閲覧、閉じる操作、キーボードのフォーカス管理を確認して、SEOとアクセシビリティの改善を支援するスキル。

• モバイルの広告ポップアップ点検
• モーダルをキーボードで閉じたいとき
• ダイアログ開閉時のフォーカス確認

Webページの見出し階層を点検し、見出しレベルの飛びや構造の不整合を修正して、スクリーンリーダーで内容をたどりやすくするためのスキル。

• ページの見出し順を点検したいとき
• 共通コンポーネントの見出し構造の確認
• 読み上げの見出し一覧を整えたいとき

Webページの画像形式・容量・表示サイズ・読み込み方法を点検し、修正を支援します。画面幅に応じた画像の出し分けや、読み込み時のレイアウトずれも扱います。

• 表示が遅いページの画像容量・形式点検
• モバイルとPCで画像サイズを出し分け
• 画像読み込み時の表示ずれを防ぎたいとき

Front-End Checklistのルール文書を採点基準に沿って点検し、曖昧なAI向け指示や不足項目を、具体的な手順とコード例で補うスキル。

• 未完成のチェックリストルールの拡充
• AI向け確認・修正指示の具体化
• PR前のルール構造と品質の確認

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

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

WebページのHTMLを点検し、汎用のdivを内容の役割に合う要素へ置き換える方針を示して、読み上げでの移動や検索エンジンによる構造の理解を支えるスキル。

• div中心のページ構造を見直したいとき
• テンプレートや共通部品の出力HTML確認
• 読み上げで移動しやすい構造にしたいとき

初回表示を重くする地図やエディターなどの任意機能を見つけ、クリックやフォーカス後に必要なコードを読み込む構成へ変更し、読み込み中の表示も整えます。

• 地図をパネル表示時に読み込みたいとき
• エディターを操作時に読み込みたいとき
• 初回表示を遅くするチャットの点検

ページの主要画像や重要なフォント・CSSの読み込み優先度を点検し、fetchpriority属性で表示に必要なリソースの取得順を調整するスキル。

• 主要画像の表示速度を改善したいとき
• 画面外の画像との読み込み競合の見直し
• フォントやCSSの先読み優先度の確認

ドラッグ＆ドロップをキーボードやスクリーンリーダーでも使えるか点検し、実際に表示されるHTMLを基に、代替操作や操作状況の読み上げを整えるスキル。

• ドラッグ操作のキーボード対応確認
• スクリーンリーダーへの状態通知確認
• 出力されたHTMLの点検

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

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

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

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