日 本 ウェブアクセシビリティ 普 及 ネットワークに ご 協 力 いただいている 方 々 サポーター ゴールドサポーター 募 集 中 シルバーサポーター 募 集 中 ブロンズサポーター 募 集 中 ご 協 力 者 様 (セミナー 講 師 協 力 技 術 協 力 ) セミナーを 開 催 する 際 の

Transcription

1 図 解 カラー 20 分 でわかる ウェブアクセシビリティ JIS X :2010 編 集 発 行 : 日 本 ウェブアクセシビリティ 普 及 ネットワーク 難 しい 技 術 でなく 身 近 だと 1 人 1 人 に 感 じてほしい 障 害 を 持 つ 当 事 者 がつくる 日 本 ウェブアクセシビリティ 普 及 ネットワーク 代 表 板 垣 宏 明 あなたのウェブサイトは 何 点? かんたんセルフチェック! 20 分 でできる 簡 単 チェックシート 等 級 A は 以 下 よりダウンロード 0

2 日 本 ウェブアクセシビリティ 普 及 ネットワークに ご 協 力 いただいている 方 々 サポーター ゴールドサポーター 募 集 中 シルバーサポーター 募 集 中 ブロンズサポーター 募 集 中 ご 協 力 者 様 (セミナー 講 師 協 力 技 術 協 力 ) セミナーを 開 催 する 際 の 講 師 としてのご 協 力 株 式 会 社 インフォアクシア 代 表 取 締 役 植 木 真 様 <プロフィール> Web アクセシビリティ コンサルタント W3C の WCAG 2.0 日 本 工 業 規 格 の JIS X などの 策 定 にも 従 事 2012 年 10 月 よりウェブアクセシビリティ 基 盤 委 員 会 (WAIC)の 委 員 長 をつとめる 研 修 を 行 う 際 の 講 師 としてのご 協 力 Cocktailz(カクテルズ) 代 表 伊 敷 政 英 様 ( 専 門 :ウェブアクセシビリティ) 所 属 :( 株 ) 富 士 通 システムズ ウエスト 常 駐 先 : 名 古 屋 盲 人 情 報 文 化 センター 星 野 史 充 様 ( 専 門 : ウェブアクセシビリティ) 株 式 会 社 ミライロ 代 表 取 締 役 社 長 垣 内 俊 哉 様 ( 専 門 :バリアフリー) 特 別 講 師 技 術 コンサルタントとしてのご 協 力 バスタイムフィッシュ 代 表 村 岡 正 和 様 ご 協 力 団 体 様 セミナー 開 催 のご 協 力 兵 庫 ニューメディア 協 議 会 様 業 務 発 注 実 績 提 供 などのご 協 力 神 戸 市 様 障 害 を 持 つ 当 事 者 団 体 ネットワーク(ユーザー 評 価 ニーズ 調 査 のご 協 力 ) 名 古 屋 盲 人 情 報 文 化 センター 様 /e-work( 在 宅 就 労 者 の 会 ) 様 /NPO 法 人 神 戸 アイライト 協 会 様 / アイ コラボレーショングループ ネットワーク 拡 大 中 お 問 合 せ 日 本 ウェブアクセシビリティ 普 及 ネットワーク 電 話 番 号 : 運 営 :NPO 法 人 アイ コラボレーション 神 戸 営 業 日 時 : 月 曜 日 ~ 金 曜 日 午 前 9 時 30 分 ~ 午 後 5 時 30 分 祝 日 年 末 年 始 除 く URL: mail : info@ jis8341.net 担 当 : 板 垣 北 山 1

3 サンプル 冊 子 のもくじ 1.ごあいさつ 活 動 内 容 障 害 を 持 つ 当 事 者 がつくる 日 本 ウェブアクセシビリティ 普 及 ネットワーク その 活 動 内 容 とは? 3ページへ 2.ウェブアクセシビリティとは? ウェブアクセシビリティの 概 要 をカンタンにご 説 明 します 4ページへ 3.アクセシビリティが 必 要 な 人 ウェブアクセシビリティを 必 要 としている 人 は たくさんいます 7ページへ 4.アクセシビリティ 理 解 のポイント アクセシビリティは 難 しくない! 大 事 なポイントが 分 かれば 理 解 はカンタン 9ページへ 5. 何 からはじめたらいいの? 15ページへ アクセシビリティが 大 事 なことは 分 かったけど 何 からはじめたらいいの? と お 悩 みの 方 へ 6. 実 際 に 簡 易 チェックしてみましょう 16ページへ あなたのサイトは 何 点 ですか? 約 20 分 でチェックできます ぜひトライしてみてください! 2

4 1.ごあいさつ 活 動 内 容 ごあいさつ 障 害 を 持 つ 当 事 者 がつくる 日 本 ウェブアクセシビリティ 普 及 ネットワーク は 主 に 障 害 を 持 つ 当 事 者 とサポートする 健 常 者 で 構 成 され それぞれが 能 力 を 活 かし 可 能 な 範 囲 でウェブアクセシ ビリティの 普 及 活 動 を 行 うネットワークです 2013 年 現 在 障 害 を 持 つ 私 たちにとって ウェブは 欠 かせないものです ですが まだまだ 配 慮 されていないウェブサイトが 多 くあるのが 現 状 です 日 本 ウェブアクセシビリティ 普 及 ネットワークの 草 の 根 活 動 が いずれ 日 本 の 情 報 バリアフリーの 向 上 へとつながり それにより 障 害 を 持 つ 人 がストレス なく 情 報 を 享 受 できる 世 界 になってほしいと 心 から 願 っています 日 本 ウェブアクセシビリティ 普 及 ネットワーク 代 表 板 垣 宏 明 活 動 内 容 情 報 バリアフリーポータルサイトの 運 営 jis8341.net 事 業 者 ( 企 業 自 治 体 )に 障 害 を 持 つ 人 のニーズを 伝 え 障 害 を 持 つ 人 に 事 業 者 による 情 報 バリア フリーサービスを 紹 介 し そして 互 いをつなぐことを 目 的 としたポータルサイトです 情 報 バリア フリー 化 の 為 の 様 々なデータやプログラムも 多 く 公 開 していますので ぜひご 活 用 ください セミナーや 研 修 の 実 施 専 門 家 障 害 を 持 つ 当 事 者 による 無 料 セミナーや 有 料 研 修 を 実 施 します < 講 師 > 日 本 ウェブアクセシビリティ 普 及 ネットワーク 代 表 板 垣 宏 明 <セミナー 講 師 協 力 > 株 式 会 社 インフォアクシア 代 表 取 締 役 植 木 真 様 < 職 員 社 員 研 修 講 師 協 力 > Cocktailz(カクテルズ) 代 表 伊 敷 政 英 様 所 属 :( 株 ) 富 士 通 システムズ ウエスト 常 駐 先 : 名 古 屋 盲 人 情 報 文 化 センター 星 野 史 充 様 株 式 会 社 ミライロ 代 表 取 締 役 社 長 垣 内 俊 哉 様 セミナーや 研 修 のお 問 合 せ お 申 込 みはお 電 話 またはメールでご 連 絡 ください お 電 話 : ( 平 日 9 時 30 分 から 17 時 30 分 )/mail:info@jis8341.net 板 垣 北 山 宛 3

5 2.ウェブアクセシビリティとは? ウェブアクセシビリティとは? ウェブアクセシビリティとは 身 体 の 機 能 や 年 齢 閲 覧 環 境 の 違 いなどに 関 係 なく ウェブで 提 供 されている 情 報 やサービスを 利 用 できることです JIS X :2010 とは? 2004 年 6 月 に JIS X ( 高 齢 者 障 害 者 等 配 慮 設 計 指 針 - 情 報 通 信 における 機 器 ソフトウ ェア 及 びサービス- 第 三 部 :ウェブコンテンツ)が 施 行 されました JIS X 8341 という 番 号 は 8341=やさしい という 意 味 でつけられました 2010 年 にその JIS X が 改 正 されました 国 際 的 基 準 である WCAG 2.0(Web Content Accessibility Guidelines 2.0)を 原 案 として 国 際 協 調 を 目 指 した JIS 規 格 ができました それが JIS X :2010 です みんなの 公 共 サイト 運 用 モデル とは? 2010 年 の JIS X の 改 正 を 受 け みんなの 公 共 サイト 運 用 モデル 改 定 版 (2010 年 度 )が 2011 年 春 に 総 務 省 から 公 開 されました PDCA サイクルに 沿 ってアクセシビリティを 改 善 する 手 順 とスケジュールが 掲 載 されています PDCA サイクル P(Plan) ホームページの 現 状 確 認 と 目 標 設 定 D(Do) 目 標 を 達 成 するための 取 組 み C(Check)JIS X :2010 に 基 づく 試 験 A(Action) 継 続 的 な 検 証 と 改 善 の 取 組 み スケジュール( 目 安 :すでに 提 供 しているホームページ 等 ) 2012 年 度 末 まで ウェブアクセシビリティ 方 針 策 定 公 開 2013 年 度 末 まで JIS X :2010 の 等 級 A に 準 拠 ( 試 験 結 果 の 公 開 ) 2014 年 度 末 まで JIS X :2010 の 等 級 AA に 準 拠 ( 試 験 結 果 の 公 開 ) 4

6 達 成 基 準 について JIS X :2010 では 目 標 とするアクセシビリティ 達 成 等 級 の 達 成 基 準 を 満 たしていれば JIS X :2010 等 級 〇 〇 準 拠 と 表 示 することができます 達 成 等 級 は 等 級 A 等 級 AA 等 級 AAA の 3 段 階 あります みんなの 公 共 サイト 運 用 モデルでは 公 共 サイトに 対 して 等 級 AA までの 対 応 を 求 めています 等 級 AAA の 対 応 は 難 しすぎるため 対 応 は 求 められていません 以 下 は 達 成 基 準 のリストです 等 級 A 細 分 箇 条 題 名 非 テキストコンテンツに 関 する 達 成 基 準 収 録 済 みの 音 声 しか 含 まないメディア 及 び 収 録 済 みの 映 像 しか 含 まないメディアに 関 する 達 成 基 準 収 録 済 み 音 声 コンテンツのキャプションに 関 する 達 成 基 準 収 録 済 みの 映 像 コンテンツの 代 替 コンテンツ 又 は 音 声 ガイドに 関 する 達 成 基 準 情 報 及 び 関 係 性 に 関 する 達 成 基 準 意 味 のある 順 序 に 関 する 達 成 基 準 感 覚 的 な 特 徴 に 関 する 達 成 基 準 色 の 使 用 に 関 する 達 成 基 準 音 声 制 御 に 関 する 達 成 基 準 キーボード 操 作 に 関 する 達 成 基 準 フォーカス 移 動 に 関 する 達 成 基 準 調 整 可 能 な 制 限 時 間 に 関 する 達 成 基 準 一 時 停 止 停 止 及 び 非 表 示 に 関 する 達 成 基 準 回 のせん( 閃 ) 光 又 はいき( 閾 ) 値 以 下 に 関 する 達 成 基 準 ブロックスキップに 関 する 達 成 基 準 ページタイトルに 関 する 達 成 基 準 フォーカス 順 序 に 関 する 達 成 基 準 文 脈 におけるリンクの 目 的 に 関 する 達 成 基 準 ページの 言 語 に 関 する 達 成 基 準 オンフォーカスに 関 する 達 成 基 準 ユーザーインタフェースコンポーネントによる 状 況 の 変 化 に 関 する 達 成 基 準 入 力 エラー 箇 所 の 特 定 に 関 する 達 成 基 準 ラベル 又 は 説 明 文 に 関 する 達 成 基 準 構 文 解 析 に 関 する 達 成 基 準 プログラムが 解 釈 可 能 な 識 別 名 役 割 及 び 設 定 可 能 な 値 に 関 する 達 成 基 準 5

7 等 級 AA 細 分 箇 題 名 条 ライブの 音 声 コンテンツのキャプションに 関 する 達 成 基 準 収 録 済 みの 映 像 コンテンツの 音 声 ガイドに 関 する 達 成 基 準 最 低 限 のコントラストに 関 する 達 成 基 準 テキストのサイズ 変 更 に 関 する 達 成 基 準 画 像 化 された 文 字 に 関 する 達 成 基 準 複 数 の 到 達 手 段 に 関 する 達 成 基 準 見 出 し 及 びラベルに 関 する 達 成 基 準 視 覚 的 に 認 識 可 能 なフォーカスに 関 する 達 成 基 準 部 分 的 に 用 いられている 言 語 に 関 する 達 成 基 準 一 貫 したナビゲーションに 関 する 達 成 基 準 一 貫 した 識 別 性 に 関 する 達 成 基 準 入 力 エラー 修 正 方 法 の 提 示 に 関 する 達 成 基 準 法 的 義 務 金 銭 的 取 引 データ 変 更 及 び 回 答 送 信 のエラー 回 避 に 関 する 達 成 基 準 等 級 AAA 細 分 箇 条 題 名 収 録 済 みの 音 声 コンテンツの 手 話 通 訳 に 関 する 達 成 基 準 収 録 済 みの 映 像 コンテンツの 拡 張 した 音 声 ガイドに 関 する 達 成 基 準 収 録 済 みのメディアの 代 替 コンテンツに 関 する 達 成 基 準 ライブの 音 声 しか 含 まないコンテンツの 代 替 コンテンツに 関 する 達 成 基 準 より 十 分 なコントラストに 関 する 達 成 基 準 小 さい 背 景 音 又 は 背 景 音 なしに 関 する 達 成 基 準 視 覚 的 な 表 現 に 関 する 達 成 基 準 画 像 化 された 文 字 に 関 する 例 外 のない 達 成 基 準 キーボード 操 作 に 関 する 例 外 のない 達 成 基 準 制 限 時 間 なしに 関 する 達 成 基 準 中 断 に 関 する 達 成 基 準 再 認 証 に 関 する 達 成 基 準 回 のせん( 閃 ) 光 に 関 する 達 成 基 準 現 在 位 置 に 関 する 達 成 基 準 リンクの 目 的 に 関 する 達 成 基 準 セクション 見 出 しに 関 する 達 成 基 準 一 般 的 ではない 用 語 に 関 する 達 成 基 準 略 語 に 関 する 達 成 基 準 読 解 レベルに 関 する 達 成 基 準 発 音 及 び 読 み 仮 名 に 関 する 達 成 基 準 利 用 者 の 要 求 による 状 況 の 変 化 に 関 する 達 成 基 準 ヘルプに 関 する 達 成 基 準 エラー 回 避 に 関 する 例 外 のない 達 成 基 準 6

8 3.ウェブアクセシビリティが 必 要 な 人 たくさんの 人 々がウェブアクセシビリティを 必 要 としています 障 害 を 持 つ 人 日 本 における 身 体 障 害 者 は 推 計 348 万 3 千 人 ( 平 成 18 年 ) 表 1: 障 害 種 別 ごとの 身 体 障 害 者 数 障 害 種 別 人 数 視 覚 障 害 310,000 人 聴 覚 言 語 障 害 343,000 人 肢 体 不 自 由 1,760,000 人 内 部 障 害 1,070,000 人 合 計 3,483,000 人 出 典 : 平 成 18 年 身 体 障 害 児 者 実 態 調 査 結 果 ( 厚 生 労 働 省 ) URL: 上 記 では 視 覚 障 害 は 31 万 人 ですが 日 本 眼 科 医 会 からは 日 本 における 視 覚 障 害 者 数 は 約 164 万 人 と 公 表 されています(URL: 高 齢 の 人 白 内 障 緑 内 障 など 高 齢 になると 目 の 病 気 が 多 くなります また 脳 梗 塞 など 様 々な 病 気 が 原 因 で 肢 体 不 自 由 な 人 が 多 くなります 平 成 23 年 高 齢 者 人 口 は 2980 万 人 ( 総 人 口 の 23.3%)で 過 去 最 高 高 齢 者 人 口 は 2980 万 人 ( 総 人 口 の 23.3%)で 過 去 最 高 総 人 口 12,788 万 人 65 歳 以 上 2,980 万 人 出 典 : 総 務 省 統 計 局 制 作 統 括 官 ( 統 計 基 準 担 当 ) 統 計 研 修 所 URL: 7

9 障 害 を 持 つ 人 にウェブが 役 立 つこと ウェブはいろいろな 場 面 で 障 害 を 持 つ 人 々に 役 立 っています 以 下 は ほんの 一 例 です 自 分 で 文 字 を 読 める( 聞 ける)ようになった ウェブの 出 現 前 全 盲 の 障 害 を 持 つ 人 が 情 報 を 取 得 する 場 合 朗 読 または 点 字 に してもらうなど 人 の 手 を 借 りるしか 方 法 がありませんでした ウェブの 出 現 後 スクリーンリーダーなどでウェブの 文 字 情 報 を 読 上 げることが きるようになり 自 分 自 身 で 情 報 を 取 得 できるようになりました 外 出 の 不 安 がなくなった ウェブの 出 現 前 車 いすを 利 用 している 人 が 慣 れない 場 所 に 外 出 する 場 合 行 っ てみて 段 差 があった 障 害 者 用 トイレが 無 かった などという ことが 頻 繁 にあり 外 出 に 不 安 がありました ウェブの 出 現 後 外 出 前 に スロープ エレベーター 障 害 者 用 トイレの 有 無 や 目 的 地 までの 道 順 について 最 新 の 情 報 を 取 得 できるようになり 安 心 して 外 出 できるようになりました 障 害 を 持 つ 人 にとって ウェブは 生 活 に 欠 かせないツールです それにもかかわらず ウェブアクセシビリティに 対 応 できていないウェブサイトが 多 くあります だれもがいずれ 高 齢 者 となります 障 害 を 持 つ 日 が 来 るかもしれません 1 人 1 人 がウェブアクセシビリティに 対 して 関 心 を 持 ち 自 分 に 身 近 なこと と 考 えて 対 応 する そのとりくみの 輪 が 広 がれば だれもがストレスなく 情 報 を 享 受 できる 豊 かな 社 会 になります 8

10 4.アクセシビリティ 理 解 のポイント アクセシビリティは 必 要 な 理 由 を 理 解 すれば それほど 難 しくありません JIS X :2010 って 誰 にどんな 風 に 役 立 つの? JIS X :2010 のポイントをピックアップしてご 紹 介 します 肢 体 に 障 害 を 持 つ 人 のために 肢 体 不 自 由 の 人 が 困 ることは? マウス 操 作 ができない しにくい マウス 操 作 が 難 しい 人 は マウスの 設 定 を 変 更 したり 特 殊 なマウスを 使 用 したりしています マウス 操 作 ができない 人 は キーボードまたは 自 分 の 身 体 の 状 態 ( 口 や 足 なら 操 作 できるなど 障 害 の 状 態 )に 合 ったさま ざまな 機 器 で 操 作 をしています 左 写 真 はトラックボール このことから 肢 体 不 自 由 な 人 は 主 に 以 下 で 困 っているケースが 多 いです スクロール マウスオーバー 小 さい 選 択 範 囲 のクリック その 他 肢 体 不 自 由 な 人 のためにできる 対 応 は? 肢 体 不 自 由 な 人 に 役 立 つ 対 応 として JIS X :2010 にある 項 目 から 2つご 紹 介 します label 要 素 を 用 いて テキストのラベルとフォーム コントロールを 関 連 付 ける 手 の 不 自 由 な 人 がマウス 操 作 で ラジオボタンの 小 さな 範 囲 を 選 択 するの は とても 困 難 です テキストをクリックしても ラジオボタンを 選 択 できる 例 ラジオボタンの 横 のテキストを 押 しても 選 択 することができれば 選 択 範 囲 が 広 がり 選 択 時 の 負 担 が 軽 減 します ユーザーがコンテンツ 内 に 閉 じ 込 められないようにする マウスを 使 えない 手 の 不 自 由 な 人 がキーボード 操 作 をしている 時 FLASH や 動 画 などのコンテンツに 閉 じ 込 められて キーボードだけでは 前 にも 後 ろにも 進 めなくなることがあります サイト 公 開 前 に ご 担 当 者 自 身 がキーボードで Tab キーを 押 して 進 むなど 操 作 してみて そのようなことが 無 いかをご 確 認 ください 9

11 目 が 見 えない 人 のために 目 が 見 えない 人 が 困 ることは? マウス 操 作 ができない 音 声 での 読 み 上 げ(や 点 字 など)が 頼 り 全 盲 の 人 はマウス 操 作 ができません 多 くの 人 がキーボードを 操 作 しながら スクリーンリーダーを 利 用 し 音 声 で 読 み 上 げ ています( 点 字 出 力 を 使 用 している 人 もいます) 左 写 真 は 点 字 ピンディスプレイ このことから 目 の 見 えない 人 は 主 に 以 下 で 困 っているケースが 多 いです あるはずの 文 字 を 読 上 げず 内 容 が 分 からない 読 上 げが 滅 茶 苦 茶 ( 正 しい 日 本 語 になっていない 文 章 の 順 番 が 違 う など) ページ 移 動 ごとに 同 じナビゲーションを 何 度 も 聞 かなければならない その 他 目 が 見 えない 人 のためにできる 対 応 は? 目 が 見 えない 人 に 役 立 つ 対 応 として JIS X :2010 にある 項 目 から 2つご 紹 介 します 画 像 に 適 切 な 代 替 テキストをつける 特 に 文 字 を 画 像 化 している 場 合 代 替 テキストは 必 須 です 代 替 テキス トがなければ スクリーンリーダーは 画 像 化 された 文 字 を 文 字 として 読 同 じフォントが 無 い 閲 覧 環 境 でも 同 様 の 表 示 となるように 特 殊 なフォントを 画 像 化 した 例 み 上 げません 例 えば 事 例 のように 重 要 です! という 画 像 化 された 文 字 があり 代 替 テキストでも 重 要 です! と 記 述 していれば スクリーンリーダーは 重 要 です! と 読 み 上 げます 何 も 記 述 されていなければ 何 も 読 み 上 げず 目 の 見 えない 人 に 情 報 が 伝 わりません 事 例 は 画 像 化 された 文 字 ですが 文 字 以 外 に 写 真 などでも ユーザーに 伝 えるべき 画 像 には 代 替 テキストを 記 述 してください 単 語 の 間 に 空 白 を 入 れない 見 た 目 の 美 しさのために 単 語 の 間 に 余 白 を 入 れているケースがあります 例 えば 事 例 のように 神 戸 市 と 余 白 を 入 れた 場 合 スクリーンリー ダーでは カミ ト シ と 読 上 げます 余 白 を 無 くし 神 戸 市 にすると コウベシ と 正 しく 読 み 上 げます (スペースでなく CSS で 文 字 間 を 調 整 するのは 問 題 ありません) 10

12 ロービジョンの 人 のために ロービジョンの 人 が 困 ることは? マウス 操 作 が 難 しい 拡 大 しているため ページ 全 体 の 把 握 が 難 しい ロービジョンの 人 の 多 くがキーボード 操 作 しながら スクリーン リーダーを 利 用 し 音 声 で 読 上 げています また 白 い 背 景 が まぶしい 場 合 は 背 景 を 黒 くし さらに 文 字 を 白 や 黄 色 にして 拡 大 するなど それぞれ 異 なる 見 え 方 に 合 せて 設 定 しています 左 写 真 はハイコントラスト 画 面 とスクリーンリーダーを 利 用 している 様 子 このことからロービジョンの 人 は 主 に 以 下 で 困 っているケースが 多 いです ページ 移 動 ごとに 同 じナビゲーションを 何 度 も 聞 かなければならない 文 章 を 読 んでいたのに ポップアップやプルダウンで 表 示 が 隠 れてしまった 自 分 が 見 やすい 設 定 に 変 えたのに 文 字 の 色 や 大 きさが 変 わらない その 他 ロービジョンの 人 のためにできる 対 応 は? ロービジョンの 人 に 役 立 つ 対 応 として JIS X :2010 にある 項 目 から 2つご 紹 介 します h1 要 素 ~h6 要 素 を 用 いて 見 出 しを 特 定 する スクリーンリーダーで 閲 覧 している 人 は ウェブサイト 内 でのページ 移 動 ごとに 同 じナビゲーションを 何 度 も 聞 かなければなりません 本 文 に 見 出 しが 設 定 されていれば ナビゲーションを 聞 かずに 各 見 出 しにジ ャンプする 操 作 も 可 能 です 文 章 のセクションごとに 見 出 しを 設 定 してください 状 況 の 変 化 を 生 じるトリガーには "focus" ではなく "activate" を 用 いる 下 の 図 は マウスオーバーするとポップアップが 表 示 されるウェブページの 例 です 通 常 の 画 面 拡 大 したハイコ ントラスト 画 面 ロービジョンの 人 は 文 字 を 拡 大 していることが 多 いので 見 えている 範 囲 外 で リンクが 選 択 された(focus された) 為 にポップアップが 開 いた ことが 分 かりづらく 突 然 文 字 が 隠 れた と 戸 惑 います 選 択 (focus)したらアクションが 起 るのではなく ユーザーが 意 識 的 にクリックまたはエンターをして 確 定 (activate)したら 状 況 が 変 化 するようにしてください 11

13 色 が 分 からない 分 かりにくい 人 のために 色 が 分 からない 分 かりにくい 人 が 困 ることは? 特 定 の 色 が 分 からない 分 かりにくい 色 覚 異 常 の 人 は 男 性 の 場 合 20 人 に1 人 女 性 の 場 合 600 人 に 1 人 といわれ 赤 色 と 緑 色 ピンクと 白 緑 色 と 茶 色 など 間 違 えやすい 色 は 人 それぞれです 特 に 問 題 なく 通 常 の 設 定 で ブラウザを 利 用 している 人 と 見 やすい 設 定 に 変 更 して 利 用 し ている 人 がいます 左 写 真 は 通 常 の 見 え 方 と 一 色 型 色 覚 の 見 え 方 このことから 色 が 分 からない 分 かりにくい 人 は 主 に 以 下 で 困 っているケースが 多 いです 自 分 が 見 やすい 設 定 に 変 えたのに 文 字 の 色 や 大 きさが 変 わらない 色 が 分 からないと 内 容 が 分 からないページになっている その 他 色 が 分 からない 分 かりにくい 人 のためにできる 対 応 は? 色 が 分 からない 分 かりにくい 人 に 役 立 つ 対 応 として JIS X :2010 にある 項 目 から 2 つご 紹 介 します 情 報 と 構 造 を 表 現 から 分 離 して 異 なる 表 現 を 可 能 にする 色 の 指 定 を 情 報 (HTML)に 記 述 してしまっては ユーザーが 自 分 の 見 える 色 に 文 字 色 や 背 景 色 を 変 更 できない 場 合 があります font color や bg color は 情 報 (HTML)に 記 述 するのでなく 構 造 (CSS)に 記 述 して 分 離 できるようにしてください 色 の 違 いで 伝 えている 情 報 をテキストでも 入 手 可 能 にする 以 下 は 必 須 項 目 か 必 須 項 目 でないかの 違 いを 色 の 違 いのみで 伝 えている 例 と テキストでも 伝 えている 例 です 色 の 違 いで 伝 えている 情 報 は テキストでも 入 手 可 能 にしてください 赤 字 は 必 須 項 目 です お 名 前 項 目 が 沢 山 ある 場 合 の 事 例 です 赤 色 が 分 からない 人 には 必 須 項 目 が 分 かりません 項 目 が 沢 山 ある 場 合 の 事 例 です 赤 色 が 分 から ない 人 にも 必 須 項 目 がどれかが 伝 わります 12

14 音 が 聞 こえない 聞 こえにくい 人 のために 音 が 聞 こえない 聞 こえにくい 人 のためにできる 対 応 は? 音 が 聞 こえない 聞 こえにくい 人 に 役 立 つ 対 応 として JIS X :2010 にある 項 目 から 2 つご 紹 介 します 利 用 者 の 要 求 に 応 じてのみ 音 声 を 再 生 する 音 が 聞 こえない 聞 こえにくい 人 は 音 声 が 自 動 再 生 されていて 周 りの 人 に 迷 惑 をかけていても それに 気 づくことができません 音 声 は 利 用 者 の 要 求 に 応 じてのみ 再 生 してください もし 音 声 の 自 動 再 生 が 必 要 な 場 合 は 3 秒 以 内 に 自 動 停 止 してください キャプション( 字 幕 )を 提 供 する 音 が 聞 こえない 聞 こえにくい 人 は 動 画 などの 音 声 を 聞 くことができ ません 字 幕 にする または 書 き 起 こしテキストを 用 意 するなどして 音 声 以 外 の 手 段 で 同 様 の 情 報 を 提 供 してください すべての 人 のために すべての 人 に 役 立 つ 対 応 として JIS X :2010 にある 項 目 から 1つご 紹 介 します どの 1 秒 間 においても コンテンツに 3 回 よりも 多 く 閃 光 を 放 つコンポーネント がないことを 確 認 する 1997 年 にテレビアニメ ポケットモンスター の 視 聴 者 が 閃 光 に よる 光 過 敏 性 発 作 などを 起 こした 事 件 がありました 閃 光 は (1 秒 間 に 3 回 よりも 多 く 大 きく 明 るい 場 合 には) 光 過 敏 性 発 作 を 引 き 起 こす 恐 れがあります 1 秒 間 に 3 回 よりも 多 く 閃 光 を 放 つコンテンツを 作 成 しないようにして ください また 閃 光 を 放 つコンテンツを 作 成 しなければならない 場 合 は 閃 光 を 放 つエリアを 十 分 に 小 さくしたり 光 を 弱 くするなどの 配 慮 をしてくだ さい 13

15 異 なる 閲 覧 環 境 で 見 る 人 のために ウェブアクセシビリティは 様 々な 閲 覧 環 境 に 対 応 します ウェブアクセシビリティの 項 目 には 正 しくマークアップする や 文 字 情 報 だけでページの 内 容 が 理 解 できるようにする という 趣 旨 の 項 目 が 多 く 含 まれています これは 障 害 を 持 つ 利 用 者 の 様 々な 環 境 に 合 わせて 情 報 の 出 力 方 法 を 変 更 できるように という 配 慮 です 障 害 を 持 つ 人 にだけ 様 々な 閲 覧 環 境 があるのでしょうか? 障 害 を 持 つ 人 だけ 様 々な 閲 覧 環 境 があるわけではありません 現 在 では PC 携 帯 電 話 スマー トフォン タブレットなど 様 々な 機 器 OS ブラウザで 様 々な 人 が 閲 覧 します これからも 閲 覧 環 境 は 増 え 続 けます テレビ メガネ その 他 想 像 もつかない 環 境 で 情 報 を 閲 覧 することになるでしょう そんな 中 でウェブ 担 当 者 は 増 え 続 ける 各 閲 覧 環 境 に 合 わせて それぞ れにウェブページを 再 構 築 しつづけなければならないのでしょうか? そんなことはありません PC 携 帯 電 話 スマートフォン タブレット テレビ メガネ 様 々な 環 境 に 情 報 を 提 供 するための 共 通 言 語 が HTML になるといわれ すでに 研 究 も 進 んでいます 異 なる 閲 覧 環 境 に1つの HTML で 情 報 を 提 供 する これは まさにウェブアクセシビリティと 同 じ 考 え 方 です つまり ウェブアクセシビリティに 対 応 すれば 様 々な 閲 覧 環 境 に 対 応 できる HTML となります 増 え 続 ける 閲 覧 環 境 に 合 わせて それぞれにウェブページを 再 構 築 しなくても ウェブアクセシビ リティに 対 応 した HTML の 出 力 方 法 を 変 更 するだけで 各 閲 覧 環 境 に 対 応 できるウェブサイトにな り 非 常 に 効 率 的 なのです 14

16 アクセシビリティが 大 事 なことは 分 かったけど 5. 何 からはじめたらいいの? 仕 様 書 に ウェブアクセシビリティ 対 応 と 記 載 してあるにもかかわらず 公 開 されたサイトがウ ェブアクセシビリティに 対 応 しておらず ご 担 当 者 も 気 づいていないケースをよく 見 かけます Twitter facebook ご 担 当 者 の 多 くは セキュリティ 対 策 スマートフォン 対 応 防 災 コンテ ンツ 作 成 SNS の 発 信 など 課 題 が 山 積 していて アクセシビリティを 勉 強 してサイトを 確 認 する 時 間 を 作 るのが 難 しいのではないでしょうか そこで 忙 しいご 担 当 者 のために 約 20 分 でできるウェブアクセシビ リティ 簡 易 チェックリスト( 等 級 A)をご 用 意 しました ぜひご 担 当 されているウェブサイトのアクセシビリティをチェックしてください 1.まず ご 自 分 の 担 当 するサイトをご 確 認 ください ケース1. HTML や CSS などの 専 門 知 識 がない 方 へ 専 門 知 識 がなくても 約 20 分 でできる JIS X :2010 簡 易 チェックリスト 等 級 A をご 用 意 いたしました ダウンロードしてご 利 用 ください ケース2. HTML や CSS などの 専 門 知 識 がある 方 へ 専 門 的 に 確 認 する 為 の JIS X 834-3:2010 実 装 チェックリスト 等 級 A~ 等 級 AA の excel ファイルをご 用 意 いたしました ダウンロードしてご 利 用 ください ケース1とケース2のどちらか 当 てはまる 方 の 資 料 をダウンロードしてください 2.ウェブアクセシビリティ 方 針 作 成 ( 改 善 計 画 方 針 ) 3.ウェブアクセシビリティ 方 針 公 開 実 行 4. 試 験 実 施 試 験 結 果 公 開 アクセシビリティ 向 上 のため 日 々 継 続 的 なとりくみ の 手 順 について 本 冊 子 では 詳 細 を 掲 載 していませんが 情 報 バリアフリーポータル サイト URL: に それぞれの 手 順 に 必 要 な 資 料 をご 用 意 しております 15

17 6. 実 際 に 簡 易 チェックしてみましょう 簡 易 チェックシート( 等 級 A)の 使 い 方 簡 易 チェックシート( 等 級 A)は 技 術 的 な 言 葉 を 平 易 にし 専 門 知 識 が 無 ければ 判 断 できない 項 目 を 削 除 して JIS X :2010 等 級 A の 項 目 の 約 70%を 取 り 入 れています チェックツールもご 用 意 しておりますので ぜひチャレンジしてみてください 20 分 でできる 簡 易 チェックシート 等 級 A をご 用 意 ください JIS X :2010 簡 易 チェックリスト 等 級 A をダウンロードして ご 用 意 ください 検 証 用 画 面 の 表 示 方 法 1. 検 証 したいウェブページを 表 示 します (サンプル 検 証 したいウェブページの URL を 入 力 して Check ボタンをクリックします 16

18 3. 検 証 用 画 面 が 表 示 されます 17

19 非 テキストコンテンツの 代 替 テキスト 検 証 用 画 面 では 画 像 とその 代 替 テキストが 表 示 されます < 代 替 テキスト>< 代 替 テキスト 終 わり>の 間 の 文 字 が 画 像 に 対 する 代 替 テキストです 目 の 見 えない 人 は 写 真 や FLASH を 見 ることができません 写 真 や FLASH が 無 くてもウェブページの 意 味 が 分 かりますか? < 画 像 > 1. 代 替 テキストが 表 示 されていない 画 像 は 伝 える 意 味 のないものですか? 例 ) 以 下 のような 画 像 が 代 替 テキス トを 伝 える 意 味 のない 画 像 です 子 育 て 支 援 (テキスト 例 ) 識 字 障 害 の 人 に 役 立 つ テキストに 対 するイメージ 画 像 ( 上 の 図 は 子 育 て 支 援 のイメージ 画 像 ) 2. 意 味 を 持 つ 画 像 は 表 示 された 代 替 テ キストで 内 容 が 伝 わりますか? 例 ) 意 味 を 持 つ 画 像 例 <FLASH> 1. 代 替 テキストが 表 示 されていない FLASH は 伝 える 意 味 のないものですか? 例 ) 伝 える 意 味 のない FLASH 例 ゆるキャラをウェブページのあらゆるところに 配 置 し 少 し 動 か しているような ページの 文 章 と 関 連 のない FLASH など 2. 意 味 を 持 つ FLASH は 表 示 された 代 替 テキストで 内 容 が 伝 わりますか? 例 ) 意 味 を 持 つ FLASH 例 文 章 などの 伝 えるべき 意 味 を 持 つコンテンツ が FLASH にな っている 時 代 替 テキストがありますか? 左 の 事 例 の 代 替 テキストは 顧 客 満 足 度 1 位 であれば OK 18

20 <ライブ 音 声 映 像 > 1. ライブ 音 声 ライブ 映 像 について 何 が 再 生 されているのか 分 かる 簡 単 な 説 明 があります か? 例 )ライブ 音 声 の 代 替 テキスト 例 アクセシビリティセミナー 音 声 生 放 送 (2013 年 4 月 1 日 午 後 1 時 ~ 午 後 3 時 ) 例 )ライブ 映 像 の 代 替 テキスト 例 兵 庫 県 神 戸 市 中 央 区 港 島 大 通 りの 現 在 の 道 路 状 況 を 生 放 映 中 <CAPTCHA> 1. 画 像 が CAPTCHA であると 分 かるような 代 替 テキストがありますか? 例 ) 画 像 が CAPTCHA であると 分 かるような 代 替 テキスト 例 代 替 テキストは スパムでないことを 確 認 します 画 像 に 表 示 された 文 字 を 入 力 してください などであれば OK 2. 目 の 見 えない 人 の 為 に CAPTCHA の 代 わりになる 機 能 がありますか? 例 ) 雑 音 の 入 った 音 声 を 耳 で 聞 いて 入 力 するキャプチャー 例 代 替 テキストは スパムでないことを 確 認 します 音 声 で 聞 こえる 文 字 を 入 力 してください などであれば OK < 絵 文 字 > 1. 絵 文 字 やアスキーアートやリート 語 などを 使 用 している 箇 所 はありますか? 絵 文 字 やアスキーアートやリート 語 は 本 来 の 使 用 用 途 とは 違 う 使 われ 方 をしているので スクリーンリーダーなどで 正 確 に 読 上 げません 例 )アスキーアート 例 例 ) 絵 文 字 例 I you. 19

21 収 録 済 みの 音 声 しか 含 まないメディア 及 び 収 録 済 みの 映 像 しか 含 まないメディア < 音 声 のみ> 1. 人 が 話 している 音 声 ファイル 等 の 場 合 書 き 起 こしテキストがありますか? 例 ) 総 会 の 音 声 例 NPO 法 人 アイ コラボレーション 神 戸 総 会 (2013 年 6 月 13 日 午 後 1 時 ~ 午 前 1 時 30 分 ) 2013 年 総 会 書 き 起 こしテキスト 以 下 書 き 起 こしテキスト 例 この 文 書 は 2013 年 6 月 13 日 に NPO 法 人 アイ コラボレーション 神 戸 の 事 務 所 で 行 われた 総 会 の 内 容 をテキストに 書 き 起 こしたものです 司 会 : 本 日 の 司 会 を 努 めさせていただきます NPO 法 人 アイ コラボレーション 神 戸 の 北 山 と 申 します 本 日 はよろしくお 願 いいたします 一 同 :( 拍 手 ) 司 会 :まずは 本 日 の 予 定 をご 案 内 いたします 2. 音 楽 ファイル 等 の 場 合 歌 詞 又 は 作 曲 者 や 曲 名 を 説 明 する 文 章 がありますか? 例 ) 作 曲 者 や 曲 名 を 説 明 する 文 章 例 曲 名 :アイ コラボレーション 協 奏 曲 第 1 楽 章 作 曲 者 : 板 垣 宏 明 < 映 像 のみ> 1. 見 えない 人 にも 映 像 が 分 かるような 書 き 起 こしテキスト または 映 像 が 分 かるような 音 声 ファイルがありますか? 例 ) 映 像 が 分 かるような 書 き 起 こしテキスト 例 書 き 起 こしテキスト <ホワイトソースづくり 手 順 書 > 1. 鍋 にバターを 入 れ 火 にかけます バターが 溶 けたら 薄 力 粉 を 入 れて 木 ベラでよく 混 ぜます 2. 粉 っぽい 感 じが 無 くなったら 火 から 下 ろし 少 し 冷 ましてから 温 めた 牛 乳 を4~5 回 に 分 けて 入 れま す 3. 牛 乳 を 全 部 入 れたら 一 度 煮 立 せて 塩 コショウで 味 を 調 えて 完 成 です 20

22 収 録 済 み 音 声 コンテンツのキャプション < 動 画 の 中 の 音 声 > 1. 聞 こえない 人 にも 動 画 の 中 の 音 声 が 分 かるような 字 幕 又 は 書 き 起 こしテキストがありま すか? 例 ) 動 画 の 中 の 音 声 が 分 かるような 字 幕 例 収 録 済 みの 映 像 コンテンツの 代 替 コンテンツ 又 は 音 声 ガ イド < 動 画 の 中 の 音 声 > 1. 見 えない 人 にも 動 画 の 中 の 映 像 が 分 かるような 書 き 起 こしテキストがありますか? テキスト 化 されていれば スクリーンリーダーなどを 用 いて 音 声 で 聞 くことができます 例 ) 動 画 の 中 の 映 像 が 分 かるような 書 き 起 こしテキストが 設 置 されている 例 総 会 書 き 起 こしテキスト 2. 見 えない 人 にも 動 画 の 中 の 映 像 が 分 かるような 音 声 ガイドがありますか? 例 ) 動 画 の 中 の 映 像 が 分 かるような 音 声 ガイドが 設 置 されている 例 総 会 音 声 ガイド 付 バージョン 21

23 情 報 及 び 関 係 性 検 証 したいウェブページの URL を 入 力 して Check ボタンをクリックします < 文 字 > 1. 色 がついている 字 はありませんか? 表 示 された 検 証 用 画 面 の 中 に< 言 語 ><タイトル>< 見 出 し><リスト>< 表 題 >< 表 概 要 >リンク 以 外 で 色 のついている 文 字 はありませんか? 例 ) 色 がついている 文 字 の 例 お 名 前 ( 必 須 ) 1,980 円 防 災 マップ など 画 像 文 字 はこの 設 問 の 対 象 になりません 画 像 文 字 かどうかの 判 断 は マウスカーソルで 文 字 をドラッグすると 分 かります 通 常 の 文 字 の 場 合 ドラッグすると 文 字 が 反 転 します 画 像 文 字 は 反 転 しません 通 常 の 文 字 画 像 文 字 < 表 (データテーブル)> 1. 表 の 前 に< 表 題 >または< 表 概 要 >がありますか? 例 )< 表 題 >と< 表 概 要 > < 表 題 > 障 害 種 別 ごとの 身 体 障 害 者 数 < 表 題 終 わり> < 表 概 要 >2 列 6 行 の 表 です 表 の1 列 目 が 障 害 種 別 2 列 目 が 人 数 です 4つの 障 害 種 別 について 各 人 数 を 記 載 しており 最 後 の6 行 目 が4 障 害 の 人 数 の 合 計 です < 表 概 要 終 わり> 障 害 種 別 d 視 覚 障 害 聴 覚 言 語 障 害 肢 体 不 自 由 内 部 障 害 合 計 人 数 310,000 人 343,000 人 1,760,000 人 1,070,000 人 3,483,000 人 表 題 と 表 概 要 はどちらもある 方 が 望 ましいですが どちらか 一 方 でも OK です 写 真 や 文 字 の 配 置 (レイアウト)の 為 に 表 を 使 っている 場 合 は 表 題 や 表 概 要 は 不 要 です 22

24 2. 結 合 されたセルはありませんか? この 項 目 は JIS X :2010 適 合 試 験 の 項 目 とは 違 います 日 本 の 多 くの 音 声 読 み 上 げソフトの 現 状 に 対 応 した 内 容 となっています 例 ) 結 合 されたセル 3. 最 初 の 行 を 左 から 右 に 読 み 次 の 行 をまた 左 から 右 に 読 んで 読 み 進 めてください 意 味 が 分 かりますか? この 項 目 は JIS X :2010 適 合 試 験 の 項 目 とは 違 います 日 本 の 多 くの 音 声 読 み 上 げソフトの 現 状 に 対 応 した 内 容 となっています 例 ) 結 合 されたセルの 読 上 げ 午 前 午 後 月 曜 日 曇 り 曇 り 火 曜 日 晴 れ 水 曜 日 雨 情 報 が 正 確 に 伝 わらないので NG 例 ) 結 合 されてないセルの 読 上 げ 午 前 午 後 月 曜 日 曇 り 曇 り 火 曜 日 晴 れ 晴 れ 水 曜 日 雨 晴 れ 情 報 が 正 確 に 伝 わるので OK <フォーム> 1. ラジオボタンやチェックボックス 自 体 でなく その 横 の 選 択 肢 ( 文 字 )をクリックしてくだ さい チェックが 入 りましたか? 例 )テキストをクリックしても 選 択 できるラジオボタンとチェックボックス 例 ラジオボタン チェックボックス 23

25 <リスト> 1. 箇 条 書 きの 前 に<リスト>という 文 字 がありますか? 例 1) 順 番 の 無 い 箇 条 書 き <リスト> トップページ チェックツール サンプルページ お 問 合 せ <リスト 終 わり> 例 2) 順 番 のある 箇 条 書 き <リスト> 1. トップページ 2. チェックツール 3. サンプルページ 4. お 問 合 せ <リスト 終 わり> 箇 条 書 きの 種 類 は 他 にもいくつかあります < 見 出 し> 1. 見 出 し 文 章 の 前 に< 見 出 し>という 文 字 がありますか? 例 ) 以 下 の 事 例 の 場 合 は 見 出 しが1~3まであります < 言 語 ja> <タイトル> 情 報 バリアフリーポータルサイト< タイトル 終 わり> < 見 出 し1> 情 報 バリアフリーポータルサイト< 見 出 し 終 わり> <リスト> トップページ チェックツール サンプルページ お 問 合 せ <リスト 終 わり> < 見 出 し2>サンプルページ< 見 出 し 終 わり> < 見 出 し3> 障 害 を 持 つ 人 のウェブ 利 用 について < 見 出 し 終 わり> 24

26 意 味 のある 順 序 検 証 したいウェブページの URL を 入 力 して Check ボタンをクリックします < 順 序 > 1. 情 報 が 順 番 どおりに 並 んでいますか? 例 ) 検 証 用 画 面 を 読 んで 文 章 に 違 和 感 が なければ OK です 以 下 のような 文 章 が 順 番 に 問 題 があります 2. 課 題 を 見 つける 為 の 簡 易 チェック 1. 課 題 の 改 善 3. 適 合 試 験 このような 場 合 は NG となります 2. 単 語 について 文 字 と 文 字 の 間 に 空 白 (ス ペース)がありませんか? 例 ) 文 字 と 文 字 の 間 に 空 白 がある 場 合 と 無 い 場 合 のスクリーンリーダー 読 上 げ 例 カミ ト シ コウベシ 感 覚 的 な 特 徴 < 感 覚 > 1. 感 覚 的 な 特 徴 ( 位 置 形 色 など)が 分 からなければ 意 味 が 分 からなくなる 箇 所 はあり ませんか? 例 ) 感 覚 的 な 特 徴 例 ( 位 置 形 色 など) 右 斜 め 下 の 赤 い 三 角 ボタンを 押 すと 音 声 が 再 生 し 四 角 いボタンを 押 すと 停 止 します チェックツール 変 換 後 右 斜 め 下 の 赤 い 三 角 ボタンを 押 すと 音 声 が 再 生 し 四 角 いボタンを 押 すと 停 止 します 25

27 色 の 使 用 < 文 字 > 1. 文 字 の 色 に 関 して 赤 い 文 字 は 必 須 です などのように 色 に 頼 った 情 報 はありません か? 例 ) 色 に 頼 った 情 報 の 例 赤 字 は 必 須 項 目 です お 名 前 項 目 が 沢 山 ある 場 合 の 悪 い 事 例 です 赤 色 が 分 からない 人 には 必 須 項 目 が 分 かりません 赤 字 は 必 須 項 目 です お 名 前 ( 必 須 ) 項 目 が 沢 山 ある 場 合 の 良 い 事 例 です 赤 色 が 分 から ない 人 にも 必 須 項 目 がどれかが 伝 わります <リンク 文 字 > 1. リンク 文 字 に 下 線 など 色 以 外 の 目 印 がありますか? 例 ) 下 線 文 字 の 大 きさや 斜 体 など 以 下 は 下 線 の 例 < 下 線 が 無 いリンク> ウェブアクセシビリティのことなら 日 本 ウェブアクセシビリティ 普 及 ネットワークにご 質 問 ください < 下 線 が 有 るリンク> ウェブアクセシビリティのことなら 日 本 ウェブアクセシビリティ 普 及 ネットワークにご 質 問 ください 2. 下 線 などが 無 いリンク 文 字 の 場 合 マウスオーバーした 時 に 色 が 変 わる や 下 線 が 出 る 等 クリックする 前 に なにか 変 化 がおこりますか? 例 )マウスオーバーした 時 に 変 化 するリンクの 例 プルダウンが 出 る 変 化 はNGです ウェブアクセシビリティのことなら 日 本 ウェブアクセシビリティ 普 及 ネットワークにご 質 問 ください マウスオーバー ウェブアクセシビリティのことなら 日 本 ウェブアクセシビリティ 普 及 ネットワークにご 質 問 ください 26

28 1. カラー コントラスト アナライザー2013J をダウンロードおよびインストールして 検 証 してください 3. 下 線 などが 無 いリンク 文 字 の 場 合 その 文 字 の 色 と 周 囲 にある 文 字 の 色 が コントラスト 比 3:1 以 上 になっていますか? 例 )コントラスト 比 の 確 認 スポイトをクリックし コントラストを 計 測 したい リンク 文 字 の 色 を 吸 い 取 ります < 画 像 の 中 の 文 字 > 1. グラフなどの 画 像 の 中 にある 文 字 について もしそのグラフが 白 黒 になった 場 合 理 解 す ることはできますか? 27

29 音 声 制 御 < 音 声 制 御 > 1. 音 声 はクリックまたはエンターを 押 した 時 のみ 再 生 しますか? 例 ) 音 声 再 生 をクリックすると 音 声 を 再 生 するボタン 例 音 声 を 再 生 する 機 能 は ボタンでなくてもかまいません 2. 自 動 的 に 音 声 が 再 生 される 場 合 自 動 的 に3 秒 で 停 止 またはユーザーが 停 止 する 手 段 を 設 けるなどの 配 慮 がありますか? 例 ) 音 声 停 止 をクリックすると 音 声 停 止 するボタン 例 キーボード 操 作 < 予 期 せぬ 変 化 > 1. マウスオーバーしただけで クリックをしなくてもジャンプしたり セレクトメニューや ポップアップが 表 示 される 等 の 変 化 が 起 こっていませんか? 例 )セレクトメニュー 例 選 択 すればジャンプする セレクトメニューの 悪 い 例 選 択 後 実 行 ボタンを 押 さなければジャンプしな いセレクトメニューの 良 い 例 例 )ポップアップ 例 マウスオーバーしただけで クリック をしなくてもポップアップが 表 示 され れば NG 28

30 フォーカス < 閉 じ 込 め> 通 常 ご 利 用 のブラウザで Tab キーを 押 して ページの 最 初 から 最 後 までリンクを 辿 って ください 1. Tab キーを 押 しても 途 中 で 動 かないなどの 症 状 が 無 いですか? 例 ) 閉 じ 込 められて 動 けない 例 閉 じ 込 められて 動 けない の 意 味 が 分 からない 場 合 その 現 象 が 起 こっていないということで 問 題 ありません FLASH や 動 画 などで よく 発 生 します 調 整 可 能 な 制 限 時 間 < 制 限 時 間 のあるフォーム> 1. 制 限 時 間 を 解 除 または 10 倍 にする 方 法 がありますか? 例 ) 冒 頭 に 制 限 時 間 を 解 除 するためのチェックボックスがあるフォーム 例 フォーム 記 入 に 必 要 な 時 間 を 解 除 します 2. それは 必 要 不 可 欠 ですか? 例 )オークション 3. 制 限 時 間 は20 時 間 以 上 ですか? 例 )イベント 申 込 みフォーム 例 イベント 日 時 2014 年 5 月 1 日 水 曜 日 午 後 1 時 ~5 時 場 所 申 込 期 間 2014 年 4 月 1 日 ~4 月 10 日 まで 下 のお 申 込 みフォームからお 申 込 みください 必 須 項 目 は 必 ずご 入 力 ください お 名 前 ( 必 須 ) 29

31 一 時 停 止, 停 止 及 び 非 表 示 < 動 き> 1. 動 きのある 文 字 や スクロールする 文 字 がある 場 合 途 中 で 止 めて 再 開 する 等 の 機 能 があ りますか? 例 )スクロールする 文 字 に 途 中 で 止 めて 再 開 できる 機 能 がある 例 ( 左 へスクロールするニュース) 挙 結 果 衆 議 院 選 挙 自 民 党 が 歴 史 的 大 勝 ニュース 速 報 : 選 < 点 滅 > 1. 点 滅 するコンテンツがある 場 合 5 秒 以 内 で 点 滅 が 静 止 しますか? 例 ) 赤 からオレンジへの 点 滅 し 5 秒 未 満 に 点 滅 が 停 止 するアイコンの 例 <バナー> 1. 繰 返 すバナー 等 のアニメーション GIF がある 場 合 5 秒 以 内 に 静 止 しますか? 例 )2つのフレームが 1 秒 ずつ 永 遠 に 繰 り 返 されている 例 1つめのフレーム 繰 り 返 し 2つめのフレーム 一 時 停 止 ボタンを 押 すと 停 止 する 回 の 閃 光 又 は 閾 値 以 下 < 閃 光 > 1. 1 秒 間 に3 回 以 上 閃 光 を 放 つコンテンツがありますか? 2. 1 秒 間 に3 回 以 上 閃 光 を 放 つコンテンツがある 場 合 弱 く 小 さいですか? 30

32 ブロックスキップ < 見 出 し> 見 出 しが 設 定 されていれば 各 見 出 しにジャンプする 操 作 も 可 能 です 1. メイン 部 分 ( 本 文 )の 冒 頭 に 見 出 しが 設 定 されていますか? 設 定 されていれば< 見 出 し>と 表 示 されています 例 )サンプルページ 変 換 前 検 証 したいウェブページの URL を 入 力 して Check ボタンをクリックします サンプルページ 変 換 後 コンテンツのメイン 部 分 冒 頭 に < 見 出 し>~< 見 出 し 終 わり>と 表 示 されていれば OK で す コンテンツのメイン 部 分 冒 頭 に< 見 出 し>~< 見 出 し 終 わり>がなければ NG です 31

33 ページタイトル <ページタイトル> 1. ページタイトルで ウェブページの 概 要 が 分 かりますか? 検 証 したいウェブページの URL を 入 力 して Check ボタンをクリックします サンプルページ 変 換 後 このように 本 文 見 出 しに<タイトル>~<タイトル 終 わり>の 間 の 文 章 で ウェブページ の 概 要 が 分 かれば OK です フォーカス 順 序 <フォーカス 順 序 > 1. 入 力 フォームの 先 頭 で Tab キーを 押 して 進 んでください 入 力 しやすい 順 序 で 進 みまし たか?( 補 足 :ラジオボタン 等 は 矢 印 キーで 移 動 してください) Tab キー キーボードの 左 上 半 角 / 全 角 キーの 下 にあります 例 )フォーム 例 下 のお 申 込 みフォームからお 申 込 みください 必 須 項 目 は 必 ずご 入 力 ください お 名 前 ( 必 須 ) 住 所 32

34 文 脈 におけるリンクの 目 的 <リンク> 1. リンク 文 字 を 見 て それがどのような 趣 旨 のページ またはどのようなファイルにジャン プするのか 予 測 できますか? 例 )リンク 例 ウェブアクセシビリティに 関 するお 悩 み ttp://ickobe.jp/ ウェブアクセシビリティに 関 するお 悩 みをご 相 談 されたい 方 は ここを クリック ウェブアクセシビリティに 関 するお 悩 みをご 相 談 されたい 方 は 日 本 ウ ェブアクセシビリティ 普 及 ネットワークウェブサイトへ ページの 言 語 < 言 語 > 1. ページの 先 頭 に< 日 本 語 > 等 ページの 言 語 に 対 応 した 表 記 がありますか? 例 )サンプルページ 変 換 前 にアクセスし サンプルページを 変 換 サンプルページ 変 換 後 このように< 言 語 ja>など ページの 先 頭 に 言 語 の 指 定 があれば OK です 英 語 の 場 合 は< 言 語 en> 韓 国 語 の 場 合 は< 言 語 ko>などのようになります オンフォーカス <オンフォーカス> フォーカスされた 状 態 とは マウスオーバーされた 状 態 です マウスオーバーされただけで ページ 移 動 やプルダウンなどの 変 化 が 起 ってはいけません 1. 前 の 設 問 キーボード 操 作 と 同 じです 同 じ 箇 所 に 〇 をつけてください 33

35 ユーザインタフェース コンポーネント < 登 録 送 信 実 行 など> 1. プルダウンメニューを 選 択 したらジャンプする 入 力 時 にエンターを 押 したらフォームが 送 信 される 等 実 行 ボタンを 押 していないのに 起 るアクションはありませんか? 例 ) 実 行 ボタンを 押 して 送 信 するフォーム 例 2. 上 記 のアクションや 入 力 フォームの 送 信 等 実 行 ボタンの 前 に 何 がおこるかの 説 明 が ありますか? 例 ) 何 がおこるのかを 説 明 しているラジオボタン 例 入 力 エラー 箇 所 の 特 定 < 入 力 エラー> 1. 入 力 フォームの 必 須 項 目 を 入 力 せず 送 信 してください どの 項 目 が 入 力 されていなかった かエラー 表 示 で 分 かりますか? 例 ) 必 須 項 目 が 入 力 されていないエラーの 例 入 力 フォーム 入 力 エラー: 必 須 項 目 が 入 力 されていません お 名 前 を 入 力 してください 必 須 項 目 は 必 ず 入 力 してください お 名 前 ( 必 須 ) 34

36 2. 間 違 えた 入 力 をするとエラーがでるフォームの 場 合 間 違 えて 入 力 してください どのよ うに 修 正 したら 良 いかエラー 表 示 で 分 かりますか? 例 ) 間 違 えた 入 力 をしたエラーの 例 ラベル 又 は 説 明 文 <ラベル> 1. 必 須 項 目 に 関 する 説 明 が 冒 頭 にありますか? 例 ) 入 力 フォームに 関 する 冒 頭 にある 説 明 の 例 入 力 フォーム 必 須 項 目 は 必 ず 入 力 してください フリガナは 全 角 カナで 入 力 してください お 名 前 ( 必 須 ) フリガナ 2. 入 力 例 がありますか? 例 )テキストボックスに 対 する 入 力 例 の 例 お 名 前 ( 入 力 例 : 神 戸 太 郎 ) 35

37 構 文 解 析 <HTML> にアクセスして URL を 入 力 して 検 証 例 )エラーが 無 く OK の 場 合 の 表 示 例 )エラーがあって NG の 場 合 の 表 示 プログラムが 解 釈 可 能 な 識 別 名 役 割 及 び 設 定 可 能 な 値 < 識 別 名 > 1. 前 の 設 問 構 文 解 析 と 同 じです 同 じ 箇 所 に 〇 をつけてください これは 主 に 独 自 に 開 発 したユーザーインターフェイスやスクリプトに 関 する 項 目 で 技 術 者 向 けの 項 目 となります 基 本 的 には 構 文 解 析 で 問 題 がなければ OK です 36

38 研 修 やその 他 のサービスのご 案 内 職 員 社 員 研 修 サービス 日 本 ウェブアクセシビリティ 普 及 ネットワークが 行 う 研 修 は ウェブ アクセシビリティの 専 門 知 識 がある 障 害 を 持 つ 当 事 者 が 講 師 をいた します 1 回 の 研 修 で 参 加 者 全 員 にウェブアクセシビリティの 重 要 さ 当 事 者 の 声 を 体 感 していただけます 当 ネットワーク 研 修 講 師 ご 紹 介 板 垣 宏 明 (いたがき ひろあき) 専 門 :ウェブアクセシビリティ 日 本 ウェブアクセシビリティ 普 及 ネットワーク 代 表 jis8341.net < 経 歴 >2004 年 兵 庫 県 立 障 害 者 高 等 技 術 専 門 学 院 卒 業 /2005 年 ~ アイ コラボレ ーション 神 戸 勤 務 < 受 賞 履 歴 >ひょうごユニバーサル 社 会 づくり 兵 庫 県 知 事 賞 / 兵 庫 ニューメディア 推 進 協 議 会 地 域 功 労 者 賞 伊 敷 政 英 (いしき まさひで) 様 専 門 :ウェブアクセシビリティ Cocktailz(カクテルズ) 代 表 年 筑 波 大 学 附 属 盲 学 校 高 等 部 普 通 科 卒 業 /2000 年 東 京 都 立 大 学 理 学 部 数 学 科 卒 業 /2008 年 財 団 法 人 日 本 規 格 協 会 情 報 技 術 標 準 化 研 究 センター 情 報 アクセ シビリティの 国 際 標 準 化 に 関 する 調 査 研 究 委 員 会 WG2 委 員 /2010 年 Cocktailz と して 活 動 開 始 /2011 年 ウェブアクセシビリティ 基 盤 委 員 会 WG2 委 員 星 野 史 充 (ほしの ふみたか) 様 専 門 :ウェブアクセシビリテ ィ 所 属 :( 株 ) 富 士 通 システムズ ウエスト 常 駐 先 : 名 古 屋 盲 人 情 報 文 化 センター 担 務 歴 : 視 覚 障 害 者 システムの 開 発 SE 教 育 SE Web アクセシビリティ 診 断 Web アクセシビリティ 評 価 者 養 成 講 座 開 催 ( 総 務 省 助 成 ) 障 害 当 事 者 による Web アクセ シビリティ 診 断 実 施 ( 総 務 省 千 葉 県 庁 他 ) 垣 内 俊 哉 (かきうち としや) 様 専 門 :バリアフリー 株 式 会 社 ミライロ 代 表 取 締 役 社 長 < 経 歴 >2006 年 岐 阜 県 立 中 津 高 等 学 校 中 退 /2009 年 民 野 剛 郎 と Value Added Network を 創 業 /2010 年 株 式 会 社 ミライロを 設 立 /2012 年 立 命 館 大 学 経 営 学 部 経 営 学 科 卒 業 < 受 賞 履 歴 > 京 都 ベンチャークラブ 京 都 クラブ 賞 / 日 本 中 央 ベン チャーリジョン 日 本 中 央 リジョン 賞 / 国 際 ソロプチミストアメリカ 連 盟 賞 第 2 位 / 近 畿 地 区 人 間 力 大 賞 グランプリ など 多 数 37

39 当 ネットワーク サービスのご 案 内 日 本 ウェブアクセシビリティ 普 及 ネットワークサービス 一 覧 職 員 社 員 研 修 サービス(ウェブアクセシビリティ 初 心 者 対 象 ) アクセシビリティ 以 外 でも 当 事 者 に 聞 きたいことなど お 気 軽 にご 質 問 ください 今 だけ!1 回 1 時 間 ~ 人 数 制 限 なし 31,500 円 ( 税 込 )~( 通 常 税 込 84,000 円 ) 交 通 費 宿 泊 費 は 別 途 頂 戴 いたします 研 修 資 料 として 20 分 で 分 かるウェブアクセシビリティ 1 冊 1,260 円 ( 税 込 ) を 受 講 者 全 員 分 ご 購 入 いただきます ウェブアクセシビリティご 相 談 対 応 サービス(ウェブマスター 対 象 ) 電 話 メールでのご 相 談 対 応 ( 何 度 でも)378,000 円 ( 税 込 )/1 年 ご 訪 問 してのレクチャーも 可 能 です( 交 通 費 宿 泊 費 別 途 ) 等 級 A& 等 級 AA 解 説 書 付 ウェブアクセシビリティ 事 例 集 付 試 験 ウェブアクセシビリティ 方 針 作 成 ガイドライン 作 成 サービス 試 験 40 ページ 目 視 検 査 840,000 円 ( 税 込 ) ( 検 査 結 果 は 経 済 産 業 省 が 採 用 した( 株 )インフォ クリエイツ 社 Libra 出 力 検 査 証 ) アクセシビリティ 方 針 作 成 テンプレート 利 用 31,500 円 ( 税 込 )~ アクセシビリティガイドライン 作 成 テンプレート 利 用 105,000 円 ( 税 込 )~ 方 針 ガイドラインをオリジナルで 専 用 に 作 成 する 場 合 は 費 用 が 異 なります ユーザー 評 価 JIS X :2010 対 応 ユーザー 評 価 52,500( 税 込 )~/1 ページ 肢 体 不 自 由 者 2 名 視 覚 障 害 者 2 名 高 齢 者 2 名 ボリュームディスカウント 有 上 記 セットをお 得 なパッケージとしても ご 提 案 可 能 です( 要 御 見 積 ) お 問 合 せ 日 本 ウェブアクセシビリティ 普 及 ネットワーク 電 話 番 号 : 運 営 :NPO 法 人 アイ コラボレーション 神 戸 営 業 日 時 : 月 曜 日 ~ 金 曜 日 午 前 9 時 30 分 ~ 午 後 5 時 30 分 祝 日 年 末 年 始 除 く URL: mail : info@jis8341.net 担 当 : 板 垣 北 山 38

40 当 ネットワーク 書 籍 ツールのご 案 内 日 本 ウェブアクセシビリティ 普 及 ネットワーク 書 籍 ( 資 料 ) 20 分 でわかるウェブアクセシビリティ URL 20 分 でわかるウェブアクセシビリテ アクセシビリテイの 概 要 と 簡 易 チェックの 方 法 を 掲 載 しています 実 装 チェックリスト URL 実 装 チェックリスト 等 級 A~AAA(HTML 版 )( 無 料 ) 実 装 チェックリスト 等 級 A~AAA(excel 版 )( 無 料 ) excel 版 は 複 製 編 集 公 開 可 能 となっております 実 装 チェックリスト 対 応 ウェブアクセシビリティ 事 例 集 全 等 級 全 項 目 網 羅! 2012 年 度 版 URL ウェブアクセシビリティ 事 例 集 2012 年 度 版 ( 無 料 サンプル 版 ) ウェブアクセシビリティ 事 例 集 2012 年 度 版 ( 有 料 版 税 込 12,600 円 ) 日 本 ウェブアクセシビリティ 普 及 ネットワーク ツール(システム) JIS X :2010 簡 易 チェックツール( 無 料 ) URL 簡 易 チェックシート 付 ( 無 料 PDF 版 無 料 excel 版 ) 簡 易 チェック 方 法 は 20 分 でわかるウェブアクセシビリティ 有 料 版 をご 覧 ください ホームページ 音 声 読 上 げシステム みんなのとーくん URL インストール 不 要 の 音 声 読 上 げシステム ホームページに 簡 単 なタグを 埋 め 込 むだけで 滑 らかな 音 声 読 上 げが 実 現! お 問 合 せ 日 本 ウェブアクセシビリティ 普 及 ネットワーク 電 話 番 号 : 運 営 :NPO 法 人 アイ コラボレーション 神 戸 営 業 日 時 : 月 曜 日 ~ 金 曜 日 午 前 9 時 30 分 ~ 午 後 5 時 30 分 祝 日 年 末 年 始 除 く URL: mail : info@jis8341.net 担 当 : 板 垣 北 山 39

41 サポーター 協 力 のお 願 い 日 本 ウェブアクセシビリティ 普 及 ネットワーク ~ロゴスポンサーになってください~ 日 本 ウェブアクセシビリティ 普 及 ネットワークの 活 動 って? 障 害 を 持 つ 当 事 者 がつくる 日 本 ウェブアクセシビリティ 普 及 ネットワーク は 主 に 障 害 を 持 つ 当 事 者 と サポートする 健 常 者 で 構 成 され それぞれが 能 力 を 活 かし 可 能 な 範 囲 でウェブアクセシビリティの 普 及 活 動 を 行 うネットワークです 2013 年 現 在 障 害 を 持 つ 私 たちにとって ウェブは 欠 かせないものです ですが まだまだ 配 慮 されてい ないウェブサイトが 多 くあるのが 現 状 です 日 本 ウェブアクセシビリティ 普 及 ネットワークの 草 の 根 活 動 が いずれ 日 本 の 情 報 バリアフリーの 向 上 へとつながり それにより 障 害 を 持 つ 人 がストレスなく 情 報 を 享 受 で きる 世 界 になることを 願 って 活 動 しています 収 益 は 何 につかわれるの? 情 報 バリアフリー ポータルサイトの 運 営 セミナーの 開 催 重 度 障 害 を 持 つ 人 への 業 務 の 発 注 ロゴはどこで PR されるの? 一 度 サポーター 協 力 いただいた 企 業 さまのロゴは 情 報 バリアフリーポータルサイト(jis8341.net)に 無 期 限 で 掲 載 されます またセミナーを 行 う 際 には 協 賛 企 業 として 配 布 パンフレットに 掲 載 されます 料 金 GOLD サポーター 30,000 円 ~ SILVER サポーター 20,000 円 ~ BRONZE サポーター 10,000 円 ~ ロゴの 掲 載 順 は 費 用 順 となります ご 了 承 ください お 申 込 み 日 本 ウェブアクセシビリティ 普 及 ネットワーク 電 話 番 号 : 運 営 :NPO 法 人 アイ コラボレーション 神 戸 営 業 日 時 : 月 曜 日 ~ 金 曜 日 午 前 9 時 30 分 ~ 午 後 5 時 30 分 祝 日 年 末 年 始 除 く URL: mail : info@ jis8341.net 担 当 : 板 垣 北 山 40

42 応 援 メッセージ Cocktailz 代 表 伊 敷 政 英 様 (いしき まさひで) 2010 年 8 月 に 改 正 された JIS X では 今 後 のウェブ 技 術 の 急 速 な 発 展 にも 耐 えうるようにと 個 別 の 技 術 に よらない 形 で 達 成 基 準 が 示 されています しかし この 弊 害 としてウェブサイトを 創 る 方 々 発 注 する 方 々の 裁 量 にゆだねられ る 部 分 が 多 くなり また 規 格 の 内 容 も 抽 象 的 になりました そんな 中 で このような 書 籍 が 公 開 される ことは ウェブアクセシビリティにこれか ら 取 り 組 もうとしている 方 々にとってとて も 頼 もしいものになると 思 います また 本 書 の 作 成 に 障 害 当 事 者 が 深 くかか わっていることもうれしく 思 います ウェブアクセシビリティを 根 付 かせるため には 障 害 当 事 者 が 知 識 と 経 験 をもとに 積 極 的 に 参 加 することが 欠 かせません この 観 点 からも 本 書 の 作 成 には 大 きな 意 義 があると 思 います 株 式 会 社 ミライロ 代 表 取 締 役 社 長 垣 内 俊 哉 様 (かきうち としや) ミライロでは 障 害 を 価 値 に 変 える バリア バリュー という 視 点 から ユニバーサルデザインの 普 及 に 取 り 組 んでいます 日 本 ウェブアクセシビ リティ 普 及 ネットワーク 様 の 事 業 は そ うした 当 事 者 の 視 点 に 立 った 事 業 の 理 想 形 であると 感 じます 書 籍 のテーマで 扱 われておりますアクセ シビリティは 実 用 性 の 高 い 情 報 が 集 約 されていなかったことも 起 因 し 今 日 ま で 企 業 にとっては 取 り 組 み 辛 い 印 象 でし た しかしながら 日 本 ウェブアクセシ ビリティ 普 及 ネットワーク 様 の 数 々の 資 料 には 具 体 的 な 事 例 ならびに 手 法 が 明 記 されており アクセシビリティを 社 会 に 浸 透 させるきっかけになるだろうと 感 じ ております 障 害 を 持 つ 当 事 者 がつくる 日 本 ウェブアクセシビリティ 普 及 ネットワーク 運 営 :NPO 法 人 アイ コラボレーション 神 戸 < 主 な 活 動 内 容 > 情 報 バリアフリーポータルサイトの 運 営 セミナーや 研 修 の 実 施 担 当 ウェブサイトの 現 状 を 調 べたい 方 は こちらをご 覧 ください( 無 料 ) あなたのサイトは 大 丈 夫?20 分 でできる 簡 易 チェックシート( 等 級 A) 実 装 チェックシート 試 験 用 のチェックシート( 等 級 A,AA,AAA) 実 装 チェックシート 41