アクセシビリティメモ/「改正迫るウェブアクセシビリティの規格（JIS X 8341-3）の改正のポイントと動向」 (14d)

アクセシビリティメモ/「改正迫るウェブアクセシビリティの規格（JIS X 8341-3）の改正のポイントと動向」

12月3日に行なわれた、

第16回ヒューマンインタフェース学会セミナー
「改正迫るウェブアクセシビリティの規格（JIS X 8341-3）の改正のポイントと動向」
http://www.his.gr.jp/activities/seminar/read.html?016.cfp

に行ってきました。以下はそのメモです。

※なおセミナーの内容は進行中のものであり、実際には変わる可能性もあるとのことなのでご注意。

JIS X 8341-3の紹介と改正のポイント †

主査、渡辺隆行（東京女子大学）さんによる概要説明。

• 緑本　http://www.amazon.co.jp/dp/4839922209
  • JISに関わったみなさんが翻訳で参加した良本。
  • なのに売れなかったらしい。。もう版元にもない。
  • 本屋にあるのが最後なので、見かけたら迷わず買え。

• [!]JIS公示は、2010年度第一四半期（＝来年5月か6月？）見込み。
  • なのでJIS2009でなくJIS2010と呼ばれていた
  • 審議に時間がかかっているらしい。。

• Understanding, Techniqueの日本語訳を進めており、JIS公示と同時期に公開する
  • 協力者募集中とのこと
  • 年度末（＝3末）に途中経過を公開
  • 英語できなくてもできることないですか？^^;と聞いてみたら、やはり翻訳が一番欲しいらしい。

• ガイドラインの雛形や、実装の統一見解もあわせて発表したいと考えている

• 今年度中にNPOをつくるらしい

→「アクセシビリティメモ/「改正迫るウェブアクセシビリティの規格（JIS X 8341-3）の改正のポイントと動向」」 の続きを読む

実践アクセシビリティ/JIS X 8341-3 2009を試験してみてわかった制作上の問題点 (33d)

実践アクセシビリティ/JIS X 8341-3 2009を試験してみてわかった制作上の問題点

このページの概要 †

アークウェブでは週一回のアクセシビリティ勉強会を行っています。
昨日は「JIS X 8341-3 2009」の 8章：試験方法 について資料を読みながら議論しました。

実は、過去に 1度環境ポータルサイト『エコッツェリア』の構築をした際に「JIS X 8341-3 2009」の試験項目の適用をした。
という話があり、そのときの進め方の問題点と改善についてまとめます。

なお、エコッツェリアのアクセシビリティについて担当した、アークウェブの小森の話をもとにしてまとめたものです。

目次 †

• このページの概要
• エコッツェリアで行った試験項目について
  • 検証に仕様したツール
• 検証の実施について
  • 検証にかかる時間
• 検証時間の短縮についての検討
  • ワークフローの改善
• まとめ

エコッツェリアで行った試験項目について †

まずは、どのようなことをエコッツェリアで試験項目として行ったかを軽く説明します。

• 「アクセシビリティ設計（ゴールの設定）」をする
  • JIS X 8341-3の【6.2　設計】にあてはまるモノ

• 試験対象ページを選択する
  • 8.1.2 - c) ヒューリスティックに選択する方式で、25ページを選出
    
    ※注意：試験当時とページのURLが変わっている場合があります。

→「実践アクセシビリティ/JIS X 8341-3 2009を試験してみてわかった制作上の問題点」 の続きを読む

WAI-ARIA/NVDAのLive Regionのサポート状況(2009.12.28) (57d)

ミツエーリンクスさんの「アクセシビリティBlog」にてNVDAの気になる情報がアナウンスされていました。

• 【NVDA日本語化】2009年11月・12月の進捗状況

Live Regionサポート

…略…
NVDA - #246 (NVDA should handle events other than "show" for live regions)
をご参照ください。

• #246には次のような内容がありました。

* supports aria-live:polite,assertive and rude. 
Though currently due to NVDA not having any particular speech prioritization, 
there is no difference between the three.

「aria-live」の「polite」「assertive」「rude」をサポートしました。
NVDAは、スピーチの優先順位を表すことができないので、特にこの3つに違いはありません?
ん? 割り込みの違いがない?

* Supports aria-relevant:additions,text, all, and not specified.
* Does not support aria-relevant:removed. 
Not sure what exactly to speak here, nore how to handle internationalization
for a word like 'removed' since our in-process code doesn't really have any
internationalization capabilities at the moment.

「aria-relevant」の「additions」「text」「all」と「未指定」がサポートされました。

「aria-relevant」の「removed」はサポートされていません。
国際化がどうのこうの... 。どういう意味だろ。

* Does not yet support aria-atomic:true. Technically this isn't too hard to do in Firefox though.

「aria-automatic」が「true」の指定はまだサポートされていません。
FireFoxでこれをサポートするのは、技術的にとてもハードです。(みたいな?)

* This support only works in IAccessible2 applications, specifically most best in Mozilla Gecko applications. 
Support for IE or non-IAccessible2 browsers would be completely different,
there is no useful way to abstract this. 

このサポートは、IAccessible2 アプリケーションでのみ動作する。
とくに、Mozilla Gecko applicationsでもっともよく動作する。
IEやIAccessible2ではないブラウザへのサポートは、完全に異なっている。

とりあえず実際に試してみないとよくわからんな。。

アクセシビリティメモ/「JIS X 8341-3 2009」のeXtream Reading(2) (68d)

アクセシビリティメモ/「JIS X 8341-3 2009」のeXtream Reading(2)

このページは? †

アークウェブでは週一回のアクセシビリティ勉強会を行っており、
現在は、「JIS X 8341-3 2009」についてXR(eXtream Reading)を行っています。

方法としては、参加者と時間を決めて各自一斉に読み、ポイントとなる部分や不明点や意見などを議論するような形式としました。

• ベース資料
  • JIS X 8341-3：2009 改正原案（附属書を含む）
    http://www.jsa.or.jp/stdz/instac/commitee-acc/WG2/review2009/ITBF_Web_review.html
• サブ資料
  • WCAG 2.0 解説書　[原題：Understanding WCAG 2.0]
    http://www.jsa.or.jp/stdz/instac/commitee-acc/W3C-WCAG/WCAG20/UNDERSTANDING-WCAG20/index.html

議事録 †

• 以下の内容には、理解に誤りがある場合があります。お気づきの方は下記の コメント欄 からお知らせいただけると幸いです。

７章は４つの基本要件から構成されています。

• 7.1.x 認知可能
• 7.2.x 操作可能
• 7.3.x 理解可能
• 7.4.x 堅牢性 (ロバスト性)

今回は、 P.11〜13 7.1.3 の最後までについて書きます。
ただし、7.1.2 はものすごい理解に苦しみました。1回読んだだけでは理解できませんでした。
私たちは、一旦 7.1.2 について議論するのを止め、先に進むことにして、後から再度検討する。というアプローチを取りました。
よって、このwikiでも一度端折りつつ進めます。

なお、「U-WCAG2.0」は 「Understanding WCAG 2.0」を指すことにする

→「アクセシビリティメモ/「JIS X 8341-3 2009」のeXtream Reading(2)」 の続きを読む

アクセシビリティメモ/「JIS X 8341-3 2009」のeXtream Reading(1) (75d)

アクセシビリティメモ/「JIS X 8341-3 2009」のeXtream Reading(1)

このページは? †

アークウェブでは週一回のアクセシビリティ勉強会を行っており、
現在は、「JIS X 8341-3 2009」についてXR(eXtream Reading)を行っています。

方法としては、参加者と時間を決めて各自一斉に読み、ポイントとなる部分や不明点や意見などを議論するような形式としました。

• ベース資料
  • JIS X 8341-3：2009 改正原案（附属書を含む）
    http://www.jsa.or.jp/stdz/instac/commitee-acc/WG2/review2009/ITBF_Web_review.html
• サブ資料
  • WCAG 2.0 解説書　[原題：Understanding WCAG 2.0]
    http://www.jsa.or.jp/stdz/instac/commitee-acc/W3C-WCAG/WCAG20/UNDERSTANDING-WCAG20/index.html

議事録 †

• 以下の内容には、理解に誤りがある場合があります。お気づきの方は下記の コメント欄 からお知らせいただけると幸いです。
• 注記：７章に入るまではかなりザックリです

• P.2〜P.10 ６章のラストまで。

→「アクセシビリティメモ/「JIS X 8341-3 2009」のeXtream Reading(1)」 の続きを読む

アクセシビリティメモ/JIS X 8341-3 2009の7.3.3.4をZen-Cartに適用するには。 (81d)

アクセシビリティメモ/JIS X 8341-3 2009の7.3.3.4をZen-Cartに適用するには。

このページは? †

アークウェブでは週一回のアクセシビリティ勉強会を行っており、
現在は、「JIS X 8341-3 2009」についてXR(eXtream Reading)を行っています。

7.3.3.4 法的義務・金銭的取引・データ変更・回答送信のエラー回避にて、
Zen-Cartの場合はどのように適用できるかを検討している最中なので、
まずはその命題を書いておきます。

後日、方針が決まったら、追記する形にします。

命題 †

• 7.3.3.4 法的義務・金銭的取引・データ変更・回答送信のエラー回避とは
  http://www.jsa.or.jp/stdz/instac/commitee-acc/W3C-WCAG/WCAG20/UNDERSTANDING-WCAG20/index.html#minimize-error-reversible

  > 次の少なくとも1つが当てはまる
  > a.可逆性
  > b.チェック可能
  > c.確認可能
  > AAの達成基準

• Zen-Cartの場合
  • 最低限、zen-cartの『レビュー』と『お問い合わせ』に確認画面がないのは、これを満たせているかビミョウ

レビューと、お問い合わせの挙動 †

• 送信したら、管理者が対応するだけで、ユーザーが送信内容を直せないので a が満たせない。
• 入力チェックは特に強固にしていないので b も満たせない?
  …というか特にチェックする項目もないのだが。
• これらの画面には確認画面がないので c も満たせない。

問題 †

b がどれだけチェックしているのか微妙ですが、
それより c の確認画面を入れるのが手っ取り早いし、ユーザーにとっても入力内容を確認してから送れるのでよい。

→というわけで、確認画面を必ず入れるように検討したいですね。

---

コメントをどうぞ †

お名前:

tag: JIS X 8341-3

jQuery UI に見る WAI-ARIA の実装：dialog 編 (144d)

目次 †

はじめに †

こんにちは。竹村です。

JavaScriptのライブラリである jQuery のユーザーインターフェイス関連を
実装している『jQuery UI』がWAI-ARIAに対応しつつある。ということを
下記の記事で知り、どのように実装されているかを確認してみました。

• WAI-ARIA Implementation in JavaScript UI Libraries - updated
  http://www.paciellogroup.com/blog/?p=313

今回は、jQuery UI の dialog ウィジェットのWAI-ARIAの実装を確認します。

簡単なWAI-ARIAの説明 †

まず、WAI-ARIAについては、下記を確認ください。

• WAI-ARIA導入（日本語訳）
  http://d.hatena.ne.jp/aratako0/20090709/p1

• 第1回：FF3、IE8が対応！これがWAI-ARIA
  http://www.thinkit.co.jp/article/133/1/

ザックリ説明すると、AjaxやDHTMLなどで動的に変化するコンテンツで、
コンテンツが変化したことをスクリーンリーダーなどの支援技術に伝える
ために、HTMLを拡張した仕様です。

準備 †

支援技術側がWAI-ARIAに対応していなければ利用できません。
今回は、ブラウザにFirefox、スクリーンリーダーにJAWS 10を使用します。

→「jQuery UI に見る WAI-ARIA の実装：dialog 編」 の続きを読む

jCarouselLiteのautoにて停止/再スタートできるようにするアクセシビリティ対応 (152d)

はじめに †

こんにちは、竹村です。

最近、jCarouselLite の利用頻度の高くなってきています。
jCarouselLite は、表示エリアが限られている場所で多くの画像バナーを表示できるウィジェットです。
下記のようなものです。

http://okra.ark-web.jp/~takemura/public/js/jcarousellite/acc/normal.html

jCarouselLiteの公式サイト：http://gmarwaha.com/jquery/jcarousellite/

jCarouselLite は画像バナーを指定した秒数待ってから自動的にスクロールする機能があります。
これによって、ボタンを押さなくてもループ再生されるのでアクティブ感が得られるのは良いのですが、
自動的にループ再生できるくせに、停止や再スタートの機能がありません。

これでは、JIS X 8341-3:2009 7.2.2.2 (WCAG 2.0 2.2.2, 2.2.3)に適用できないため、改修しました。

現在は、githubからダウンロードできるようにしています。

http://github.com/tiadeen2/jCarouselLite_auto_controller

→「jCarouselLiteのautoにて停止/再スタートできるようにするアクセシビリティ対応」 の続きを読む

ValidかつアクセシブルにYouTube（Flash）をHTMLに埋め込む方法 (173d)

ValidかつアクセシブルにYouTube（Flash）をHTMLに埋め込む方法

ValidかつアクセシブルにYouTube（Flash）をHTMLに埋め込む方法 †

ビデオの埋め込みなど用途が増えてきたので、あらためて検証してみました。

FlashをHTMLに埋め込むときの問題点： †

• Web標準的な問題
  • IEではFlashを表示するには、embedタグを使用する。
  • ただしこのembedタグは、Web標準的に非推奨の要素で、Validatorエラーになってしまう。代替テキスト用であるnoembedも同様。
• 代替テキストの問題
  • アクセシビリティ的には、Objectタグ内に代替テキストを入れる必要がある。
  • が、単にObjectタグ内に入れるだけだと、IEではそのまま表示されてしまう。（Flashと代替表示が並んで表示されてしまう）
• JavaScriptで書き出す場合の問題
  • クリックしないとアクティブにならない問題があった（現在は解消されてきているらしい）ことから、JSで書き出す方法が主流になった背景がある。
  • ただし、JSがオンでないと何も表示されず、アクセシブルではない。
  • noscript内に静的に書けばよいのだが、最初のWeb標準的な問題がそのまま残る。。

SWFObject 2を使う †

SWFObject
http://code.google.com/p/swfobject/

SWFObjectは、JSで書き出すタイプのライブラリ。
現在のところこのタイプの事実上標準であるらしいです。

以前のバージョンだと、JSで書き出す仕様上、JSが必ずオンでないとFlashが表示されない状態でしたが、バージョン2になってからはJSオフの状態も考慮されており、上記をクリアする内容になっています。

SWFObject 2 のHTMLソース †

ダウンロードすると、index.html と index_dynamic.html が入っていますが、index_dynamic.html は旧バージョン形式の「jsオン時のみ対応」用なので、index.html を使います。

• idは適宜好みで書き換えます。
• IE用とそれ以外（Firefox、Safari等）用のObjectを2つ記述するかたちなので、Flashへのパスとサイズも2箇所記述します。
• 代替テキストも忘れずに書きます。映像の内容をわかりやすく書きます。

<object id="swf" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="480" height="385"> 
	<param name="movie" value="http://www.youtube.com/v/XAKroNeQhf0&amp;hl=ja&amp;fs=1&amp;" /> 
	<!--[if !IE]>--> 
	<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/XAKroNeQhf0&amp;hl=ja&amp;fs=1&amp;" width="480" height="385"> 
	<!--<![endif]--> 
	<div> 
		<h2>Flashプラグインがないユーザへの代替</h2> 
		<p>代替テキスト：かわいい子猫のムービーです。</p>
		<p>ムービーをご覧になるにはFlash Playerのインストールが必要です。</p> 
		<p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p> 
	</div> 
	<!--[if !IE]>--> 
	</object> 
	<!--<![endif]--> 
</object> 

• こんな感じ。
  • http://www.ark-web.jp/accessibility/misc/SWFObject2/test1.html

• IEでもちゃんと表示されます。代替表示も表示されません。
• JSオフのときも問題なく表示
• Flashがインストールされていないときは、下記のような代替表示が出るようになります

最後に、

1）YouTubeはビデオのURLに「&」が含まれているので、「&」は

&

と実体参照に置き換えます。
これでHTMLValidatorエラーは消えます。

2）YouTubeのコードにはフルスクリーン化などの制御に使う2つのパラメータがあるので、これを記述します。

<param name="allowFullScreen" value="true"></param> 
<param name="allowscriptaccess" value="always"></param>

ただ、これもIE用とその他で2箇所に書かないとダメみたいでした。

<object id="swf" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="480" height="385">
	<param name="movie" value="http://www.youtube.com/v/XAKroNeQhf0&amp;hl=ja&amp;fs=1&amp;" />
	<param name="allowFullScreen" value="true"></param> 
	<param name="allowscriptaccess" value="always"></param>
	<!--[if !IE]>-->
	<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/XAKroNeQhf0&amp;hl=ja&amp;fs=1&amp;" width="480" height="385">
	<param name="allowFullScreen" value="true"></param> 
	<param name="allowscriptaccess" value="always"></param>
	<!--<![endif]-->
	<div> 
		<h2>Flashプラグインがないユーザへの代替</h2> 
		<p>代替テキスト：かわいい子猫のムービーです。</p>
		<p>ムービーをご覧になるにはFlash Playerのインストールが必要です。</p> 
		<p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p> 
	</div> 
	<!--[if !IE]>-->
	</object>
	<!--<![endif]-->
</object>

3）なお、このままでも再生に問題ないですが、embedを使っていたときはIEでできていたFlash Playerの自動インストールや自動バージョンアップなどができなくなってしまうので、SWFObjectを使い、head内に以下のように書いておけば、SWFObject側がバージョンチェックをしてくれますので、入れておきましょう。

<script type="text/javascript" src="swfobject.js"></script> 
<script type="text/javascript"> 
swfobject.registerObject("swf", "9.0.0", "expressInstall.swf");
</script> 

• こんな感じ。
  • http://www.ark-web.jp/accessibility/misc/SWFObject2/test2.html

参考サイト †

• SWFObject v2.0 ドキュメント日本語訳 : Media Technology Labs (MTL) : メディアテクノロジーラボ　ブログ
• SWFObject 2を用いたFlash Playerのバージョン検知とSWFファイルの埋め込み | デベロッパーセンター
• swfobject.js の expressInstall.swf 使用法 - 左脳Script
• 小粋空間: YouTube の Embed タグを XHTML valid にする

アクセシビリティメモ/アックゼロヨン・アワード アクセシビリティ最高得点サイトのPDCAサイクル (180d)

アクセシビリティメモ/アックゼロヨン・アワード アクセシビリティ最高得点サイトのPDCAサイクル

第4回 アックゼロヨン・アワードの入賞作品の中でアクセシビリティ最高得点サイト「山梨県ホームページ」から

結果発表 | 第4回 アックゼロヨン・アワード
http://www.acc04.jp/results/

• 山梨県ホームページ
  http://www.pref.yamanashi.jp/
  • アクセシビリティ　7.3
  • （ユーザビリティ　6.3）

サイトでの記述

• 山梨県／サイトのユニバーサルデザイン
  http://www.pref.yamanashi.jp/info/ud.html

ユニバーサルデザインの一環としてアクセシビリティを捉えている

以下、リニューアルに伴い、ユニバーサルデザイン化、アクセシビリティ向上の資料のまとめ

リニューアル前の調査、診断 †

山梨県ホームページアクセシビリティ診断結果報告書（PDF：766KB）
http://www.pref.yamanashi.jp/koucho/documents/39743261634.pdf

山梨県ホームページユーザビリティ診断結果報告書（PDF：2,274KB）
http://www.pref.yamanashi.jp/koucho/documents/74560462759.pdf

計画 †

山梨県ホームページリニューアルプラン（PDF：1,446KB）
http://www.pref.yamanashi.jp/koucho/documents/49541183457.pdf

• 現状認識と分析
  • アクセシビリティのおける主な問題点

問題点としてあげられているのは...
・グローバルナビゲーションの不統一
・メールフォームでの説明が不足している部分がある
・ガイドラインの見直しが必要
・見出し要素のつけかたがまちまち
・画像に対するALT属性が画像の内容を示すものになっていない
・略語、専門用語の説明が不十分な箇所がある
・ボタンが「クリックできる」ということがわかるデザインになっていない
など

ガイドライン †

山梨県ホームページ作成ガイドライン（ウェブアクセシビリティ編） （PDF：351KB）
http://www.pref.yamanashi.jp/koucho/documents/42330695419.pdf

ユニバーサルデザインに配慮したウェブサイトを作成するために（PDF：199KB）
http://www.pref.yamanashi.jp/koucho/documents/12431791714.pdf

• 山梨県ホームページ作成ガイドライン（ウェブアクセシビリティ編）とJIS X 8341-3との対応表

具体的な対応 †

「ユニバーサルデザインの向上」（PDF：756KB）
http://www.pref.yamanashi.jp/info/documents/hp_ud.pdf

1. 閲覧支援機能の改善
2. デザイン面での配慮
3. 音声読み上げソフトへの更なる対応
4. html版ページの用意
5. 外国語ページのリニューアル
6. ユニバーサルデザインの維持・向上
7. その他・CMSによるウェブアクセシビリティの確保・リニューアルに伴うページ移行時に移行ルールを策定等

所感 †

• 現状調査して
• 計画、指針をたてて
• 実装して

というアクセシビリティのPDCAサイクルを考えていく際の参考になる。
アクセシビリティ対応は、まだまだ試行錯誤しながらの部分が多い。
世の中のいろんなサイトでこういう資料が公開されていけば、アクセシビリティ向上の底上げがされていく。

アクセシビリティメモ/社内用「アクセシビリティJIS(JIS X 8341-3) 理解度テスト2」をシェア (181d)

アクセシビリティメモ/社内用「アクセシビリティJIS(JIS X 8341-3) 理解度テスト2」をシェア

竹村です。

• アークウェブに新入社員が増えたため、以前もやったアクセシビリティJIS(JIS X 8341-3)について再度勉強し直しました。

• 今回も、勉強後にはペーパーテストをすると伝えてあり、90%で合格。それまでは何度も追試するスタイルで試験を行いました。

• 以前のテストに数問を追加し、全50問になっています。こちらも公開することにしました。

「アクセシビリティJIS(JIS X 8341-3) 理解度テスト パート2」のファイル †

http://www.ark-web.jp/accessibility/attach/Accessibility%2dJIS%28JIS%20X%208341%2d3%29%2dExam2%2edoc

• Microsoft Word形式 約155KB

ご留意いただきたい点 †

• 内容に誤りがあるかもしれません。お気づきの点があればぜひご指摘ください。
• 解答・解説は付けていません。JIS X 8341-3の原文や「よくわかる ウェブ・アクセシビリティ&ユーザビリティ(改訂版)」などの解説書にあたればわかると思います。

---

コメント欄 †

お名前:

Zen Cart日本語版のアクセシビリティ対応/目視チェック（JIS2009） (278d)

Zen Cart日本語版のアクセシビリティ対応/目視チェック（JIS2009）

テスト結果 †

7.1.3.3 感覚的な特徴に関する達成基準(A) †

- コンテンツを理解し操作するための説明を、形、大きさ、視覚的な位置、方向、または音のような要素が人間の感覚に示す特徴だけで提供してはならない。

- 次アクション：JIS:2004より強化されている。再度テストを、
-→ JIS:2004に含まれなかった「大きさ」「方向」を中心に画像をチェックし、該当箇所があれば新デザインに反映させる-

• セール時打ち消し線：HPRのチェックで対応済
• 他特に問題ないと思われる。

7.2.4.4 文脈におけるリンクの目的に関する達成基準(A) †

- それぞれのリンクの目的が、リンクのテキストだけから、又はリンクのテキストとプログラムで解釈可能なリンクの文脈とをあわせたものから解釈できなければならない。ただし、リンクの目的が一般的にみて利用者にとって曖昧な場合は除く。

- 次アクション：基本的なことであり大丈夫だと思うが、一応チェックを。
→ 7.2.4.6と合わせて今一度確認する。画像リンクに関してはのaltをチェックしていると思うので、テキストリンクについて確認。

一通り見たが大丈夫だと思われる。
今後新標準テンプレを作っていく際に気付いた所はブラッシュアップしていく。

7.2.4.6 見出し及びラベルに関する達成基準(AA) †

- 見出し及びラベルは、主題または目的を説明していなければならない。

- 次アクション：一応再確認する
→ 7.2.4.4と合わせて今一度確認する。（ラベルは分かりやすいか？）

一通り見たが大丈夫だと思われる。
今後新標準テンプレを作っていく際に気付いた所はブラッシュアップしていく。

7.3.2.2 ユーザーインタフェース要素による状況の変化に関する達成基準(A) †

- 「利用者が使用する前にその挙動を知らせてある場合を除いて、ユーザーインタフェース要素の設定を変更することで状況の変化を引き起こしてはならない。」

- 次アクション：付属文書を見て、意味を確かめる。その上で必要なら追加テストをする。
→ JIS:2004の5.3e)、5.3a)にあたる。特に5.3e)。

5.3e) 利用者の意思に反して、又は利用者が認識若しくは予期することが困難な形で、
      ページの全部若しくは一部を自動的に更新したり、別のページに移動したり、
      又は新しいページを開いたりしてはならない。

→ 自動更新、ページの自動移動はないのでOK
→ 【結論】予告なしに別ウィンドウを立ち上げている所がないかをチェックする

ダウンロード商品例（複数ファイル） [DOWNLOAD2] - ￥5,000 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_info&cPath=100&products_id=226

• このページに限らず、商品の「拡大表示」は別ウィンドウを立ち上げる予告がない。

7.3.2.4 一貫した識別性に関する達成基準(AA) †

- ウェブページ一式の中で同じ機能性を有する構成要素は、一貫性を持たせて識別できなければならない。

- 次アクション：付属文書をよく読み、必要なら追加テストする。

7.3.2.4は一貫性のある「ラベル」「名前」そして「代替テキスト」を使うことが求められている。
「付属書E（JIS:2004とJIS:2009の比較）より」

→ ラベル、代替テキストに一貫性があるかチェックする

現時点では良しとする。
今後の継続的チューニング事項。

以下、入力箇所のチェック（会員登録、チェックアウトプロセス） †

7.3.3.1 入力エラー箇所の特定に関する達成基準(A) †

- 入力エラーを自動的に発見した場合は、エラーとなっているアイテムを特定し、そのエラーを利用者にテキストで説明しなければならない

- 次アクション；要テスト。
→ 入力が発生するページをテストする
-- 会員登録
-- チェックアウトプロセス

5.3i)と比べて，2009年版は誤った操作を元に戻す手段を具体的に規定している。
等級Aの7.3.3.1はエラーを特定することを求めている。

エラーとなっているアイテムを特定し、そのエラーを利用者にテキストで説明しているが、

• 別ウィンドウ（ダイアログ）でエラー一覧が立ち上がる。（会員登録）

• HPR、PC-Talkerで読まれるか？
  → HPR、PC-Talkerとも読まれた。

7.3.3.2 ラベルまたは説明文に関する達成基準(A) †

- コンテンツが利用者の入力を要求するときには、入力箇所のラベル又は入力方法についての説明文を提供していなければならない。

- 次アクション：2004年では例示だったが、2009年では達成等級「A」になった。要テスト。
→ 入力が発生するページをテストする
-- 会員登録
-- チェックアウトプロセス

7.3.3.2 は利用者が入力エラーを起こさないようにラベルや説明文を提供すること 

• ラベルは良いが、説明文（例示）を入れるべき。（会員登録）

ログイン : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=login

7.3.3.3 入力エラー修正方法の提示に関する達成基準(AA) †

- 入力エラーを自動的に発見した場合は、その修正方法が明らかであれば、その方法を利用者に提示しなければならない。ただし、セキュリティ又はコンテンツの目的を損なう場合は除く。

- 次アクション；要テスト。
→ 入力が発生するページをテストする
-- 会員登録
-- チェックアウトプロセス

7.3.3.3がエラーの修正方法を提示することを求め，

• エラーのダイアログをより分かりやすくする。（会員登録）

ログイン : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=login

• 下記現状のエラー原稿

フォームの処理中にエラーが発生しました。

次の項目を訂正してください:

- 個人情報保護方針に同意される場合はチェックボックスをクリックしてください。
- 性別を選択してください
- 姓は最低1文字以上入力してください
- 名は最低1文字以上入力してください
- 姓ふりがなは最低1文字以上入力してください
- 名ふりがなは最低1文字以上入力してください
- 誕生日は[1970/05/21](西暦/月/日)の書式で入力してください。
- Eメールアドレスは半角で6文字以上入力してください
- 番地 マンション・アパート名は最低1文字以上入力してください
- 郵便番号は最低4文字以上入力してください
- 市町村区名は最低2文字以上入力してください
- 都道府県名は最低2文字以上入力してください
- プルダウンメニューから国名を選択してください
- 電話番号は最低3文字以上入力してください
- パスワードは最低5文字以上入力してください

7.3.3.4 法的義務・金銭的取引・データ変更・回答送信のエラー回避に関する達成基準(AA) †

- 利用者にとって法的な義務又は金銭的な取引が生じる、データのストレージシステムにある利用者が自分で制御可能なデータを変更又は削除する、又は利用者が試験の解答を送信するウェブページでは、次の少なくとも一つが当てはまらなければならない。
a)可逆性　送信は元に戻すことができる。
b)チェック　利用者の入力したデータの入力エラーをチェックし，利用者に修正する機会を提供している。
c)確認　送信を完了する前に，利用者が情報の点検，確認及び修正をするメカニズムが利用可能である。

- 次アクション：JIS:2009でさらに明文化されたので、付属文書を読み、必要ならテストをする。
→ 入力が発生するページをテストする（上のa)、b)、c)の基準を満たしているか。）
-- 会員登録
-- チェックアウトプロセス

7.3.3.4が法的義務・金銭的な取引などが生じた場合に限定して，エラーの回避を求めている。

会員登録

ログイン : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=login

a)可逆性　送信は元に戻すことができる。

→ 現状手段は明示されていない。

b)チェック　利用者の入力したデータの入力エラーをチェックし，利用者に修正する機会を提供している。

→ OK！ 入力エラーがダイアログで出る。エラーがなくなるまでは次の画面に遷移しない。

c)確認　送信を完了する前に，利用者が情報の点検，確認及び修正をするメカニズムが利用可能である。

→ 現状確認画面はない。b)の要件は満たしているが、ユーザビリティ的には、確認画面があった方が良い。新標準テンプレでは確認画面を用意したい。

チェックアウトプロセス

c)確認　送信を完了する前に，利用者が情報の点検，確認及び修正をするメカニズムが利用可能である。

→ OK！ 確認画面があり、各項目を修正できる。

Zen Cart日本語版のアクセシビリティ対応/PC-Talkerでチェック (278d)

Zen Cart日本語版のアクセシビリティ対応/PC-Talkerでチェック

JIS:2009 追加テスト基準 †

7.1.3.2 意味のある順序に関する達成基準(A) †

• コンテンツが提供されている順序がその意味に影響を及ぼすときには正確な読み上げ順序をプログラムで解釈可能にしなければならない。

• 次アクション：表以外もそのようになっているかテストする

7.2.4.1 ブロック・スキップに関する達成基準(A) †

• 複数のウェブページ上で繰り返されているコンテンツのブロックを通過できるメカニズムが利用可能でなければならない。
• 次アクション：これはメニューとリンク以外もカバーしている? 付属文書にあたり、必要なら追加テストを。

• HPRより読み上げ能力が高い（個人の好みに合わせて細かく設定もできる）

• 問題点はHPRのテストとキーボード操作のテストでほとんどカバーできている。

• テキストボックス、チェックボックスの読み上げの不具合
  • 入力項目（テキストボックス、チェックボックス、ラジオボタン）があった場合、「-直前のテキスト-の文字入力」と読んでしまう。直前のテキストが入力項目と一致しない場合に不具合が起こる。これはPC-Talkerの設定の問題？

具体的には以下。

Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=index

• ヘッダーの検索ボックスにフォーカスすると「ログインの文字入力」と読み上げる。（ログイン中は「マイページの文字入力」と読み上げる。）
  → 「検索の文字入力」にする。「検索キーワードの入力」とできる？（たぶん難しい）

ショッピングカート : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=shopping_cart

• 数量入力のテキストボックスが「XXXX円の文字入力」と読まれる
  → 「数量の文字入力」にする

• ゴミ箱の下のチェックボックスが「小計：XXXX円の切り替え（チェック無し）」と読まれる正しく読まれない。
  → 「カートから削除するの切り替え」が妥当か。

• テーブル：左上から順番に読まれ、今読まれている項目が何なのか分かりにくい。
  → マークアップを見直した方が良いのでは？

音声ブラウザとth要素
http://www.kanzaki.com/docs/html/tbl-access.html#th-el

scope属性
http://www.kanzaki.com/docs/html/tbl-access.html#scope

お届け先と配送方法を記入してください : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=checkout_shipping¶

• 定額料金のラジオボタンの所で「日本通運ペリカン便 (1箱 重量：3.25kg)の選択」と読んでしまう。
  → 定額料金のラジオボタンの右に「定額料金」というテキストを追加

お届け先を変更する : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=checkout_confirmation

• 「続ける」ボタンが最後に読まれるように

請求先住所を変更してください : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=checkout_payment_address

• 「続ける」ボタンが最後に読まれるように

ご注文内容を確認してください : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=checkout_confirmation

• IE6でレイアウトが崩れているっぽい（FF3の方が良い）

• 「配送先住所」や「ご請求先住所」など各ブロックで「編集」が見出しの次に読まれてしまう。
  → 「編集」がブロックの中で最後に読まれるようにしたい。

• カートの内容のテーブル
  • マークアップの見直し（上記同様）

• 「ご注文の確定」ボタンが「最終確認　→ この内容で〜」の前に読まれる。
  → 順番を入れ替え、「ご注文の確定」ボタンが最後に読まれるように。

• カートの内容のテーブル
  • マークアップの見直し（上記同様）

• 「ご注文の確定」ボタンが「最終確認　→ この内容で〜」の前に読まれる。
  → 順番を入れ替え、「ご注文の確定」ボタンが最後に読まれるように。

禅太郎's セレクト（リンク商品） : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=index&cPath=21

• 分類のプルダウン： (キーボードで操作する場合)選ぶと同時にリンク先に飛んでしまうため、最初のメニュー意外を選べない。
  ⇒ 実行ボタンをつける
  （1. プルダウンで選択 → 2. 実行ボタン[GO!] をクリックしてリンク先へ）

ダウンロード商品例（複数ファイル） [DOWNLOAD2] - 5,000円 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=product_info&cPath=100&products_id=226

• 読み上げの順番： [カートに加える]ボタン → モデル: DOWNLOAD2、1000 在庫量 → 「商品タイプを選択して下さい: マニュアル〜ソフト本体」
  ⇒ モデル: DOWNLOAD2、1000 在庫量 → 「商品タイプを選択して下さい: マニュアル〜ソフト本体」 → 「カートに入れる〜」 に。

おすすめ商品 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=featured_products&disp_order=1

• プルダウンメニューに実行ボタンを。

送料無料タイプ商品の例 [TYPE_P_FREESHIP] - 4,000円 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=product_free_shipping_info&cPath=98&products_id=217

• 読み上げの順番： モデル: DOWNLOAD2、1000 在庫量 → 「カラーを選択してください〜」 → 「カートに入れる〜」 に。

マイページ : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=account

• テーブルのマークアップ

音声ブラウザとth要素
http://www.kanzaki.com/docs/html/tbl-access.html#th-el

scope属性
http://www.kanzaki.com/docs/html/tbl-access.html#scope

ご注文情報 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=account_history_info&order_id=13

• テーブルのマークアップ

詳細検索 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=advanced_search

• 「検索条件を選択してください」の入力ボックス
  • 前に読んでいた「検索ヘルプ[?]」を引きずって「検索ヘルプ[?]の文字入力」と読んでしまう。
    ⇒ PC-Talkerの仕様による。共通ヘッダの検索入力ボックスと同じ現象。
    　これを避けるには、テキストボックスの前に「検索条件」というテキストを入れるしかない？

Zen Cart日本語版のアクセシビリティ対応/現標準テンプレートをキーボード操作でチェック (302d)

Zen Cart日本語版のアクセシビリティ対応/現標準テンプレートをキーボード操作でチェック

JIS:2009 追加テスト基準 †

7.1.3.2 意味のある順序に関する達成基準(A) †

• コンテンツが提供されている順序がその意味に影響を及ぼすときには正確な読み上げ順序をプログラムで解釈可能にしなければならない。

• 次アクション：表以外もそのようになっているかテストする

7.2.4.1 ブロック・スキップに関する達成基準(A) †

• 複数のウェブページ上で繰り返されているコンテンツのブロックを通過できるメカニズムが利用可能でなければならない。
• 次アクション：これはメニューとリンク以外もカバーしている? 付属文書にあたり、必要なら追加テストを。

• HPRより読み上げ能力が高い（個人の好みに合わせて細かく設定もできる）

• 問題点はHPRのテスト( https://redmine.ark-web.jp/issues/show/3714 )とキーボード操作のテスト( https://redmine.ark-web.jp/issues/show/3716 )でほとんどカバーできている。

• テキストボックス、チェックボックスの読み上げの不具合
  • 入力項目（テキストボックス、チェックボックス、ラジオボタン）があった場合、「-直前のテキスト-の文字入力」と読んでしまう。直前のテキストが入力項目と一致しない場合に不具合が起こる。これはPC-Talkerの設定の問題？

具体的には以下。

Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=index

• ヘッダーの検索ボックスにフォーカスすると「ログインの文字入力」と読み上げる。（ログイン中は「マイページの文字入力」と読み上げる。）
  → 「検索の文字入力」にする。「検索キーワードの入力」とできる？（たぶん難しい）

ショッピングカート : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=shopping_cart

• 数量入力のテキストボックスが「XXXX円の文字入力」と読まれる
  → 「数量の文字入力」にする

• ゴミ箱の下のチェックボックスが「小計：XXXX円の切り替え（チェック無し）」と読まれる正しく読まれない。
  → 「カートから削除するの切り替え」が妥当か。

• テーブル：左上から順番に読まれ、今読まれている項目が何なのか分かりにくい。
  → マークアップを見直した方が良いのでは？

音声ブラウザとth要素
http://www.kanzaki.com/docs/html/tbl-access.html#th-el

scope属性
http://www.kanzaki.com/docs/html/tbl-access.html#scope

お届け先と配送方法を記入してください : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=checkout_shipping¶

• 定額料金のラジオボタンの所で「日本通運ペリカン便 (1箱 重量：3.25kg)の選択」と読んでしまう。
  → 定額料金のラジオボタンの右に「定額料金」というテキストを追加

お届け先を変更する : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=checkout_confirmation

• 「続ける」ボタンが最後に読まれるように

請求先住所を変更してください : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=checkout_payment_address

• 「続ける」ボタンが最後に読まれるように

ご注文内容を確認してください : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.ark-web.jp/zen-template-project/index.php?main_page=checkout_confirmation

• IE6でレイアウトが崩れているっぽい（FF3の方が良い）

• 「配送先住所」や「ご請求先住所」など各ブロックで「編集」が見出しの次に読まれてしまう。
  → 「編集」がブロックの中で最後に読まれるようにしたい。

• カートの内容のテーブル
  • マークアップの見直し（上記同様）

• 「ご注文の確定」ボタンが「最終確認　→ この内容で〜」の前に読まれる。
  → 順番を入れ替え、「ご注文の確定」ボタンが最後に読まれるように。

Zen Cart日本語版のアクセシビリティ対応/JIS：2009(改正原案)への追加対応 (358d)

Zen Cart日本語版のアクセシビリティ対応/JIS：2009(改正原案)への追加対応

目次

• Zen Cart日本語版のアクセシビリティ対応/JIS：2009(改正原案)への追加対応 (358d)
• Zen Cartのアクセシブル化：やってきたこと、やるべきこと
• JIS:2004とJIS:2009を比べて追加でテストすべきことをピックアップ
  • 7.1.3.1 情報及び関係性に関する達成基準(A)
  • 7.1.3.2 意味のある順序に関する達成基準(A)
  • 7.1.3.3 感覚的な特徴に関する達成基準(A)
  • 7.1.4.3 最低限のコントラストに関する達成基準(AA)
  • 7.1.4.4 テキストのサイズ変更に関する達成基準(AA)
  • 7.1.4.5 画像化された文字に関する達成基準(AA)
  • 7.2.1.1 キーボード操作に関する達成基準(A)
  • 7.2.1.2 フォーカス移動に関する達成基準(A)
  • 7.2.4.1 ブロック・スキップに関する達成基準(A)
  • 7.2.4.3 フォーカス順序に関する達成基準
  • 7.2.4.4 文脈におけるリンクの目的に関する達成基準(A)
  • 7.2.4.5 複数のページ探索手段に関する達成基準(AA)
  • 7.2.4.6 見出し及びラベルに関する達成基準(AA)
  • 7.2.4.7 視覚的に認識可能なフォーカスに関する達成基準(AA)
  • 7.3.1.2 部分的に用いられている言語に関する達成基準(A)
  • 7.3.2.1 オン・フォーカスに関する達成基準
  • 7.3.2.2 ユーザーインタフェース要素による状況の変化に関する達成基準(A)
  • 7.3.2.4 一貫した識別性に関する達成基準(AA
  • 7.3.3.1 入力エラー箇所の特定に関する達成基準(A)
  • 7.3.3.2 ラベルまたは説明文に関する達成基準(A)
  • 7.3.3.3 入力エラー修正方法の提示に関する達成基準(AA)
  • 7.3.3.4 法的義務・金銭的取引・データ変更・回答送信のエラー回避に関する達成基準(AA)
• コメントがあればどうぞ

Zen Cartのアクセシブル化：やってきたこと、やるべきこと †

• Zen Cart日本語版のJIS X 8341-3:2004対応のテストを終え、要修正点を出した
• 次に、JIS:2009の改正原案を元に、新JISで達成基準「AA(ダブルエー)」を満たすために必要な追加テスト項目をピックアップしよう

JIS:2004とJIS:2009を比べて追加でテストすべきことをピックアップ †

• あくまで一般論ではなく、Zen Cartを対象とした場合

7.1.3.1 情報及び関係性に関する達成基準(A) †

• 表現を通じて伝達されている情報、構造、及び関係性が、プログラムで解釈可能でなければならない。又は、それらがテキストで提供されていなければならない。

• 次アクション：解釈や達成基準について、付属文書を読み、必要ならテスト方法を決める

7.1.3.2 意味のある順序に関する達成基準(A) †

• コンテンツが提供されている順序がその意味に影響を及ぼすときには正確な読み上げ順序をプログラムで解釈可能にしなければならない。

• 次アクション：表以外もそのようになっているかもう一度テストする

7.1.3.3 感覚的な特徴に関する達成基準(A) †

• コンテンツを理解し操作するための説明を、形、大きさ、視覚的な位置、方向、または音のような要素が人間の感覚に示す特徴だけで提供してはならない。

• 次アクション：JIS:2004より強化されている。再度テストを、

7.1.4.3 最低限のコントラストに関する達成基準(AA) †

• テキスト及び画像化された文字の視覚的な表現には、少なくとも4.5:1のコントラスト比がなくてはならない。ただし、次に挙げる場合は除く。
  a)大きな文字(少なくとも3:1)
  b)付随的(アクティブでないUIの一部、装飾が目的、視覚的に確認できない、重要な他の視覚的なコンテンツを含む写真の一部)
  c)ロゴタイプ

• 次アクション：

7.1.4.4 テキストのサイズ変更に関する達成基準(AA) †

• コンテンツ又は機能を損なうことなく、テキストを支援技術なしで200%までサイズ変更できなければならない。ただし、キャプション及び画像化された文字は除く。

• 次アクション：追加テストを行う。

7.1.4.5 画像化された文字に関する達成基準(AA) †

• 使用している技術で意図した視覚的な表現が可能である場合は、画像化された文字ではなくテキストを用いて情報を伝えなければならない。ただし、次に挙げる場合は除く。
  a)カスタマイズ可能
  b)必要不可欠

• 次アクション：画像ボタンなどは「カスタマイズ可能」に当てはまると思うが、一応付属文書にあたり、必要なら追加チェックする。

7.2.1.1 キーボード操作に関する達成基準(A) †

• コンテンツのすべての機能は、個々のキーストロークに特定のタイミングを要することなくキーボード・インタフェースを通じて操作可能でなければならない。ただし、その根本的な機能が、単に利用者の動作の終点に依存しておらず、利用者の動作による軌跡に依存して実現されている場合は除く。

• 次アクション：なし? Zen Cartでは特定のタイミングに依存する操作はないので。

7.2.1.2 フォーカス移動に関する達成基準(A) †

• キーボードインタフェースを用いて、キーボードフォーカスをそのページにある構成要素に移動できる場合、キーボードインタフェースだけを用いてその構成要素からフォーカスを外すことが可能でなければならない。又、もしその操作が矢印キー、又はTabキー以外の操作を必要とするならば、キーボードフォーカスをその構成要素から外す方法を利用者に知らせなければならない。

• 次アクション：JIS:2004対応テストでカバー済み。次アクションなし

7.2.4.1 ブロック・スキップに関する達成基準(A) †

• 複数のウェブページ上で繰り返されているコンテンツのブロックを通過できるメカニズムが利用可能でなければならない。

• 次アクション：これはメニューとリンク以外もカバーしている? 付属文書にあたり、必要なら追加テストを。

7.2.4.3 フォーカス順序に関する達成基準 †

• ウェブページが順番にナビゲートできて、そのナビゲーション順序が意味又は操作に影響を及ぼす場合、フォーカス可能な構成要素は意味及び操作性を保持した順序でフォーカスを受け取らなければならない。

• 次アクション：表以外もそのようになっているかもう一度テストする

7.2.4.4 文脈におけるリンクの目的に関する達成基準(A) †

• それぞれのリンクの目的が、リンクのテキストだけから、又はリンクのテキストとプログラムで解釈可能なリンクの文脈とをあわせたものから解釈できなければならない。ただし、リンクの目的が一般的にみて利用者にとって曖昧な場合は除く。

• 次アクション：基本的なことであり大丈夫だと思うが、一応チェックを。

7.2.4.5 複数のページ探索手段に関する達成基準(AA) †

• ウェブページ一式の中からあるウェブページを見つけることのできる手段が一つよりも多くある。ただし。ウェブページがプロセスの結果又はプロセスの中の一つのステップである場合は除く。

• 次アクション：ナビゲーションはあり、検索窓はあるから大丈夫だと思われる。ショッピングカートのチェックアウトプロセスについては「注記1」で言及されているし。

7.2.4.6 見出し及びラベルに関する達成基準(AA) †

• 見出し及びラベルは、主題または目的を説明していなければならない。

• 次アクション：一応再確認する

7.2.4.7 視覚的に認識可能なフォーカスに関する達成基準(AA) †

• キーボード操作が可能なユーザーインタフェースには、キーボード・フォーカスの表示が視覚的に認識できる操作モードがなければならない。

• 次アクション：あると思うが、念のため協議。

7.3.1.2 部分的に用いられている言語に関する達成基準(A) †

• コンテンツの一説または語句それぞれの自然言語がプログラムで解釈できなければならない。

• 次アクション：多言語混在が前提のZen Cartでは、達成するには修正箇所が多い基準。付属文書を読み、対応の要否を決める。

7.3.2.1 オン・フォーカスに関する達成基準 †

• 「あらゆる要素がフォーカスを受け取るとき、状況の変化を引き起こしてはならない。」

• 次アクション：JIS:2004でカバー済み。問題点は判明している。

7.3.2.2 ユーザーインタフェース要素による状況の変化に関する達成基準(A) †

• 「利用者が使用する前にその挙動を知らせてある場合を除いて、ユーザーインタフェース要素の設定を変更することで状況の変化を引き起こしてはならない。」

• 次アクション：付属文書を見て、意味を確かめる。その上で必要なら追加テストをする。

7.3.2.4 一貫した識別性に関する達成基準(AA †

• ウェブページ一式の中で同じ機能性を有する構成要素は、一貫性を持たせて識別できなければならない。

• 次アクション：付属文書をよく読み、必要なら追加テストする。

7.3.3.1 入力エラー箇所の特定に関する達成基準(A) †

• 入力エラーを自動的に発見した場合は、エラーとなっているアイテムを特定し、そのエラーを利用者にテキストで説明しなければならない

• 次アクション；要テスト。

7.3.3.2 ラベルまたは説明文に関する達成基準(A) †

• コンテンツが利用者の入力を要求するときには、入力箇所のラベル又は入力方法についての説明文を提供していなければならない。

• 次アクション：2004年では例示だったが、2009年では達成等級「A」になった。要テスト。

7.3.3.3 入力エラー修正方法の提示に関する達成基準(AA) †

• 入力エラーを自動的に発見した場合は、その修正方法が明らかであれば、その方法を利用者に提示しなければならない。ただし、セキュリティ又はコンテンツの目的を損なう場合は除く。

• 次アクション；要テスト。

7.3.3.4 法的義務・金銭的取引・データ変更・回答送信のエラー回避に関する達成基準(AA) †

• 利用者にとって法的な義務又は金銭的な取引が生じる、データのストレージシステムにある利用者が自分で制御可能なデータを変更又は削除する、又は利用者が試験の解答を送信するウェブページでは、次の少なくとも一つが当てはまらなければならない。
  a)可逆性
  b)チェック
  c)確認

• 次アクション：JIS:2009でさらに明文化されたので、付属文書を読み、必要ならテストをする。

---

コメントがあればどうぞ †

お名前:

Zen Cart日本語版のアクセシビリティ対応/現標準テンプレートを「富士通アクセシビリティ・アシスタンス」でチェック (363d)

Zen Cart日本語版のアクセシビリティ対応/現標準テンプレートを「富士通アクセシビリティ・アシスタンス」でチェック

Zen Cart：2009年はZen Cart2.0、アクセシビリティ対応、管理画面の改善に取り組みます : アークウェブ ビジネスブログ
http://www.ark-web.jp/blog/archives/2009/02/zen-cart_20_ark-web.html

現在Zen Cartの標準テンプレートをチェック改善中です。

手順 †

富士通アクセシビリティ・アシスタンス : 富士通
http://jp.fujitsu.com/about/design/ud/assistance/

1. WebInspectorでHTMLやCSSファイルのチェック。
2. ColorSelectorで画像化されている文字のコントラストをチェック。
3. 1、2の結果を踏まえ、ColorDoctorでシミュレートして、WebInspectorとColorSelectorでグレースケールや各色覚特性の見え方を目視確認。

WebInspectorによるチェック †

• 検索結果がWebページとして表示されるためここでは割愛いたします

ColorSelectorによるチェック †

• 文字色と背景色をスポイトで指定して判定

• 判定結果の項目
  • 一般（晴眼者）
  • 白内障(弱視者）
  • 第一色覚（赤）(色覚特性)
  • 第二色覚（緑）(色覚特性)
  • 第三色覚（青）(色覚特性)

• 評価は0〜3の4段階
  • 3はOK！ 良くない程度に応じて0〜2の評価

ColorDoctorによるチェック †

• 変換フィルタで画像を変換し目視でチェック
  • グレースケール
  • 第一色覚（赤）
  • 第二色覚（緑）
  • 第三色覚（青）

チェックするページ †

Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=index

ログイン : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=login

Ｔシャツ（白） : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=index&cPath=1
びちっこ [SAMPLE-T08] - ￥4,950 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_info&products_id=9
びちっこ [SAMPLE-T08] - ￥4,950 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_reviews_write&products_id=9

ショッピングカート : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=shopping_cart
Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=popup_shipping_estimator
お届け先と配送方法を記入してください : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=checkout_shipping
お支払い情報を記入してください : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=checkout_payment
請求先住所を変更してください : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=checkout_payment_address
ご注文内容を確認してください : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=checkout_confirmation
ご注文の手続きが完了しました。 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=checkout_success

ダウンロード商品例（複数ファイル） [DOWNLOAD2] - ￥5,000 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_info&cPath=100&products_id=226

マイページ : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account
ご注文履歴 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account_history
登録情報変更 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account_edit
アドレス帳 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=address_book
パスワード変更 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account_password
ニュースレター購読 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account_newsletters
お知らせメール購読 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account_notifications

サイトマップ : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=site_map

検索結果 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=advanced_search_result&search_in_description=1&keyword=%A4%D3%A4%C1%A4%C3%A4%B3
詳細検索 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=advanced_search

お問い合わせ : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=contact_us

ColorSelectorによるチェック結果 †

Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=index

• [ホーム｜ログイン]（グラデ掛かった茶色の帯に白文字）
  • 一般2、白内障1、第二色覚2、第三色覚2

• [EZページ :: 個人情報保護方針(EZページの例) :: シェアード(Shared)ページ(EZページの例) :: Zen Cartについて(EZページの例) ]訪問前（グラデ掛かった茶色の帯に青文字）
  • 白内障2、第一色覚1、第二色覚2

• [EZページ :: 個人情報保護方針(EZページの例) :: シェアード(Shared)ページ(EZページの例) :: Zen Cartについて(EZページの例) ]訪問後（グラデ掛かった茶色の帯に水色文字）
  • 一般0、白内障0、第一色覚0、第二色覚0、第三色覚0

びちっこ [SAMPLE-T08] - ￥4,950 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_info&products_id=9

• [カートに加える]のグリーンのカートのイラストと背景
  • 一般2、白内障0、第二色覚2、第三色覚2

• [レビューページへ]の水色の吹き出しと背景
  • 一般2、白内障1、第二色覚2、第三色覚2

• [友達に知らせる]の水色の人型と背景
  • 白内障2

びちっこ [SAMPLE-T08] - ￥4,950 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_reviews_write&products_id=9

• [商品の詳細ページへ]の明るい水色の部分と背景
  • 一般1、白内障0、第二色覚2、第三色覚2

ショッピングカート : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=shopping_cart

• [ライトグリーンと白のリフレッシュボタン]
  • 一般2、白内障2、第二色覚2、第三色覚2

• [ゴミ箱アイコン]
  • 白内障2

ダウンロード商品例（複数ファイル） [DOWNLOAD2] - ￥5,000 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_info&cPath=100&products_id=226

• 商品画像
  • 一般2、白内障2、第二色覚2、第三色覚2

Zen Cart日本語版のアクセシビリティ対応/ホームページリーダーのチェック+α (369d)

Zen Cart日本語版のアクセシビリティ対応/ホームページリーダーのチェック+α

Zen CartをHPR（ホームページリーダー）でチェックした結果と、気づいたところをメモ書きですがwikiります。
これらはできるところから直していきます。

まずはホーム。

Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=index

共通 †

• 長すぐる。。//顧客案件ではカテゴリ数は8つ以内にしたほうがいいぜよ
• ロゴのalt「Powered by Zen Cart[日本語版]: The Art of E-Commerce [home link]」

• [home link]→[ホームにもどる]　//ホームだけ出さないってのは無理か

• スキップメニューを設ける
• ヘッダのカテゴリの前に「カテゴリ」と隠しテキストがあるとよい
• 精算する≫(右二重角引用符と読み上げ)　→ ≫は使わない
• マークアップ順：左、中央、右の順だが中央、左、右の順がよい（IE6でリキッドは捨てる）
• \マーク読み上げない！！！！！！！！！！！。\4,180→「4,180円」
• 取り消し線はわからないので「5,000円（のところ）4,000円」（カッコはCSSで非表示？）などに
• （割引: 50%OFF　はちゃんと読む）
• 商品画像（商品名）、商品名（商品名）と読む→「商品画像（商品名の画像）、商品名（商品名）」のほうが？
• 予約販売など、日付が2009/09/09表記→「2009年09月09日」
• 「1から9 を表示中 (特価商品の数: 21)」は日本語としておかしい→「特価商品 全21商品のうち 1件目から9件目を表示中)」とか？
• この商品は2007年01月18日(木)に登録されました。
  　→この商品は2007年01月18日 木曜日に登録されました。

サイドボックス †

• 「Ｔシャツ（カラー）-> (38)」の意味がわからない

• 「->」ってそもそもいるんだっけ？文字列でなくデザインで処理？
• （38商品）という表記にする？

• moreはないだろ。→「一覧」に
• 星のalt「5点　5点満点」→「平均評価：5点満点中5点」に。
• メーカー、音楽ジャンル、レコード会社、通貨は実行ボタンが必要（キーボードで項目変更できない）
• 「書類」ってラベリングはどうなの？
• 「現在 5 人のゲスト がご来店中です。（5ひとのゲスト、と読む）」→5と人の間の半角スペーストル

ログイン †

ログイン : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=login

• （このページはラベリングを再考したほうがよい。晴眼者にとってもわかりにくい）
• （フォーカスがメールアドレスのテキストフィールドに行っているので、途中の余計なものを読み上げないのはいいのだが、「Eメールアドレス」と項目名を読み上げないので、この点はわかりにくいかも？）
• 【初めてのご来店・未登録の方は】を読み上げる直前で、「内部エラーが発生しました」と言われる　（※要調査）
• 赤字「- 必須項目」→「必須項目はすべて入力してください」とかに？
• 個人情報保護方針は<link>こちら</link>。→「<link>個人情報保護方針のページを確認ください</link>」とか？

• というかここ文言わかりにくくないか？同意される場合、ってなんか変。なにをして欲しいのかが不明瞭。

• 「住所、男性、女性」と読まれるので、「住所：男性or女性」のように聞こえる

• 性別はここにあるべきなのか？もしくはラベリング再考。

• 姓（漢字）/姓（ひらがな）/名（漢字）/名（ひらがな）/
• 住所ってラベリングはどうなの？
• 年齢の確認ってラベリングはどうなの？

• 「*」が「アスタリスク」と読まれる

• →「必須」と書く
• →項目見出し内に移動する
• →入力例も項目見出し内に移動する

• (記入例 1970/05/21)→西暦で入力（1970/05/21）　//ここは年月日で入力したらあかんのか。。スラッシュ読みまへんがな。項目分けるとか？

• 「ログイン」というラベルだとここでログインできるように錯覚する。

• 「ログイン情報？」
• 「ログインするときに使うメールアドレスとパスワードを入力してください」という説明文が欲しい

• 「 [チェックなし。] ニュースレターを購読する[ON。] HTML形式[OFF。] テキスト形式[送信: 画像ボタン。] 」と読む

• 項目が連続して聞こえる。追加説明文などが必要。

ログイン（エラー表示） †

• フォーカスがメールアドレスに行っていることが逆効果に。
  　エラーメッセージがメールアドレス欄より前なので、読み上げられることがない。

パスワードを忘れたら †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=password_forgotten

• 必須項目は項目見出し内に

パスワードを忘れたら（エラー表示） †

• エラーメッセージまでの距離が長い。。

パスワードを忘れたら（完了表示） †

• ログイン画面にリダイレクトするのだが、フォーカスがメールアドレスなのでその上にある完了メッセージに気づかない

商品一覧 †

Ｔシャツ（白） : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=index&cPath=1

• サブカテゴリの前になにか説明いらないのかな？

• 商品画像、商品名の繰り返しなので、商品画像のaltはいらない？
• \マークは読まれないので「1,000円」の表記
• 「2月の新着商品 - Ｔシャツ（白）」真ん中の「-（ハイフン）」はマイナスと読まれるのでなし。→なにがいい？中黒？

商品詳細 †

びちっこ [SAMPLE-T08] - ￥4,950 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_info&products_id=9

• カテゴリ画像もaltなしでよい？
• 商品2/4（商品にいよん）→ 「4件中2件目の商品」とか？
• 「前へ」「商品リストへ戻る」「次へ」が何を指しているかわからない

• →　「前の商品へ」「猫シリーズ（白）トップにもどる」「次の商品へ」とか？

• 円マーク
• カートに入れる[1]　→　カートに入れる　個数：[1]

• 「この商品をお求めの客様はこんな商品もお求めです。」→「この商品をお求めのお客様はこんな商品もお求めです。」

レビューを書く †

びちっこ [SAMPLE-T08] - ￥4,950 : Zen Cart [日本語版] :, The Art of E-commerce
http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_reviews_write&products_id=9

• 星が読み上げられない。altに「☆」とか入っている→「評価1」「評価5」に
• 注意はテキストエリアの上にもってくる
• （//レビューページへボタンで、レビュー全体に行くの？その商品のレビューじゃないの？）

レビュー（レビュー全体） †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=reviews

• 1から2 を表示中 (レビュー数: 2)　→「全レビュー2件のうち 1件目から2件目を表示中)」
• 星がまったく読み上げられない
• 「登録日: 2008/11/18」→「登録日: 2008年11月18日」
• 「レビューを読む」は「続きを読む」の意味らしい。。わかりにくい。「このレビューの続きを読む」？　//ボタンに入らない。
• 「レビューを読む」「商品の詳細情報へ」はブロックの最後にマークアップすべき
• alt「この商品レビューを読む」or「びちっこのレビューを読む」、「この商品の詳細情報へ」or「びちっこの詳細情報へ」にする？

レビュー（商品のレビュー個別詳細） †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_reviews_info&products_id=51&reviews_id=6

• レビュー（レビュー全体）と同じ

レビュー（商品のレビュー一覧） †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_reviews&products_id=51

• レビュー（レビュー全体）と同じ

ショッピングカート †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=shopping_cart

• （ここ晴眼者でもわかりにくいかも）
• 金額表記は「4,000円」
• 品名　単価　数量　合計　ゴミ箱　の順番に変更すべき
• 商品画像のaltはなしか、○○の画像にする？
• 更新アイコンボタンalt [ハイライト表示されている数量を訂正しこのボタンをクリックしてください。]→[数量を訂正しこのボタンをクリックしてください。]？　//だれかー
• (HPRがtableの読み上げのとき、「1　数量」「4,000円　合計」と読むのは仕様なんだろうけど違和感があるなあ。。)
• ゴミ箱のalt[このアイコンをクリックするとこの商品がカートから削除されます。。]→「（商品名）をカートから削除する」
• 「ヘルプ（新しいウィンドウで開きます）」に。
• というか、ヘルプの内容はincludes/languages/japanese/shopping_cart.php にあらかじめ書いておくとか。。
• 一括更新できることを書く。「このカートでは商品の数量変更と削除を一括することができます。1.数量変更の場合は、数量フィールドに数値を入力します。2.削除したい商品のチェックボックスをを選択します。3.最後に一括更新ボタンをクリックします。これで、カートの中身を一度で更新することができます」とか
• 送料計算ボタンalt→「送料計算（新しいウィンドウで開きます）」
• 下にある更新ボタンは文字ボタンにして、alt「カートの中身を一括更新する」
• カートを更新したときに更新したことがわからない

ショッピングカートのヘルプ †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=info_shopping_cart

• 日本語としてわかりづらいわー

送料計算 †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=popup_shipping_estimator

• 金額表記は「4,000円」

お届け先と配送方法を記入してください : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=checkout_shipping

• 読み上げ順が、住所変更ボタン、住所、「ご注文の品物は左記の住所にお届けします。...」になっているので、
  • 「ご注文の品物は左記の住所にお届けします。...」、住所、住所変更ボタン、に変更
• 文言変更「ご注文の品物は以下の住所にお届けします。お届け先の変更ボタンをクリックしてお届け先を変更できます。」
• 「住所を変更」は「お届け先の変更」に？　//画像共通だったりする？
• 「次画面に進んでください->お支払い方法を選択」→「次の画面（お支払い方法を選択）に進んでください」
• 「注文手続きへ」ボタンは一番最後に移動（左テキストよりソース上うしろに）
• 「注文手続きへ」ボタンは、ボタン自体を「注文手続きを続ける」に

• 金額表記は「4,000円」
• 日本通運ペリカン便 (1 x 4.65kg) ってどういう意味？「日本通運ペリカン便 (1箱　重量：4.65kg) 」？？
• 「お届け時間帯」→「お届け時間帯の指定」
• 「United Parcel Service」と「United States Postal Service」の前で「内部エラーが発生しました」と言われる

お支払い情報を記入してください : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=checkout_payment

• ご請求先住所:（ごせいきゅうせんじゅうしょ）と読む
• 住所変更ボタン→住所→説明文なっているので、
  • 説明文→住所→住所変更ボタン、に変更
• 説明文文言変更「ご請求先住所は以下の通りです。クレジットカードをご利用の場合はカード会社にご登録の住所と同じ住所にしてください。住所を変更される場合は「住所の変更」ボタンをクリックしてください。」
• 総額のところ、ソース上「金額→項目」の順になっているのを「項目→金額」に修正
• 文言変更「お客様のクーポンコードを引き換えコードの欄に入力してください。クーポンは合計に対して適用され、続けるをクリックした後カートに反映されます。」
• お支払い方法を選択してくださいのあとに、選べる種類を列挙したい
• REMISE（りまいず）と読まれる。REMISE（ルミーズ）と書く？
• 「次画面に進んでください->お支払い方法を選択」→「次の画面（ご注文の最終確認）に進んでください」
• 「注文手続きへ」ボタンは一番最後に移動（左テキストよりソース上うしろに）
• 「注文手続きへ」ボタンは、ボタン自体を「注文手続きを続ける」に

請求先住所を変更してください : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=checkout_payment_address

• 住所、説明文「現在設定されているご請求先住所です。...」の順になっているので、
  　説明文、住所にソース順を変更する
• 「*」は「必須項目」とし、項目名内に移動する
• 姓ふりがな→姓ひらがな、名ふりがな→名ひらがな

ご注文内容を確認してください : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=checkout_confirmation

• 配送先→請求先の順に並ぶべき（左右入れ替え、ソース上も）
• 編集をクリックしてダイレクトに住所変更画面に行かないのが困惑する
  • 見出しがもうひとついる？「お届け先と配送方法」「お支払い情報」
• カートの内容
  • 品名、数量、税額（？）、合計の順に変更
  • 小計〜合計の行、項目見出し→金額の順にソースを修正
• 「→ご注文を確定する」→「この内容でよろしければ「ご注文の確定」ボタン」をクリックしてください。

ご注文の手続きが完了しました。 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=checkout_success

• 下記商品についてお知らせメールを希望する　が唐突。

• 文言を追加。「今回お買い上げの商品のお知らせメールを受け取ることができます。ご希望の場合は商品チェックを入れて、更新ボタンをクリックしてください」

• ご注文番号のブロックは、手続完了メッセージの次に移動するべき

ご注文完了メール †

• 金額表記を「円」に
• 1 x ダウンロード商品例（複数ファイル） (DOWNLOAD2) = ￥5,000　→

• ダウンロード商品例（複数ファイル） (DOWNLOAD2) 1点　 5,000円

商品一覧で「選択した商品をカートに入れる」 †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=index&cPath=21

• 追加[0] の数字を変えてボタンを押す、という操作がわかりにくい気がする…（「選択」でなく実際の行為は「入力」だから？）

• （説明をつける？いや、説明をしないで済む文言はないか？）
• 追加[0] →　追加数量[0]
• 「選択した商品をカートに入れる」→「数量指定してまとめてカートに追加」？　//ウーム…誰かー

ダウンロード商品例（複数ファイル） [DOWNLOAD2] - ￥5,000 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_info&cPath=100&products_id=226

• 「選択して下さい: 」→「商品タイプを選択して下さい: 」
• 【保留】(ステータス変更できない？のでダウンロードは試せず)

【例3】価格お問い合せ商品（定価とセール価格表示） [CALL3] - ￥9,000 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_info&products_id=101

• 
  のalt「価格問い合わせ」→「価格はお問い合わせください」
• 「価格お問い合わせ商品」のリンク文言→「（この商品の）価格を問い合わせる」

おすすめ商品 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=featured_products

• 説明文のある右ブロックを、商品写真のある左ブロックより先にマークアップする
• 「登録日: 2007年01月16日 火曜日」
• 「選択した商品をカートに入れる」の件

送料無料タイプ商品の例 [TYPE_P_FREESHIP] - ￥4,000 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=product_free_shipping_info&cPath=98&products_id=217

• チェックボックス

• イエロー(￥2,000) →イエロー（2,000円増し）
• イエロー(+20kg)→イエロー（20kg増し）

ほかの商品タイプも見ないとかもですが、とりあえず。

マイページ : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account

• ご注文履歴 →　ご注文履歴（最新の3件）　//ここの数って管理画面で変わらないよね？
• 「No」→ご注文番号
• 「表示」→詳細
• 日付表記、金額表記

ご注文履歴 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account_history

• 「ご注文日: 2009年02月12日(木)」　→「ご注文日: 2009年02月12日 木曜日」
• 「品名: 3」→「商品数: 3」
• 「表示」ボタンは「詳細」のほうがよい？
• 「1から5 を表示中 (ご注文数: 5)」→「ご注文全5件のうち 1件目から5件目を表示中)」

ご注文履歴 : 詳細のほう †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account_history_info&order_id=102

• ご注文日: 2009年02月12日 木曜日
• ご注文情報 - ご注文番号　#102 →マイナスじゃないものにする（※）
• 商品名、数量、総額の順に
• x1（えっくすいち）→ 1点
• 小計〜合計のtableは、項目/金額の順にマークアップ。
• ご注文情報のtable="summary"が英語のまま

• Itemized listing of previous order, includes number ordered, items and prices
• 「ご注文内容の、商品名、点数、金額を一覧表示しています」//だれかー

• 履歴とコメントのtable="summary"が英語のまま

• Table contains the date, order status and any comments regarding the order
• 「このご注文の、日付、注文状況、その他コメントの履歴を表示しています」//だれかー

登録情報変更 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account_edit

• 「*」は「必須項目」とし、項目名内に移動する
• 記入例も項目名内に移動する
• 姓ふりがな→姓ひらがな、名ふりがな→名ひらがな
• エラーが出たときのエラーメッセージに「*（あすたりすく）」が含まれる。読み上げない記号に変更。

アドレス帳 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=address_book

• なまえ (お客様)、でいいのかな？　→「なまえ (標準の住所)」
• ボタン「住所を追加」→「新しい住所を追加」
• 「送信」→「この内容で登録」
• 住所変更のときのタイトルタグが新規住所登録になっている→「住所変更」に修正
• (住所一覧で、標準住所を表示しないようにできないですかねーまぎらわしい)

パスワード変更 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account_password

• 「*」は「必須項目」とし、項目名内に移動する

ニュースレター購読 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account_newsletters

• とくになし

お知らせメール購読 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=account_notifications

• （なんか普通にわかりにくい。。）
• お知らせメールについて軽く説明したほうがよい。

• 「全ての商品の最新情報をご希望の場合は、「全ての商品のお知らせメールを購読する」をチェックしてください。」
• →「登録したメールアドレス宛てに、商品の最新情報をお知らせする、お知らせメールをお送りしております。希望する商品名にチェックを入れてください。全ての商品の最新情報をご希望の場合は、「全ての商品のお知らせメールを購読する」をチェックしてください。」

• 「商品のお知らせメール」→「各商品のお知らせメール」

サイトマップ : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=site_map

• とくになし？

検索結果 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=advanced_search_result&search_in_description=1&keyword=%A4%D3%A4%C1%A4%C3%A4%B3

• タイトルタグ、「○○の検索結果」にしたい
• h1も「○○の検索結果」にしたい
• 1から2 を表示中 (商品の数: 2)→「検索結果全2件のうち 1件目から2件目を表示中)」
• 商品一覧で「選択した商品をカートに入れる」と同じ

• 追加[0] →　追加数量[0]
• 「選択した商品をカートに入れる」→「数量指定してまとめてカートに追加」？　//ウーム…誰かー

詳細検索 : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=advanced_search

• 「登録日で検索」　→「登録日で検索（西暦で8桁で入力してください　例：2009年9月9日なら、2009/09/09）」
• スラッシュなしでも通るようにできないか？（スラッシュは読み上げないため）

お問い合わせ : Zen Cart [日本語版] :, The Art of E-commerce †

http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/index.php?main_page=contact_us

• エラーは見出し（h1）直下のほうがよい
• h1出てない？
• 完了画面の完了メッセージもh1直下がよい

感想 †

• \（円）マーク読み上げないの、致命的。ショッピングサイトとしてあほあほ
• テストをしていて思ったのは、メインコンテンツまでの距離が長すぎて使えないと思う。
  • 途中のナビゲーションはざっくり非表示するCSSを用意する。遷移すると、「ホーム | ログアウト | マイページ...清算する」以降からパンくずまではざっくり非表示になるので、ストレスが減るのでは？
  • 音声ブラウザの方はこちらをクリック → クリックでCSS切り替え。選んだCSSはcookieで保存。
  • うまくいくかどうかはまだ不明。

---

コメント欄 †

お名前:

アクセシビリティメモ/社内用「アクセシビリティJIS(JIS X 8341-3) 理解度テスト」をシェア (379d)

アクセシビリティメモ/社内用「アクセシビリティJIS(JIS X 8341-3) 理解度テスト」をシェア

• アークウェブでは昨年後半に、書籍「よくわかる ウェブ・アクセシビリティ&ユーザビリティ(改訂版)」をテキストにとしてアクセシビリティの勉強会をXR(エクストリームリーディング)形式で行いました。

• またその後で、社員全員が確実に知識を活かせるようにするためにペーパーテストを作成して試験を行い、スタッフ全員が合格(95点以上)となるまで追試しました。

• 2009年2月現在、すでにWAI(Web Accessibility Initiative)からはRIAなどウェブの最新動向に対応したWCAG2.0(Web Content Accessibility Guidelines 2.0)が勧告として出され、今年後半には日本のアクセシビリティJISも改訂されるようです。その意味では2004年に発表されたJIS X 8341-3は役割を終えつつあるのかもしれませんが、だからこそこのテスト程度はクリアしておかないとウェブ制作者や企業のウェブ担当者としてはマズいということも言えると思います。

• このテストは社内用に作成したものですが、世のウェブサイトのアクセシビリティ対応はまだまだという状況ですから、オープンにすることで役立つ可能性もあると思って公開することにしました。ダウンロードしてご利用ください。

「アクセシビリティJIS(JIS X 8341-3) 理解度テスト」のファイル †

• Microsoft Word形式 約110kb

ご留意いただきたい点 †

• 内容に誤りがあるかもしれません。お気づきの点があればぜひご指摘ください。
• 解答・解説は付けていません。JIS X 8341-3の原文や「よくわかる ウェブ・アクセシビリティ&ユーザビリティ(改訂版)」などの解説書にあたればわかると思います。

---

Accessibility-JIS(JIS X 8341-3)-Exam.doc 347件 [詳細]

[添付ファイル一覧] [全ページの添付ファイル一覧]
アップロード可能最大ファイルサイズは 1,024KB です。
添付ファイル:
管理者パスワード:

---

コメント欄 †

お名前:

clip/Windows Vista対応の音声ブラウザ：アクセシビリティ対応ソフトウェア (459d)

国内音声ブラウザシェアNo.1のホームページリーダーはVista対応しません。
じゃあほかにVista対応しているのはどんなのがあるの？と調べてみた。

• IBM Windows VistaおよびInternet Explorer 7への対応について - Japan

---

音声ブラウザ †

• ホームページが語りだす・・・ 語るブラウザ・ボイスサーフィン Version4
  • アメディアの望月さんところの。16,800円（税込）

スクリーンリーダー †

• FocusTalk ：スクリーンリーダ (画面読み上げソフト) | Skyfish.Inc.
  • 39,000円（税込）

• スクリーンリーダー(Screen Reader)PC-Talker Vista
  • 39,900円（税込）

• JAWS for Windows Professional Ver.8.0 日本語版
  • 149,100円（税込）

ほかにもあると思う。

その他のVista対応のソフト †

• 高齢者・弱視者向けパソコン画面拡大ソフトの発売(2008年 3月12日): プレスリリース | NEC
  • 62,790円(税込)

• NECからWindows Vista対応の上肢障害者向けパソコン操作支援ソフト:ニュース - CNET Japan
  • 6万2790円

    オペレートナビEXは、上肢障害などでキーボードやマウスの使用が困難な場合でも、
    タッチスイッチや呼気スイッチなど、障害状況に応じた入力スイッチを活用し、
    オンスクリーンキーボードでWindowsの各種アプリケーションソフトの操作を行うことを可能にする。

その他メモ †

• われわれのVistaへの移行準備は大丈夫？ | アクセシビリティBlog | ミツエーリンクス
  • 1年前の記事だけど、海外の対応状況について。

• NVDAJp - JotSpot Wiki (nabe)
  • オープンソースで開発中のスクリーンリーダー。期待。

Windows Vista自体のアクセシビリティ対応 †

MS側もアクセシビリティに配慮しているようす。
こういうページが見つかりました。

• 視覚障害者向け簡易マニュアル 「Windows Vista搭載パソコンのセットアップ」

• Windows Vistaのアクセシビリティ機能

XPに比べると、Vistaは便利になっているらしい †

音声認識機能、ソフトウェアキーボードがある。
↓

• MSが明かすVitsa / Office 2007の「アクセシビリティ」と「生産性」 | パソコン | マイコミジャーナル

お、Vistaけっこうやるんだ！と思ったのですが
ここによると

• スクリーン・リーダー・音声ブラウザについて(KeiYu HelpLab)

Windows Vistaにはスクリーン・リーダーが内蔵されています。
［アクセサリ］→［コンピュータの簡単操作］→［ナレータ］がそれです。
ただ、残念なことに、現在は英語音声のみの対応です。

…んー残念！

アクセシビリティメモ/書籍「Webアクセシビリティ　~標準準拠でアクセシブルなサイトを構築／管理するための考え方と実践~」 第1章 (459d)

アクセシビリティメモ/書籍「Webアクセシビリティ　~標準準拠でアクセシブルなサイトを構築／管理するための考え方と実践~」 第1章

このページは? †

Webアクセシビリティ -標準準拠でアクセシブルなサイトを構築／管理するための考え方と実践-
http://www.amazon.co.jp/dp/4839922209

• 第1章：「Webアクセシビリティを理解する」のサマリーです。

参考ページ †

第1章に関しては翻訳者の渡辺隆行さんが全文を公開しています。

• 第1章：Webアクセシビリティを理解する（第1章全文）
  http://www.comm.twcu.ac.jp/%7Enabe/UAI/Chapt1/

また、第1章を使った「Webアクセシビリティ概論」のページもあります。

• 「Webアクセシビリティ概論」（UAIセミナー） (1)
  http://www.comm.twcu.ac.jp/~nabe/UAI/20080515/nabe/

サマリー †

Webアクセシビリティの必要性 †

• 障害者が社会に参加する機会をWebはもたらしてくれる。
• アクセシブルなWebサイトでは、障害者も普通のことができる。

1. Webアクセシビリティとは何か? （P44〜） †

• Webアクセシビリティの最重要点は、障害者がWebを利用できること。
  • 障害者がWebを知覚し、理解し、ナビゲーション（Webサイトのページ間やページ内を移動したり見てまわったり）し、インタラクション（Webに入力したり情報を受け取ったり）できること。

• Webアクセシビリティは、Web利用に影響する全ての障害を含む。これらは、視覚障害、聴覚障害、肢体不自由、発話障害、認知障害、脳機能障害を含む。

• Webアクセシビリティは、障害を持たない人にも利点がある。
  • Webアクセシビリティで最も重要な原則は、ユーザーによって異なるニーズに柔軟に適合するようにWebサイトをデザインすること。
    →　一般的なユーザビリティも向上し、障害を持たない人も各自の好みに応じてWebを利用できるようになる。

1-1. Webアクセシビリティの例：代替テキスト （P46〜） †

• 今日、多くのWebサイトがナビゲーションのために画像を使用しているが、そのようなサイトで代替テキストが欠けていると、そのサイトはまったく使えない。
  • 代替テキストを付与することでアクセシビリティが向上するが、このとき、Webサイトの見た目は変わらないことに注意されたい。
  • 実際のところ、アクセシビリティを向上させる修正のほとんどは見えないところで機能し、障害を持たない人間がWebを使う際のユーザー体験に影響を与えない。

見た目以外への配慮。見えない人のユーザー体験をイメージする。

1-2. Webアクセシビリティの他の例 （P48〜） †

• オーディオ・キャプション
  • 検索エンジンはオーディオファイルの中身を調べないが、文字による書き起こしとしてキャプションをつければ、その情報は検索エンジンにも利用できる。

• デバイス非依存
  • Webサイトは、特別な種類の装置、たとえばマウス、を用いなくても利用できるようにデザインするべきである。マウスが付いていない携帯電話やその他の機器を使用している人々の助けにもなる。

• 明確で一貫したデザインとナビゲーション
  • 障害者ではないけれども携帯電話やPDAなどの画面が小さい機器を使用している人の助けにもなる。

2. Webアクセシビリティは機会均等に不可欠 （P50〜） †

• Webは、これまでになかった人との関わりをもたらす機会にもなり、障害者がより積極的に社会参加できるようになる。

情報を共有することで人々がコミュニケーションできるような、共通した一つの情報空間が、Webが夢見る世界である。

― Tim Berners-Lee、ワールドワイド・ウェブの発明者、 “The World Wide Web: A very short personal history” (www.w3.org/People/Berners-Lee/ShortHistory)

• Webをアクセシブルにすることで人々の暮らしが劇的に改善し、全体として、社会に利益をもたらす。

• Webアクセシビリティが社会的な問題だということを理解すれば、組織、特に企業の社会的責任（CSR）に関与している組織にWebアクセシビリティを位置づけることができる。
  • アクセシブルなWebサイトがあるだけで企業の社会的責任を示すことになる。

3. 障害者以外への利点 （P51〜） †

• 高齢者
  • たとえば、加齢が原因で視力が衰えた多くの人は、前景色と背景色の十分なコントラストの恩恵を受ける。

• 読み書きが不得手な人、その言語に堪能でない人
  • 特に、認知障害者に対するWebアクセシビリティ上の配慮の多くは、Webで使われている言語をよく知らない人の役に立つ。

• ネットワーク接続の帯域が狭い人、古い技術を使っている人
  • 文字による画像の説明は、ダウンロード時間をスピードアップするために画像表示をオフにしている人や、画像を表示しない機器やソフトウェアを使っている人の役に立つ。
  • スタイルシートを使ってコンテンツと表現を効果的に分離すれば、ファイルサイズが小さくなりダウンロードが容易になる。
  • スタイルシートなしでも閲覧できるように作成されたWebサイトは、古い技術の一部はスタイルシートを処理できないので、そういう技術を使っている人の役に立つ。

• Webの初心者

4. 相互依存しているWebアクセシビリティの構成要素 （P53〜） †

• Webが障害者にアクセシブルになるためには、Web制作とインターラクションに関する構成要素すべてが協調することが絶対に必要。これらの構成要素がそれぞれの役割を果たさなかったら、それ以外の要素に対する負担が大きくなり、Webのアクセシビリティは低下する。

4-1. 構成要素の解説 （P54〜） †

• 構成要素を考える方法のひとつは、技術と人間の二つのグループに分けること

• 技術的な構成要素
  • Webコンテンツ:
  • 技術仕様（XHTML+CSS／Web技術とかマークアップ言語）
  • オーサリングツール
  • 評価（テスト）ツール
  • ユーザーエージェント（Webブラウザ、メディアプレーヤなど）
  • 支援技術（Web利用を改善するために障害者が使うソフトウェアやハードウェア。スクリーンリーダーなど。）

• 人間に関する構成要素
  • ツール開発者
  • ユーザー
  • コンテンツ制作者

4-2. 実装サイクルにおけるアクセシビリティ （P57〜） †

• 構成要素間の相互依存性は、アクセシビリティ機能を先に実装するのはどちらかという「卵が先か鶏が先か」問題を今まで引き起こしてきた。

• ある構成要素がアクセシビリティ機能を欠いている場合、ほかの構成要素がその機能を実装してもユーザーのアクセシビリティを高める結果につながらないなら、ほかの構成要素は、そのアクセシビリティ機能を実装しようとは思わない。

• ひとつの構成要素にアクセシビリティ機能が有効に実装されると、ほかの構成要素がそれらのアクセシビリティ機能を実装する可能性が高くなる。

アクセシビリティは1つの構成要素で実現するものではなく、互いに依存しているもの。誰が先ではなく、それぞれが始めることが、アクセシビリティ実現の近道。

4-3. アクセシビリティ対応が弱い部分の補償 （P57〜） †

• オーサリングツールやユーザーエージェントがアクセシビリティ機能を持たない場合、コンテンツ制作者ができること。
  • オーサリングツールがアクセシブルなマークアップをしない場合、コンテンツ制作者が自分で直接(X)HTMLファイルに書き込んでマークアップできる。
  • ユーザーエージェントがコンテンツ構造に沿ってナビゲーションする機能を提供しない場合、コンテンツ制作者は、Webコンテンツにナビゲーション機能を追加できる。

• 時にはユーザーが、ブラウザやコンテンツに欠けているアクセシビリティを、同じWebページであっても、違うユーザーエージェントや支援技術を組み合わせて用いることにより、補うことができる。
  • 残念ながら、多くのアクセシビリティ問題ではユーザーが取れる回避策がなく、コンテンツはアクセスできない。

4-4. 構成要素をまとめる （P59〜） †

• W3C WAI（www.w3.org/WAI/）は、国際的なWebアクセシビリティ取り組みの協調を進め、技術面と人間面の構成要素に関して考慮すべき点をひとつにまとめている。
  • アクセシビリティ・ガイドラインを策定するために協調したこうした努力によって、各構成要素がうまく協調して機能するためのフレームワークが提供される。
  • このフレームワークにより、各構成要素が他の構成要素に何を期待できるかが明らかになるので、卵が先か鶏が先か問題の解決にも役立つ。

• オーサリングツール・アクセシビリティガイドライン (ATAG)
  • オーサリングツールを障害者にもアクセシブルにする方法を説明し、Web制作者がオーサリングツールを用いてWCAGに適合したWebコンテンツを作成するのを手助けをする方法を明確にしている。
• ウェブコンテンツ・アクセシビリティガイドライン (WCAG)
  • コンテンツ制作者に対して書かれているもの。障害者に対してWebコンテンツをアクセシブルにする方法を説明している。
• ユーザーエージェント・アクセシビリティガイドライン (UAAG)
  • 主としてユーザーエージェントの開発者向け。

5. Webアクセシビリティ実現の方法 （P62〜） †

http://www.comm.twcu.ac.jp/~nabe/UAI/Chapt1/#approach

障害者に対するアクセシビリティの重要性や障害者以外に対するアクセシビリティの利点が、組織や個人がアクセシビリティに取り組む方法に考慮されることは滅多にない。Webプロジェクトの多くは、アクセシビリティ・ガイドラインや評価テストの報告を制作サイクルに組み込むのが遅い。ただそれだけに注目するのではなく、アクセシビリティ向上作業の中心に置くべきガイドラインはある。

5-1. 今すぐに始めよう †

• アクセシビリティ対応はWebプロジェクトの最後まで放置されることが多い。プロジェクトの最後に対応したのでは、より費用がかかり、重荷となってプロジェクトを挫折させる。

• Webサイトを制作あるいは改訂する際、最初からアクセシビリティを考慮すれば、プロジェクトの最後に考慮するよりも、はるかに簡単で、より有効的で、費用もかからない。

5-2. 問題を理解するところからはじめる †

• アクセシビリティ標準だけを用いる（チェックリストを用いてチェックするだけ）と、プロジェクト達成には時間がかかり、不満が増し、そして有効な結果をあまり生まない。

• アクセシビリティの効果がない努力に時間を費やさずにすむもっとよい方法がある。

ガイドラインに飛びつく前に、そして評価ツールの結果を分析する前に、まず問題点を理解しなさい。
障害者がWebを使う様子の基本的なところを勉強しなさい。

5-3. 障害者を制作プロジェクトに加える （P63〜） †

背景知識をいくらか勉強した後、アクセシビリティ問題を理解する最もよい方法は、何人かの障害者と一緒に実際に働いて、彼らがどのようにWebを利用しているかや、支援技術を使う様子を学ぶことである。これにより、アクセシビリティ問題や解決方法の実地体験ができる。

（注）具体的な方法は本を参照してください。

5-4. アクセシビリティとユーザビリティの関係を理解する （P67〜） †

• ユーザビリティの問題
  • 能力（障害のあるなし）に関わらず、全てのユーザーに同じ影響を与える。つまり、ユーザビリティ問題によって、障害のあるユーザーが障害を持たないユーザーより大きな不利を被ることはない。

• アクセシビリティの問題
  • 障害者のWeb利用を妨げる。障害者が、障害を持たない人と比べて不利ならば、それはアクセシビリティ問題である。

• アクセシビリティとユーザビリティは重なる部分が多い。
• 両者の関係のニュアンスは、ほとんどのWeb制作（これらは、すべての人に対するアクセシビリティとユーザビリティの両方を目標とすべきである）に影響しない。
• いくつかの特殊な状況、たとえば法的な方針においては、両者を区別することが重要である。
• これは油断できない問題である。この問題を扱うときは注意すること。

アクセシビリティに取り組む基礎としてUCDとWCAGの両方を用いることで、技術レベルとユーザー・インターラクション・レベルの両方において、幅広い問題がよくカバーされるようになる。

5-5. ガイドラインの重要な役割を理解する （P69〜） †

• WCAGは、広範囲のアクセシビリティ問題をカバーしている包括的なガイドラインであり、可能な限り、あらゆる状況下でのあらゆる障害に言及している。
  • たいていの場合、WCAGの文書群がアクセシビリティに関する情報の主要な参考文献となる。

• WCAGはアクセシビリティ解決の案内役であるべきであるが、アクセシビリティのゴールはガイドラインのリストにチェックマークをつけることではない。

• アクセシビリティのゴールは、Webサイトをアクセシブルにすることである。
  1. WCAGを用いることで全ての問題が取り上げられていることが保証され、
  2. 障害者が参加することで有効かつ効果的にそれらの問題が取り上げられる助けとなる。

6. Webアクセシビリティに関する有害な思い込み （P73〜） †

新しい技術によって、視覚的にも魅力があって複雑でダイナミックで、しかもアクセシブルなWebサイトを制作できるようになった。

6-1. 文字だけにすればよいという思い込み †

• 文字だけのバージョンの多くは、一部の障害者に対してアクセシブルではない。

• 文字だけのバージョン主バージョンに比べ、更新されないことが多い

文字だけのバージョンを作るより、主バージョンをアクセシブルにするべき

6-2. アクセシブルなサイトは冴えなくてつまらないという思い込み †

• 「アクセシブルなサイトは、視覚的にも技術的にも単調でつまらない」というのは時代遅れの思い込み

• Web制作者は、アクセシビリティに対する要求やガイドラインを、実際よりも制限が多いものだと誤解してきた。
  • WCAG 1.0はJavaScriptの使用を禁じているとか、新しいウィンドウを開いてはいけないなどと誤解されてきた。

• 実際にWCAG 1.0が要求していることは、
  • スクリプトが果たしている機能をスクリプトなしでも提供できるような代替手段（を用意すること）も必要
  • 新しいウィンドウを開くときは、それをユーザーに伝えることが必要
    • 障害者がWebを使う様子を最初に学んでいれば、ユーザーが気付かない場合、新しくウィンドウが開いたり（フォーカスが）別のウィンドウに変わったりすると問題が生じることがわかるだろう。

6-3. アクセシブルにするのは大変でお金がかかるという思い込み †

• 低コストでアクセシビリティを実現する方法
  • アクセシビリティ対応をWeb制作プロジェクトの最初から開始する。
  • 問題を理解するところから始める。その際、Webアクセシビリティに関連する複数の要素を考慮する。次に、“Understanding WCAG 2.0” (www.w3.org/TR/UNDERSTANDING-WCAG20/) を用いて、全ての問題をカバーする。
  • 始めから終わりまで、障害者に参加してもらう。
  • サイトの部分ごとと問題ごとに優先度を付ける。

6-4. Web制作者だけがアクセシビリティに責任があるという思い込み †

• 「4. 相互依存しているWebアクセシビリティの構成要素 （P53〜）」であるようにアクセシビリティの向上はコンテンツ制作者以外にも依存している。

6-5. 全盲の視覚障害者だけがアクセシビリティの対象であるという思い込み †

6-6. 評価ツールを使えばアクセシビリティを判断できて標準に適合しているかどうかもわかるという思い込み †

• ツールを人間による評価の代わりと考えるのではなく、ツールを人間が評価するときの補助と考えよう。
  • 評価ツールで自動的にチェックできるポイントはツールを使い、ツールでは判断できないチェックポイントは人間がチェックする。

ツールが万能ではない例としてスペルチェッカーで考えてみると...
スペルチェッカーは、本当は正しいのに間違っていると判断することもあるし、本当は間違っているのに
正しいと判断することもある。たとえば、”good test tool”とタイプするつもりで”good text tool”と
タイプしてしまったら、スペルチェッカーはそれを間違いとは判断できないだろう。
同様に、評価ツールが見つけられないエラーがたくさんある。

6-7. ガイドラインはアクセシビリティに不十分だという思い込み †

7. ビジネス面から見た付加的な利点 （P83〜） †

7-1. 技術面の利点 †

• サイト制作と管理の時間短縮
  • （ページの見せ方である）表現をスタイルシートで定義し、コンテンツの構造を（たとえばXHTMLで）正しくマークアップすることで、サイト全体の表現を変更する際に必要な作業時間と作業量が削減される。

• サーバーの負荷軽減
  • ページごとに表現をマークアップする代わりにスタイルシートで表現を定義することや、画像文字の代わりに文字を使うことで、各ページのサイズが小さくなる。

• 相互運用性の向上
  • Webアクセシビリティにより、Webコンテンツがいろいろな構成（さまざまなブラウザやOSや表示端末など）でレンダリング（表示）されたり利用されたりできるようになる。

• 先端技術への準備

7-2. 経済的な利点 †

• 検索エンジンへの最適化
  • サイトをアクセシブルにすることで、SEO（Search Engine Optimization）の効果がかなり向上する。

• Webサイトの利用増
  • Webサイトの利用が増えることによって、直接的および間接的に経済的な利益を得る可能性があることである。

• 直接的な経費削減
  • アクセシビリティによりサイトの管理が長期的に減少すると、サイト管理のための人件費が減る。
  • アクセシビリティがサーバーの負荷を減らせば、必要とされるサーバーの処理能力が削減でき、追加するはずだったサーバーの費用を節約できる。
  • アクセシビリティによってコンテンツがさまざまなデバイスで利用できると、デバイスごとに異なったバージョンのサイトを多数作成する必要性が減る。
  • アクセシビリティによってWebの先進技術を利用できて将来現れるWeb技術にも対応できると、新しい技術にアップグレードする費用が減る。

8. はじめよう （P88〜） †

• 価値ある挑戦

アクセシビリティを、競争相手に対して差別化をはかり、市場で会社の特徴を出すものと捉えたら！

• 相互依存しているWebアクセシビリティの構成要素がそれぞれに始めることで、全体が促進される
  • Webブラウザ、メディアプレーヤ、支援技術、そのほかのユーザーエージェントがアクセシビリティ機能を備えていたら、ユーザーがそのアクセシビリティ機能を必要とする可能性は高くなり、Web制作者が自分たちのWebサイトでそのアクセシビリティ機能を提供する可能性も高くなるだろう。
  • Web制作者があるアクセシビリティ機能を提供したいと考えたとき、彼らが使っているオーサリングツールがその作業を容易にしてくれることを要求する可能性も高くなるだろう。
  • オーサリングツールが、簡単に使えるアクセシビリティ機能を持つようになったら、Web制作者はそれを使う可能性も高くなるだろう。
  • アクセシビリティ機能が多くのWebサイトに実装されたら、 Web制作者とユーザーはブラウザなどのユーザーエージェントがその機能をサポートすることを要求する可能性も高くなるだろう。

アクセシビリティの伝道者になろう！