忍者ブログ

World of granshe.

HTMLやCSS、JavaScriptに関する話題を中心に、Web制作について知ったこと、覚えておきたいことをメモしておく個人的スペースです。
[23] [22] [21] [20] [19] [18] [17] [16] [15] [14] [13

[PR]

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

NVDAを使って分かったこと

以前ダウンロードしたNVDAについて。

百聞は一見にしかずといいますが、
自分でその大切さを実感することはとても大切です。


1.スキップリンクはとても大事。

昔自分がつくったテキストサイトをNVDAで閲覧してみたのですが、 当然同一サイトですから、ヘッダの情報やナビゲーションの情報はほとんど同じです。
ページに飛んだとき一番初めに読み上げるのは一番上にあるグローバルナビゲーションですから、テキストを読むには、ナビゲーションを飛ばすために何度もクリックしなければなりません。
これは辛い!

ページの一番上にコンテンツ部分へのスキップリンクがあるとやっぱり便利だと思います。
もしくはグローバルメニューを絶対配置にして、HTMLの最上部に置かないようにするとか…。


2.ページ下部の「トップへ戻る」、「次のページへ」、「前のページへ」の便利さ

前述したテキストサイトですが、
ページ移動のために「次のページへ」、「前のページへ」というリンクを設けていました。
当時は大して意識せずにこれらのナビゲーションを配置していたのですが、
文章を読み終わった後に出てくるこれらのリンクは正直とっても役立ちます。
特にページをまたいで文章がつながっているコンテンツの場合は大助かり。
文章を全部読んだ後、すぐに次のページに移動できるのは嬉しい。


3.パンくずリストがわかりにくい

スクリーンリーダーを利用するにあたっては、
パンくずリストが結構分かりにくいので、少し気になりました。
いきなりページのはじめに「ホーム」「大見出し」「今いる場所」とか言われても、ちょっと動揺します。
ulタグにtitle属性でも指定すれば、パンくずリストだとすぐに理解できるのかもしれません。

「パンくずリスト」は視覚的には非常に分かりやすいナビゲーションですが、スクリーンリーダーではいまいち分かりづらい気がしました。わたしは目を閉じてNVDAを使用しているわけではないので、あくまでも個人的に感じたことですが・・・。
今制作予定のサイトでは上下にパンくずリストを入れようとしていたんですが、ちょっと考え直した方がいいかもしれない…

あとは、
例)
ホーム>メニュー>カルボナーラ
というパンくずリストの記述があった場合、
「ホーム だいなり メニュー だいなり カルボナーラ」
とかいうよくわからない読み上げ方になってしまいます。

同様に、
ホーム|メニュー|カルボナーラ だと、
「ホーム たてせん メニュー たてせん カルボナーラ」になります。

もしかしたら、パンくずリストだと分かるようにわざわざ読み上げさせるように仕向けているのかもしれませんが、ちょっと違和感がありました。
区切り記号は実体参照で指定すれば読み上げられることがないので、
実体参照で指定すると良いと思います。

以上、NVDAを使ってみた実感でした。
たぶん続きます。

PR
この記事にコメントする
お名前
タイトル
文字色
メールアドレス
URL
コメント
パスワード   Vodafone絵文字 i-mode絵文字 Ezweb絵文字
この記事へのトラックバック
この記事にトラックバックする:
プロフィール
名前: ゆーり
職業: コーダー(模索中
趣味: Web制作
自己紹介: 某Web製作会社の入社5年目のマークアップエンジニア。専門はHTMLとCSSとMT(自称)。
カレンダー
02« 2017/03 »04
S M T W T F S
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
ブログ内検索
忍者ブログ [PR]