2007-02-06
alt=""を越えて。
集中的にアクセシビリティやユーザビリティを最近になってやっと学び始めました。JIS X 8341やWCAG1.0を読み進める中で、もっと自分自身勉強したいと思うようになってきました。そこで、JISやWCAGを学ぶ中で、自分がシニアや障害を持つ人との現場で、またそういった現場で働いている人たちの意見を踏まえた上で、疑問に思うことを列挙しておこうと思います。いずれは、こういうことをちゃんと実装レベルで解決できるようになりたいなと思いを込めて。
alt=""は空文字なのか、半角スペースなのか、それとも全角スペースなのか？
少し前に「ブロガーのためのアクセシビリティガイドライン」を書きました。この際に、はじめはalt=""と空文字を打つと書いていたのですが、よくよく調べてみると、空文字だと音声ブラウザによっては「画像」と読み上げてしまうことがあるようです。また、全角スペースの場合は、日本語環境以外の音声ブラウザだと、文字化けしてしまい、alt属性が変な文字を読み上げてしまうとのこと。
しかし、Crossing Fingersの石田さんによると、どうやら半角スペースでも「画像」などと読み上げてしまうような音声ブラウザが過去にあったとのことで、じゃあ、alt属性はどういうマークアップが一番ベストなのか、という問題意識があります。
追記（2007年2月17日）
装飾およびレイアウト目的の画像の代替テキスト | アクセシビリティBlog | ミツエーリンクスを参考にすると、現状のブラウザの実装を考えると、「スペースなしの空白」が妥当かなとも思います。要検討ですね。
formにおいて、苗字と名前を分けて入力させるのは本当によいのか？
formのユーザビリティにおいてよく言われるのが、苗字と名前は別々にinput要素で分けたほうがよいとの議論。例えば、入力フォームのユーザビリティ&アクセシビリティなど。しかし、僕の周りのシニアはそんな配慮お構いなしに、1つ目の苗字のinput要素に苗字も名前も入力してしまうことが本当に多い。画面を見ていないというか、何というか。
もちろん、formにおいては、以前「シニアはログインでつまづく？！」で書いたように、半角と全角の違いも相変わらず頻繁に起こる問題です。formにおいては、もっとユーザビリティを突き詰めることができるはずです。
ナビゲーションスキップはどのようにマークアップすべきか？
ナビゲーションスキップは、よくユーザビリティやアクセシビリティの配慮の好事例として挙げられることが多いのですが、ここにも疑問があります。
ナビゲーションスキップに関しても、以前「ナビゲーションスキップはどう実装すべきかについて考えてみた。」というエントリーを書いてはいます。ただ、もしこのスキップ機能をそのままマークアップすると、少し困った点が発生します。
それは、音声ブラウザ利用者がナビゲーションスキップを利用して、本文に到達し、その後ブラウザの「戻る」を利用した時です。通常のリンクの際には、「戻る」によって前のページに戻るのですが、ページ内リンクの1つであるナビゲーションスキップは同じページの上部に戻ることが多いのです。ネットの画面を見て、自分の位置を把握しにくい、全盲の方の場合はすぐにサイト内で迷子になってしまいます。
また、音声ブラウザによっては、ページ内リンクそのものに対応していないようです。すると、ページ内リンクがあったからといって、全てが丸く収まるというわけではないということです。
パンくずリストは本当に必要なのか？
パンくずリストは、自分のサイト内における位置関係を確かめるという意味では、便利なレイアウトだとは思います。ただ、思うのは、肝心のシニア層はパンくずリストをほとんど使わないということ。僕らの世代なら、コードを書けなくても、それが一体何を指し示しているのかは想像がつきますが、シニアの場合はこの機能を知らないため、クリックしようとしません。
また、パンくずリストは音声ブラウザ利用者にとってもマイナスに働くことがあります。ページ最上部でコンテンツに直接飛べるようにスキップリンクを配していても、音声ブラウザ利用者によっては、その機能を使わずに、ゆっくりとページを上から下に読み上げていく人もいます。その際に、通常なら「ロゴ」、「グローバルナビゲーション」と2つくらいの箇所を読み上げれば、本文に辿り着くのに、パンくずリストがあるせいで「ロゴ」、「グローバルナビゲーション」、「パンくずリスト」と1箇所分多く時間が取られてしまいます。
ディレクトリ型の検索エンジンなどには便利なパンくずリストではありますが、小中規模のサイトには本当に必要なのか。閲覧者が滞在するページに対してグローバルナビゲーションの色合いを変えるだけでもよいのではないか、という疑問があります。
サブメニューはdl要素で本当によいのか？
グローバルナビゲーションをul要素でマークアップし、サブメニュー（もしくはローカルナビゲーション）をdl要素でマークアップしているサイトがよくあります。もちろん、ナビゲーションスキップによるページ内リンクで、サブメニューにすぐに移動できるようにするのはよいとしても、先ほどの非対応のブラウザやナビゲーションスキップをマークアップしないこともあります。
ブログの場合は大体各記事のタイトルがheading要素になっており、音声ブラウザのheading要素への直接ジャンプなる機能を使えば、本文には到着しやすくなるとは思います。ただ、問題はサブメニューがdl要素でマークアップされており、heading要素がないため、サブメニューに直接飛ぶのが難しくなるのです。もしかしたら、tabキーを使ったり、ホームページリーダーなどのページ内のリンクを一覧に表示する機能を使えば、それはそれで解決するのかもしれませんが。
このへんのことを踏まえれば、dl要素でマークアップするよりも、heading要素とul要素でマークアップするほうがよいのかなと思います。
Zoom LayoutやElastic Layoutは標準になるのか？
Elastic Layoutについては自分でも書き残していますが（2xupで実装されているエラステックレイアウトを調べてみた。）、そういったユーザビリティに配慮したレイアウトというのはどこまで一般的になるのかな、という疑問。Elastic Layoutはちょくちょく見掛けますが、Zoom Layoutはほとんど見ません。個人的には非常に面白いレイアウト手法だとは思うのですが、色弱を持っている人の場合は、Windowsのユーザ補助を使ったり、我慢しているだけかもしれません。
やっぱり、font-sizeが小さいのです。
これは、livedoorを中心にフォントサイズが圧倒的に小さいブログが本当に多い。このブログもデフォルトのfont-sizeが小さかったので、CSSを追加しています。デフォルトのfont-sizeが小さくても、JavaScriptでfont-sizeを拡大できるようにしておけばよい、と考えるのは、僕自身は賛成できません。
理由は、周りのシニアでそんなリンクを探してクリックする人がいないから。見にくかったら、すぐに違うサイトに行けばいいだけの話ですから。かといって、ユーザビリティを重視するといった理由で、font-sizeをブラウザのデフォルトのままにしておくのもどうかと思うのです。デザインもレイアウトも組みにくいですから。
ちなみに、周りのシニアでブラウザの初期のfont-sizeを大きく設定している人はあまり多くいません。65歳以上くらいの人たちが何人かというくらいです。むしろ、団塊世代よりも若いシニア層は多少font-sizeが小さくても、大丈夫なようです。
トップページへのリンクはサイトIDだけでは不十分。
多くのサイトでは、サイトIDやロゴに対して、トップページにリンクを張っていると思います。ただ、シニアによっては、このロゴにリンクを貼っているのが一般慣習であることを知らないことが意外に多いのです。そのため、グローバルナビゲーションに「ホーム」などの記述がないと、サイトのトップページに戻ることができません。
長々と書き連ねてしまいましたが、このへんのユーザビリティやアクセシビリティについてはそろそろ本格的な実施検証やユーザビリティテストが必要だなと思っています。一つの現場からの意見として、参考にしていただければと思います。
