FrontPage http://www.ark-web.jp/accessibility/4.html

[edit]

このサイトについて

[edit]

このサイトは

[edit]

最新記事

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

更新日 2015-03-02

アクセシビリティメモ/社内用「アクセシビリティ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の原文や「よくわかる ウェブ・アクセシビリティ&ユーザビリティ(改訂版)」などの解説書にあたればわかると思います。

fileAccessibility-JIS(JIS X 8341-3)-Exam.doc 347件 [詳細]
[添付ファイル一覧] [全ページの添付ファイル一覧]
アップロード可能最大ファイルサイズは 1,024KB です。

管理者パスワード:

コメント欄

  • a -- a? 2015-03-02 (月) 17:01:58

投稿者中野 | パーマリンク | コメント(1)

| このエントリをはてなブックマークに登録

だれコン/2010-11-26シンポジウム (1551d)

更新日 2010-12-02
だれコン/2010-11-26シンポジウム
  • 2010/11/26 渋谷の LoftworkGround にて
  • 40人強ほど集まりました

用語定義

  • 【タケ】:←この部分は、私の感想の箇所です

SoftBankの「モバイル情報システム」

  • SoftBankさんの協力で「モバイル情報システム」というのを取り入れてみた
    • 対象:聴覚障害者用
    • 内容:音声を遠隔で飛ばしており、言語化したものをiPhoneに送っており、聴覚障害者の方にiPhoneをお渡しして参加していただいた。
      →言語化するスタッフは長野にいるらしい

基調講演「アクセシビリティは世界を変える技術へ」

  • ICTにおけるアクセシビリティ
    • ICTで提供される情報・サービスを利用できるようにする
      →障害者の社会参加を実現したい
    • 現実はこの枠を超えつつある
  • アクセシビリティに関係する技術は、(障害者など)少数の人のためのものではない
例:
電話:聴覚障害者の家族とのコミュニケーションを取りたかった
キーボード:上肢障害者のためのコミュニケーション手段
文字認識・音声認識なども同じように。
  • IBMでしてきたこと。
    • 社会貢献以外に、自社サービスとして提供するために研究した
      →【タケ】単に社会貢献だけでなく、企業利益と合致させた
  • IBMホームページ・リーダー
    • 浅川さん自身が「自分で検索していける体験がすばらしい」と思った
  • 音声合成技術の進歩
    • 1985年:無感情
      • こんなの聞いてられません。
    • 2004年:感情合成
    • 2008年:英語版の感情音声合成のデモ
      →【タケ】かなり自然だった。笑いなどもあり。
      • 今はパラメータを与えている。
        →【タケ】話の流れに沿った感情表現にまでは至っていないみたい。
  • 障害者と晴眼者のタスク遂行時間の違い
    • 晴眼者が60秒かかるものが, 障害者は600秒かかる
      →生産性をどうすれば向上させられるか
    • アプリ的な性能の向上
      →技術向上
    • データも必要
      →ガイドライン化
  • アクセシビリティ評価ツール - エーデザイナー
    • オープンソース
    • 見出しのチェックができる
    • 色覚異常のチェックができる
      • 赤が緑へ

「だれコン/2010-11-26シンポジウム」 の続きを読む

投稿者竹村 | パーマリンク | コメント(0)

| このエントリをはてなブックマークに登録

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

更新日 2010-04-22
アクセシビリティメモ/「改正迫るウェブアクセシビリティの規格(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)の改正のポイントと動向」」 の続きを読む

投稿者小森? | パーマリンク | コメント(2)

| このエントリをはてなブックマークに登録

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

更新日 2010-01-21
実践アクセシビリティ/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) (1889d)

更新日 2009-12-29

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

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) (1901d)

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

このページは?

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

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

議事録

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

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

  • 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)」 の続きを読む

投稿者竹村 | パーマリンク | コメント(0)

| このエントリをはてなブックマークに登録

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

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

このページは?

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

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

議事録

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

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

投稿者竹村 | パーマリンク | コメント(0)

| このエントリをはてなブックマークに登録

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

更新日 2009-12-04
アクセシビリティメモ/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の場合はどのように適用できるかを検討している最中なので、
まずはその命題を書いておきます。

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

命題

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

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

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

問題

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

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


コメントをどうぞ


tag: JIS X 8341-3

投稿者竹村 | パーマリンク | コメント(0)

| このエントリをはてなブックマークに登録

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

更新日 2009-10-02

目次

はじめに

こんにちは。竹村です。

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

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

簡単なWAI-ARIAの説明

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

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

準備

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

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

投稿者竹村 | パーマリンク

| このエントリをはてなブックマークに登録

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

更新日 2009-09-24

はじめに

こんにちは、竹村です。

最近、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に埋め込む方法 (2006d)

更新日 2009-09-03
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> 
  • IEでもちゃんと表示されます。代替表示も表示されません。
  • JSオフのときも問題なく表示
  • Flashがインストールされていないときは、下記のような代替表示が出るようになります

cap.png

最後に、

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

&amp;

と実体参照に置き換えます。
これで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> 

参考サイト

投稿者小森? | パーマリンク

| このエントリをはてなブックマークに登録

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

更新日 2009-08-27

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

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

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

サイトでの記述

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

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

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

山梨県ホームページアクセシビリティ診断結果報告書(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」をシェア (2013d)

更新日 2009-08-26

アクセシビリティメモ/社内用「アクセシビリティ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の原文や「よくわかる ウェブ・アクセシビリティ&ユーザビリティ(改訂版)」などの解説書にあたればわかると思います。

コメント欄


投稿者竹村 | パーマリンク | コメント(0)

| このエントリをはてなブックマークに登録

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

更新日 2009-05-21
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でチェック (2111d)

更新日 2009-05-21
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日本語版のアクセシビリティ対応/現標準テンプレートをキーボード操作でチェック (2135d)

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

JIS:2009 追加テスト基準

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

  • コンテンツが提供されている順序がその意味に影響を及ぼすときには正確な読み上げ順序をプログラムで解釈可能にしなければならない。
  • 次アクション:表以外もそのようになっているかテストする

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

  • 複数のウェブページ上で繰り返されているコンテンツのブロックを通過できるメカニズムが利用可能でなければならない。
  • 次アクション:これはメニューとリンク以外もカバーしている? 付属文書にあたり、必要なら追加テストを。
  • 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の方が良い)
  • 「配送先住所」や「ご請求先住所」など各ブロックで「編集」が見出しの次に読まれてしまう。
    → 「編集」がブロックの中で最後に読まれるようにしたい。
  • カートの内容のテーブル
    • マークアップの見直し(上記同様)
  • 「ご注文の確定」ボタンが「最終確認 → この内容で~」の前に読まれる。
    → 順番を入れ替え、「ご注文の確定」ボタンが最後に読まれるように。

投稿者近藤 | パーマリンク

| このエントリをはてなブックマークに登録

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

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

目次

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でさらに明文化されたので、付属文書を読み、必要ならテストをする。

コメントがあればどうぞ


投稿者中野 | パーマリンク | コメント(0)

| このエントリをはてなブックマークに登録

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

更新日 2009-02-25

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

Tシャツ(白) : 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日本語版のアクセシビリティ対応/ホームページリーダーのチェック+α (2202d)

更新日 2009-02-19
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日 木曜日に登録されました。

サイドボックス

  • 「Tシャツ(カラー)-> (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

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

パスワードを忘れたら(エラー表示)

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

パスワードを忘れたら(完了表示)

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

商品一覧

Tシャツ(白) : 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月の新着商品 - Tシャツ(白)」真ん中の「-(ハイフン)」はマイナスと読まれるのでなし。→なにがいい?中黒?

商品詳細

びちっこ [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

  • http://zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-4/includes/templates/template_default/images/call_for_prices.jpg
    の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で保存。
    • うまくいくかどうかはまだ不明。

コメント欄


投稿者小森? | パーマリンク | コメント(0)

| このエントリをはてなブックマークに登録

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

更新日 2008-11-21

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


音声ブラウザ

スクリーンリーダー

ほかにもあると思う。

その他のVista対応のソフト

その他メモ

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

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

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

 Windows VistaとXPのアクセシビリティ機能の比較表

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

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

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

…んー残念!

投稿者小森? | パーマリンク

| このエントリをはてなブックマークに登録

トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2008-10-07 (火) 13:56:57 (6018d)

アークウェブのサービスやソリューションはこちら