HTML H1-1 title - あり <title> </title> - ページタイトル + ページ 遷 移 時 に 読 み 上 げる H1-2 - なし <title></title> なし 読 み 上 げしない H2 h1...h6 <h1> </h1> みだし + H3 em - <em> </em> タグ 前 後 の がある 場 合 は 一 拍 おいて 読 まれる H4 strong - <strong> </strong> タグ 前 後 の がある 場 合 は 一 拍 おいて 読 まれる H5 mark - <mark> </mark> タグ 前 後 の がある 場 合 は 一 拍 おいて 読 まれる H6 time datetime <time datetime="2000-1-1"> </time> 時 刻 + 属 性 :datetime 内 の は 読 み 上 げない H7-1 img title <img src="hoge.gif" title=" "> ( 画 像 の 表 示 ) H7-2 alt <img src="hoge.gif" alt=" "> ( 画 像 の 表 示 ) imgタグの 読 み 上 げはalt 属 性 の 利 用 を 推 奨 する H7-3 なし <img src="hoge.gif"> ( 画 像 の 表 示 ) イメージ + 拡 張 子 を 除 いたファイル 名 属 性 :longdescを 指 定 した 場 合 も 同 様 H7-4 title=" " alt=" " <img src="hoge.gif" alt=" " title=" "> ( 画 像 の 表 示 ) alt 属 性 とtitle 属 性 に 同 じ が 設 定 されていた 場 合 2 度 読 まず1 度 だけ 読 み 上 げ る H7-5 title="title " alt="alt " <img src="hoge.gif" alt="alt " title="title 文 字 列 "> ( 画 像 の 表 示 ) title +alt alt 属 性 とtitle 属 性 にそれぞれ 異 なる が 設 定 されていた 場 合 両 方 読 み 上 げる H7-6 alt="" <img src="hoge.gif" alt=""> ( 画 像 の 表 示 ) 読 み 上 げない alt 属 性 が 空 文 字 の 場 合 読 み 上 げを 行 わない H8-1 input type="text" <input type="text"> - 文 字 入 力 ボックス +テキストボックスに 入 力 された 未 入 力 の 場 合 は 補 足 読 み 上 げのみ H8-2 type="password" <input type="pwssword"> - パスワード 入 力 ボックス + ( 入 力 文 字 分 ドットを 読 み 上 げる) 未 入 力 の 場 合 は 補 足 読 み 上 げのみ H8-3 type="email" <input type="email"> - メールアドレス 入 力 ボックス +テキストボックスに 入 力 された 未 入 力 の 場 合 は 補 足 読 み 上 げのみ H8-4 type="number" <input type="number"> - 数 字 入 力 ボックス +テキストボックスに 入 力 された 数 値 未 入 力 の 場 合 は 補 足 読 み 上 げのみ H8-5 type="url" <input type="url"> - URL 入 力 ボックス +テキストボックスに 入 力 された 未 入 力 の 場 合 は 補 足 読 み 上 げのみ H8-6 type="radio" チェック 時 <input type="radio"> - ラジオボタンです + オン グループ 設 定 されている 場 合 は 以 下 ラジオボタン + オン + 個 中 の 個 です <label>タグと 組 み 合 わせることで 選 択 項 目 の 読 み 上 げが 可 能 H8-7 未 チェック 同 上 - ラジオボタンです + オフ グループ 設 定 されている 場 合 は 以 下 ラジオボタン + オフ + 個 中 の 個 です <label>タグと 組 み 合 わせることで 選 択 項 目 の 読 み 上 げが 可 能 H8-8 type="checkbox" チェック 時 <input type="checkbox"> - チェックボックス + オン <label>タグと 組 み 合 わせることで 選 択 項 目 の 読 み 上 げが 可 能 H8-9 未 チェック 同 上 - チェックボックス + オフ <label>タグと 組 み 合 わせることで 選 択 項 目 の 読 み 上 げが 可 能 H8-10 type="file" <input type="file"> - ファイル 選 択 +ファイル 名 未 選 択 の 場 合 は 補 足 読 み 上 げのみ H8-11 type="range" <input type="range"> - スライダー + 数 値 H8-12 type="image" alt <input type="image" src="hoge.gif" alt=" "> ( 画 像 の 表 示 ) + ボタン altは 指 定 が 必 須 の 属 性 H8-13 type="submit" value <input type="submit" value=" "> ( のボタン 表 示 ) + ボタン value 値 に 何 も 設 定 されていない 場 合 デフォルト 文 言 を 読 み 上 げる 読 み 上 げ 方 : 送 信 + ボタン H8-14 type="reset" value <input type="reset" value=" "> ( のボタン 表 示 ) + ボタン value 値 に 何 も 設 定 されていない 場 合 デフォルト 文 言 を 読 み 上 げる 読 み 上 げ 方 : リセット + ボタン H8-15 type="button" value <input type="button" value=" "> ( のボタン 表 示 ) + ボタン H8-16 type="search" <input type="search"> - 検 索 文 字 入 力 ボックス +テキストボックスに 入 力 された H8-17 type="tel" <input type="tel"> - 電 話 番 号 入 力 ボックス +テキストボックスに 入 力 された H8-18 上 記 以 外 のタイプ - - 文 字 入 力 ボックス +テキストボックスに 入 力 された H8-19 タイプ 属 性 全 般 title 例 <input type="text" title=" "> - + 各 input typeの 読 み 上 げ 例 + 文 字 入 力 ボックス +テキストボックスに 入 力 された H8-20 タイプ 属 性 全 般 placeholder 未 入 力 時 例 <input type="text" title="title " placeholder="placeholder "> placeholder title +placeholder + 各 input typeの 読 み 上 げ 例 title +placeholder + 文 字 入 力 ボックス H8-21 タイプ 属 性 全 般 placeholder 入 力 済 例 <input type="text" title="title " placeholder="placeholder "> ( 入 力 された ) placeholderの 内 容 は 表 示 しない title + 各 input typeの 読 み 上 げ 例 title + 文 字 入 力 ボックス +テキストボックスに 入 力 された H9-1 select - <select> 選 択 されている 項 目 の 文 字 + 単 一 選 択 ボックス + n 項 目 中 m 項 目 目 H9-2 multiple <select multiple> 先 頭 に 選 択 されている 項 目 の 文 字 + 複 数 選 択 ボックス + n 項 目 中 m 項 目 選 択 複 数 選 択 していても 先 頭 しか 読 み 上 げされない H9-3 title 例 <select title=" "> + 各 selectの 読 み 上 げ 例 + 選 択 されている 項 目 の 文 字 + 単 一 選 択 ボックス + n 項 目 中 m 項 目 目 H10-1 textarea - <textarea></textarea> 文 字 表 示 ボックス +テキストボックスに 入 力 された 未 入 力 の 場 合 は 補 足 読 み 上 げのみ H10-2 title <textarea title=" "></textarea> - +textareaの 読 み 上 げ 例 + 文 字 表 示 ボックス +テキストボックスに 入 力 された 1
H10-3 placeholder 未 入 力 時 <textarea title="title " placeholder="placeholder "></textarea> placeholder title +placeholder + 各 input typeの 読 み 上 げ 例 title +placeholder + 文 字 表 示 ボックス H10-4 入 力 済 <textarea title="title " placeholder="placeholder "></textarea> ( 入 力 された ) placeholderの 内 容 は 表 示 しない title + 各 input typeの 読 み 上 げ 例 title + 文 字 表 示 ボックス +テキストボックスに 入 力 された H11-1 button <img>の 入 れ 子 <button type="button"><img src="hoge.gif"></button> ( 画 像 の 表 示 ) イメージ + 拡 張 子 を 除 いたファイル 名 + ボタン H11-2 - <button type="button"> </button> (ボタン 上 に 表 示 ) + ボタン H11-3 title <button type="button" title="title "> </button> (ボタン 上 に 表 示 ) title +buttonの 読 み 上 げ 例 title + + ボタン H12 label <input type="text"> と 関 連 付 け <label for="label1">label </label><input type="text" id="label1"> label +<input type="text">の 内 容 用 例 の 場 合 : イメージ + 拡 張 子 を 除 いたファイル 名 フォームコントロール(button input textarea select keygen)の 関 連 付 けも 同 様 H13 table summary summary 属 性 の 読 上 げ <table summary=" ">~ (summaryの 内 容 は 表 示 されない) + 選 択 要 素 読 み 上 げ table 内 の 要 素 選 択 時 に 一 度 だけ 読 み 上 げ 他 のtable 要 素 やtable 以 外 の 要 素 選 択 で 状 態 はリセット H14 caption - <table><caption> </caption> ( 表 の 上 部 に 表 示 ) H15-1 th - <table> <tr><th> </th></tr> H15-2 abbr <table> <tr><th abbr=" 省 略 形 "> </th></tr> abbr 属 性 は 読 み 上 げない H16-1 td - <table> <tr><td> </td></tr> H16-2 abbr <table> <tr><td abbr=" 省 略 形 "> </td></tr> abbr 属 性 は 読 み 上 げない H17-1 a - <a href="hoge.html"> </a> + リンク H17-2 title 例 1 <a href="hoge.html" title="title "> </a> 例 2 <a title=" 押 してください"> <h1>これは<span>サンプルイメージ</span>です </h1> </a> 例 1 title + + リンク 例 2 imgタグ 選 択 時 押 してください+ サンプル 画 像 + リンク h1タグ 選 択 時 押 してください+ みだし + これはサンプルイメージです + リンク spanタグ 選 択 時 押 してください+ みだし + サンプルイメージ + リンク aタグ 内 の 要 素 に 触 れられた 場 合 常 にtitleの 内 容 を 読 み 上 げる H18-1 area href alt=" " <img src="map.gif" usemap="#map1> <map name="map1"> <area href="store.html"alt=" "> </map> H18-2 href + altなし <img src="map.gif" usemap="#map1> <map name="map1"> <area href="store.html"> </map> H19 ul <li>の 入 れ 子 <ul> <li> </li> </ul> - + リンク - img 要 素 読 み 上 げ( 用 例 の 場 合 拡 張 子 を 除 いたファイル 名 )+ リンク area 要 素 のリンクにはalt 属 性 は 必 須 である 本 仕 様 はあくまでフェールセーフの 明 記 となるため 利 用 は 推 奨 しない リスト 項 目 + n 項 目 中 m 項 目 目 + n 項 目 中 m 項 目 目 は 対 象 リストアイテムを 初 めて 選 択 した 場 合 に 読 み 上 げ H20-1 ol <li>の 入 れ 子 <ol> <li> </li> </ol> リスト 項 目 + n 項 目 中 m 項 目 目 + 番 号 + n 項 目 中 m 項 目 目 は 対 象 リストアイテムを 初 めて 選 択 した 場 合 に 読 み 上 げ H20-2 <li>の 入 れ 子 <li value="">の 入 れ 子 <ol> <li value=" 値 "> </li> </ol> (valueは 順 序 の 数 値 ) リスト 項 目 + n 項 目 中 m 項 目 目 + 番 号 + <li>のvalue 属 性 は 読 み 上 げない 個 中 の 個 です は 対 象 リストアイテムを 初 めて 選 択 した 場 合 に 読 み 上 げ H21 p - <p> </p> <p>~</p> 内 を 連 続 して 読 み 上 げる(<br>は 無 視 ) H22 keygen - 選 択 されている 項 目 の 文 字 + 単 一 選 択 ボックス + n 項 目 中 m 項 目 目 selectと 同 様 の 読 み 上 げ H23-1 audio - タグ 全 体 を 選 択 <audio src="sample.ogg"></audio> 音 楽 を 再 生 できます H23-2 controls 再 生 停 止 ボタ ンを 選 択 <audio src="sample.ogg" controls></audio> 再 生 停 止 ボタン 2
H23-3 スライダーを 選 択 H24-1 video - タグ 全 体 を 選 択 <video src="sample.ogv"></video> 動 画 を 再 生 できます スライダー + 時 間 時 間 分 秒 へフォーマット H24-2 controls 再 生 停 止 ボタ ンを 選 択 <video src="sample.ogv" controls></video> ( 再 生 停 止 ボタンの 表 示 ) 再 生 停 止 ボタン H24-3 スライダーを 選 択 (スライダーの 表 示 ) スライダー + 時 間 時 間 分 秒 へフォーマット H24-4 全 画 面 ボタンを 選 択 ( 全 画 面 ボタンの 表 示 ) 全 画 面 ボタン H25 br - <div>こんにちは <br>いい 天 気 ですね!<div> こんにちは いい 天 気 ですね! こんにちは いい 天 気 ですね! タグの 区 切 りとして 使 用 せず 前 後 の 要 素 を 結 合 する レイアウト 等 見 栄 えでbrを 使 われるケースがあるため 文 の 区 切 りとしては 扱 わな い H26 wbr - <div>こんにちは <wbr>いい 天 気 ですね!<div> こんにちは いい 天 気 ですね! wbrは 改 行 の 許 可 であり 実 際 の 表 示 では 改 行 されない 場 合 がある こんにちは いい 天 気 ですね! タグの 区 切 りとして 使 用 せず 前 後 の 要 素 を 結 合 する レイアウト 等 見 栄 えでwbrを 使 われるケースがあるため 文 の 区 切 りとしては 扱 わな い CSS C1 display:none <div> 表 示 1<span style="display:none"> 非 表 示 </span> 表 示 2</div> 表 示 1 表 示 2 読 み 上 げない( の 途 中 で 指 定 されている 場 合 は その 部 分 について 読 み 飛 ばす) C2 visibility:hidden <div> 表 示 1<span style="visibility:hidden"> 非 表 示 </span> 表 示 2</div> 表 示 1 表 示 2 読 み 上 げない( の 途 中 で 指 定 されている 場 合 は その 部 分 について 読 み 飛 ばす) JavaScrippt J1 alert() <script type="text/javascript" window.alert( ダイアログのメッセージ"); //? J2 confirm() <script type="text/javascript" window.confirm ( ダイアログのメッセージ"); //? J3 prompt() <script type="text/javascript" window.prompt( ダイアログのメッセージ, 入 力 文 字 列 "); // --> - ダイアログです + 内 容 を 確 認 してOKボタンを 押 して 下 さい - ダイアログです + 内 容 を 確 認 してOKボタンまたはキャンセルボタンを 押 して 下 さい - ダイアログです + テキストを 入 力 してOKボタンまたはキャンセルボタンを 押 して 下 さい 3
TIPS 項 番 概 要 詳 細 E1 タグ 一 覧 にないタグ 要 素 の 読 み 上 げについて 一 覧 にない 要 素 属 性 については 補 足 読 み 上 げなど 特 別 な 読 み 上 げには 対 応 しない 画 面 上 に 見 える のみ 読 み 上 げる 例 ruby 要 素 の 読 み 上 げについて rubyタグはrp 要 素 で 囲 まれた 部 分 は 非 表 示 ( 無 視 される)となる よってrp 要 素 は 読 み 上 げしない 表 示 されるテキスト 部 分 を 読 み 上 げる 補 足 等 の 読 上 げはしない なお テキスト 部 分 の 読 上 げに 関 しましてはタグの 順 序 に 依 存 する わかりにくい 読 上 げとなってしまう 例 <ruby> 夕 <rt>ゆう</rt> 飯 <rt>はん</rt> </ruby><br> 上 記 のような 記 載 の 場 合 " 夕 " "ゆう" " 飯 " "はん" と 文 字 ごとに 分 かれて 読 上 げられる(タグで 区 切 られるため) この 例 の 場 合 は 単 語 に 対 して 読 み 仮 名 を 設 定 した 方 がユーザーが 理 解 しやすいものと 考 えられる 単 語 に 読 み 仮 名 を 設 定 した 例 <ruby> 夕 飯 <rt>ディナー</rt> </ruby><br> 上 記 の 場 合 は" 夕 飯 " "ディナー"と 読 み 上 げる E2 E3 z-indexを 利 用 したコンテンツをタップした 場 合 の 読 み 上 げについて frame iframeについて タップした 位 置 の 最 前 面 の 要 素 を 読 み 上 げる フレーム 内 の 要 素 も 読 み 上 げる E4 contenteditable 属 性 について グローバル 属 性 のcontenteditable 属 性 に 関 しては 付 加 するとコンテンツが 編 集 可 能 となるが 以 下 観 点 から 読 み 上 げユーザー 向 けには 利 用 禁 止 とし 編 集 可 能 として 読 み 上 げず 各 タグ 仕 様 に 従 った 読 み 上 げとする 編 集 可 能 かどうかが 見 た 目 で 判 別 できないため E5 複 数 の 子 要 素 を 内 包 可 能 な 要 素 を 選 択 した 場 合 の 読 み 上 げ 対 象 付 加 部 分 は 除 く 対 象 要 素 button h1~h6 上 記 以 外 のタ グ 以 下 のタグは 個 別 の 読 み 上 げ 仕 様 を 優 先 area img input select textarea keygen audio video em strong cite mark 子 要 素 のimgとテキストのみをタグ 順 に 並 べた とする 例 <h1> <div> これは<span>サンプル 画 像 </span>です </div> <input type="button" value=" 詳 細 を 見 る"> </h1> 上 記 のような 記 載 の 場 合 h1タグを 選 択 すると みだし + サンプル 画 像 + これはサンプル 画 像 です と 読 み 上 げられる img 部 品 とテキストのみを 読 み 上 げ 対 象 とするため この 場 合 はinputの 読 み 上 げは 行 わない E6 子 要 素 の 読 み 上 げ 時 に 親 要 素 の 補 足 を 読 み 上 げる 付 加 対 象 要 素 h1~h6 time li table 選 択 要 素 の 読 み 上 げ の 生 成 を 行 った 後 上 位 のタグへ 向 かって 必 要 な 読 み 上 げ 情 報 を 付 加 する 例 入 れ 子 状 態 の 読 み 上 げ 例 aタグ( 親 要 素 )にimg,h1,divが 入 れ 子 ( 子 要 素 )となっている 親 要 素 は 子 要 素 の 上 位 タグ <a> <h1>これは<span>サンプルイメージ</span>です</h1> <div> 詳 細 の 確 認 は<input type="button" value=" 詳 細 を 見 る">ボタンを 押 して 下 さい </div> </a> タグ 選 択 時 サンプル 画 像 + これはサンプルイメージです 詳 細 の 確 認 は + ボタンを 押 して 下 さい + リンク imgタグ 選 択 時 サンプル 画 像 + リンク h1タグ 選 択 時 みだし + これはサンプルイメージです + リンク spanタグ 選 択 時 みだし + サンプルイメージ + リンク inputタグ 選 択 時 詳 細 を 見 る + ボタン + リンク 4
TIPS 項 番 概 要 詳 細 E7 補 足 読 み 上 げの 順 番 について 付 加 対 象 要 素 入 れ 子 の 順 番 によって 付 加 情 報 が 入 れ 替 わる 場 合 がある h1~h6 例 入 れ 子 の 順 番 による 読 み 上 げ 差 異 time li <h1><time>2013 年 01 月 15 日 </time></h1> table 上 記 の 例 でtime 選 択 時 みだし + 時 刻 + 2013 年 01 月 15 日 <time><h1>2013 年 01 月 15 日 </h1></time> 上 記 の 例 でh1タグ 選 択 時 時 刻 + みだし + 2013 年 01 月 15 日 5