本文へ移動
cccskills

「output」の検索結果

3,539 件 ・ 関連度順

概要と使いどころ

landmark-one-main

無料日本語概要

ページの主要コンテンツを示すmain領域が一つだけあるかを確認し、重複や欠落を指摘して、スクリーンリーダー利用時の移動先を明確にするスキル。

  • ページひな型のmain領域を確認
  • 組み合わせたレイアウトのmain重複を修正
  • スクリーンリーダーで本文への移動を確認
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

link-text

無料日本語概要

リンク先が単独でも伝わる文言かを点検し、曖昧な表現や読み上げ用の名前を改善します。キーボード操作やダウンロードリンクの案内も確認するスキルです。

  • 曖昧なリンク文言を直したいとき
  • 読み上げ時のリンクを点検したいとき
  • ダウンロードリンクの案内確認
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

meta-refresh

無料日本語概要

HTMLの自動転送設定を点検し、突然のページ更新や移動による読み上げの中断を防ぐ修正を提案します。サーバー側の転送や利用者が選べるリンクへの置き換えを扱います。

  • HTMLの自動転送を探したいとき
  • サーバー側の転送に置き換えたいとき
  • 読み上げ利用時のページ移動の点検
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

keyboard-navigation

無料日本語概要

Web画面をキーボードだけで操作できるか点検し、Tabの移動順や非表示要素への移動、操作から抜け出せない問題を確認します。該当要素と修正・検証方法を示します。

  • Tabで全操作要素に届くか確認
  • 見た目に合うフォーカス順への修正
  • 非表示要素をTabの移動対象から除外
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

list-structure

無料日本語概要

HTMLの箇条書きや番号付きリストの親子構造を点検し、不適切な要素や入れ子を修正して、スクリーンリーダーが項目数や現在位置を正しく伝えられるようにするスキル。

  • HTMLのリスト構造を点検したいとき
  • 入れ子のリストを修正したいとき
  • 読み上げ時の案内を確認したいとき
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

landmark-regions

無料日本語概要

ページの主要領域を示すHTML要素とラベルを点検し、スクリーンリーダーで本文やナビゲーションへ移動しやすい構造への改善を支援するスキル。

  • 読み上げ時のページ内移動の点検
  • 汎用コンテナを意味のあるHTMLへ改善
  • 複数のナビゲーションのラベル確認
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

modal-accessibility

無料日本語概要

モーダルダイアログのキーボード操作と読み上げ対応を点検し、フォーカスの移動、Escapeでの終了、タイトルの関連付けの改善を支援するスキル。

  • モーダルのキーボード操作の点検
  • 開閉時のフォーカス移動を確認したいとき
  • タイトルと読み上げ用ラベルの確認
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

label-content-name-mismatch

無料日本語概要

ボタンやリンクの表示文字と支援技術が使う名前を照合し、音声操作で見たとおりの名前を指定できるよう、ARIA属性の修正と確認方法を案内するスキル。

  • ボタンの表示文字と名前を照合したいとき
  • 音声操作しにくいリンクの点検
  • アクセシビリティツールで修正を確認
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

input-image-alt

無料日本語概要

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

  • 画像入力ボタンの代替テキスト点検
  • 検索・送信ボタンの説明を整えたいとき
  • 共通の画像ボタン部品のレビュー
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

form-labels

無料日本語概要

フォームの入力欄とラベルの対応を点検し、プレースホルダーだけの項目や選択肢グループの見出し不足を見つけて、読み上げや操作に配慮した修正を支援します。

  • 申し込みフォームのラベル点検
  • プレースホルダーだけの項目を直したいとき
  • チェックボックスやラジオボタンの群を点検
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

input-types

無料日本語概要

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

  • 既存フォームの入力属性を点検したいとき
  • スマホのメール・電話入力を整えたいとき
  • ブラウザの自動入力を設定したいとき
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

frame-title

無料日本語概要

Webページ内のiframeやframeに内容が伝わるタイトルがあるか点検します。空欄や説明不足を見つけ、スクリーンリーダーで埋め込み内容を識別しやすくする修正を支援します。

  • 埋め込み広告やSNSのタイトル確認
  • iframeのtitle欠落や空欄を調べたいとき
  • スクリーンリーダーでのフレーム識別確認
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

form-field-multiple-labels

無料日本語概要

フォームの入力欄に複数のラベルが結び付いていないかを点検し、読み上げの重複や混乱を防ぐため、ラベルの統合とaria-labelledbyの使い分けを示すスキル。

  • 入力欄の重複ラベルを探したいとき
  • 複数の文章を入力欄の名前に使いたいとき
  • 読み上げによるフォームラベルの確認
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

heading-hierarchy

無料日本語概要

Webページの見出しを点検し、階層の飛びや内容に合わない見出しを洗い出します。画面読み上げでページ構成をたどりやすいよう、HTMLの構造を整えます。

  • ページの見出し階層を点検したいとき
  • 画面読み上げでの移動しやすさ改善
  • デザインシステムの見出し確認
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

identical-links-same-purpose

無料日本語概要

同じ文言なのに異なるページへ移動するリンクを見つけ、リンク先の統一や文言の修正を支援し、スクリーンリーダーでも行き先を判断しやすくするスキル。

  • 同じリンク文言の行き先を点検したいとき
  • 読み上げ時のリンク文言の改善
  • 共通コンポーネントのリンク確認
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

html5-semantic-elements

無料日本語概要

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

  • div中心のページ構造を見直したいとき
  • テンプレートや共通部品の出力HTML確認
  • 読み上げで移動しやすい構造にしたいとき
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

heading-order

無料日本語概要

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

  • ページの見出し順を点検したいとき
  • 共通コンポーネントの見出し構造の確認
  • 読み上げの見出し一覧を整えたいとき
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

inclusive-language

無料日本語概要

画面の文章や操作案内を見直し、障害・性別・文化への思い込みを含む表現や利用者を責めるエラー文を見つけ、中立で建設的な言い換えを提案するスキル。

  • 画面文言の排他的な表現の点検
  • 利用者を責めるエラー文の書き換え
  • 性別を決めつけない表現を選びたいとき
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

h1

無料日本語概要

ページの主題を伝えるH1見出しを点検・作成します。欠落や重複、空欄、ブランド名だけの見出しを見つけ、本文やタイトルと整合する具体的な文面に整えます。

  • ページの見出しを点検したいとき
  • LPやブログ記事のH1作成
  • CMSテンプレートの出力確認
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

hreflang

無料日本語概要

多言語サイトの言語・地域別ページを検索エンジンに伝えるhreflangを点検・修正します。実際のHTMLとHTTP応答を確認し、相互参照や既定ページの設定漏れを探します。

  • 言語・地域別ページの設定確認
  • 言語版同士の相互参照の点検
  • 既定ページの設定確認
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

duplicate-description

無料日本語概要

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

  • サイト全体の説明文の重複調査
  • 記事ごとの説明文を作りたいとき
  • 共通SEO部品の設定レビュー
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

empty-heading

無料日本語概要

Webページの空の見出しや空白だけの見出しを探し、説明文の追加や不要なタグの削除を通じて、スクリーンリーダーでたどれる文書構造を整えるスキル。

  • Webページの空見出しを探したいとき
  • 装飾目的の見出しを使う部品の点検
  • スクリーンリーダーの見出し移動確認
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

empty-links

無料日本語概要

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

  • ページ内の空リンクを探したいとき
  • アイコンリンクに移動先の説明を追加
  • リンク切れを点検・修正したいとき
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新

definition-list

無料日本語概要

用語と説明を並べるHTMLの定義リストを点検し、要素の入れ子や対応関係の問題を確認。読み上げソフトに情報のまとまりが伝わる構造への修正を支援します。

  • 用語集のHTML構造を確認したいとき
  • 用語と説明の対応関係の点検
  • 読み上げで分かりにくい定義リストの修正
thedaviddias/Front-End-Checklist7.4万2026年10月6日 更新