老眼とWEBデザイン
1.
視力の問題
私は視力0.1もない強度のド近眼である。さらに、数年前から老眼になったらしく、眼鏡をかけたままだと近くが見えなくなってきた。眼鏡をとれば近くが見えるんだから、新たに老眼鏡をかけるわけじゃなし、たいしたことじゃないと思っていたのだが、ここでひとつ問題が出てきた。なってみなきゃわからないことってあるものだが、強度の近眼の人間が老眼になると、半端な距離の場所が見えなくなってしまうのだ。たとえば、足の爪を切るなんていう時、眼鏡をかけると老眼のせいでよくみえないし、はずすと今度は近眼のせいで見えないのである。
それに、いくら眼鏡をはずせば近くが見えるといっても、普段のデスクワークでパソコンを見ながら紙の資料を読むなんて時は、眼鏡をかけたりはずしたりの手間がはんぱじゃないし、目がとても疲れる。2年ほど前に仕事が忙しくなった際に、ついに目の奥がずきずきと痛み出し、これ以上目を酷使してたら、失明するんじゃないかという恐怖にみまわれて、眼科に飛び込むことになった。
眼科の処方は「近距離用の眼鏡を作りなさい」だった。そして、現在その近距離用の眼鏡を作ったおかげで、目の奥の痛みもなくなったし、足の爪を切るのも不自由しなくなった。パソコン画面もよく見え、あまり疲れない。やっぱり専門家は偉大だ。
とはいうものの、やっぱりWEBサイトを閲覧する時に字が小さいと、読みづらくてイライラするようにはなってしまった。あるレベル以上の大きさの文字であって欲しいし、今後さらにそうなっていくだろうから、できればブラウザの設定で文字の大きさが変えられるようになっていれば、将来も安心というものだ。
2.
WEBのユニバーサルデザイン
私が主としてWEBデザインの仕事をしているクライアントは、パソコンなども扱っている大手の電機メーカーなのだが、その会社で、WEBのユーザビリティ、アクセシビリティを全面的に考え直し、作り直しをしようという動きが持ち上がった。つまり、かっこよくおしゃれなだけのページの時代は終わり、機能性、わかりやすさ優先で、視力や聴力に障害がある人にもやさしい作りにしよう、という考えになったというわけ。
それにともなって、プリントアウトすると厚さ4cmにもおよぶ大量のPDFファイルのマニュアルが各デザイナーの下に配布され、今まで作った膨大なページを整理統合し、作り直すというとんでもない作業に踏み切ったわけである。おまけに、WEBデザインの検閲をするソフトまで自社で作ってしまい、その検閲を通らなければサーバーにアップできないという徹底的な大改編である。
さて、そのマニュアルの中にも書いてあることなのだが、「高齢者は、加齢に伴い、視覚聴覚障害者と共通の問題が発生する」・・・まさしく。自分が視覚障害者の仲間入りをすることで、はじめて親切なWEBの必要性も骨身にしみてわかった。情報を調べるっていうことこそが第一の使命だものね。リンクの場所が分りづらかったり、文字が読めないほど小さいんじゃ、お話にならない。
3.
原点回帰
そういうわけで、WEBデザインのほぼ根底から見直しをする必要に見舞われたのである。要は、原点に返れということなのだが。ただ、私がWEBデザインに参入した時は、いわば一番原点から遠ざかっていた時代といってもよく、写真と文が複雑に入り組んだデザインでも、ソフトを使えば一発で変換できちゃうみたいなデザインが一般的だった。WEBデザインってやりようによっちゃ、こんなにもすごい見せ方だってできる、タグで打ち込んでたらこんなことはできないだろう、みたいなノリだったのだ。そして、あくまでもデザイン最優先なので、ブラウザによって文字の大きさが変わりレイアウトが崩れるのを避けるために、文字はピクセルで指定して、デザインが崩れないようにすることにのみ神経は使われていたのである。
ところが、ピクセルで指定した文字は、少なくともWindowsのInternet Explorerではがっちりと固定されてしまい、拡大して見ることができない。小さい字を使っちゃうと、時折つらいものがあるわけである。さらに、デザイン優先にするあまり、写真は細切れになり、大きなテーブルの中を細切れ写真と文章が入り乱れて視覚障害のある人などには、音声ガイドがついたとしても、何が書いてあるのかわかるわけがないような作りだったのである。
前述のクライアントのサイトは、膨大な量ということもあって、「common」フォルダがいくつも使われている。ファイルがどの階層にあろうとも、基本となるスタイルシートや画像がその中から呼べるので、タイトルまわりやメニューなどはhtmlさえ書いてあれば画像などのデータはいっさいいらないという仕組みである。
そして、その「common」フォルダに入っているスタイルシートの文字指定はといえば、もちろんピクセルではなく、パーセントの指定。これはブラウザの「文字サイズの表示」を変更すれば、大きい文字にして、閲覧できるという種類の指定方法である。
レイアウトがっちり方式に慣れてしまった身には、なかなかとっつきにくいことではあったけど、要はデザインを単純にし、写真や図などは切り刻まない。そして基本的なhtmlタグを適材適所に使うこと。これだけなのだ。デザインのためのテーブルは極力少なくし、<div> のタグとスタイルシートを使うことでファイルを軽くする。タイトルには <h1> をきちんと入れ、箇条書きには <ul> や <ol> を使う。つまり、テキストデータで入力していた原点の作り方をすればいいということで、そもそものWEBの考え方っていうのは、なかなかたいしたものだったのだ。
しかしこの時には、一番最初に基礎をがっちり勉強したことを本当に感謝した。当時はソフトが優秀になってきていたので、基礎をすっとばしても実際のデザイン作業にはなんら影響はなかったのだが、こうなってくると、基礎こそが大切になってくる。無駄な寄り道をしたかなあ、と思っていただけにひときわうれしいことだ。
4.
デザインはどうなっちゃう?
さて、こうやって単純化、記号化する方法はなんとかなった。しかし、その上でデザインもそこそこのレベルに持っていくというのは、けっこうたいへんなことだ。なにせ、文字の大きさが変わっても、それほど破綻しないような作りにしなければならないし。
しかも、前述の検閲ソフトによる制約がけっこうたくさんある。たとえば、テーブルにボーダー罫をつけると自動的に表組みとして認識してしまい、表組みには <th> タグがないと検閲に通らない。そのため、<th> タグはつける必要もないしそんな項目立てはできないけど、表組みにはしたい場合などは、罫線をつけずに「レイアウト用のテーブル」として表を作り、テーブルには黒い色をつけ、<tr> を白に指定するなどして、あたかも表組みの罫線があるように見せてしまうというような裏技をも使わざるを得なくなってしまう。
クライアントの意向とは若干ずれるのかもしれないが、検閲ソフトによる制約があまりにも杓子定規なため、検閲ソフト対WEBデザイナーの知恵比べ攻防が水面下で起こっているというわけである。これもまた、一種のゲームのようでなかなか楽しくはあるのだが、本筋でない部分で時間をとられるのはちょっとつらいものがある。
まあ、そういった例外だの抜け道だのは、どこにでもある話だし、それはそれとして、私個人としてはこのクライアントの考え方は全面的に支持しているし、本来、WEBに限らずデザインとはこうあるものだと思っている。私もぜひ、この機能性、わかりやすさ優先の考えを自分のWEBにもとりいれたい。がっくりくることには、以前自分で作ったページの文字も若干読みづらくなってきたことだし。
そこで、「徒然な言いグサ」と「植物写真鑑」に関しては、大改定をした。結果、文字は読みやすくなり、容量はすっかり小さくなったのだが、実を言えば、文字が読みやすくなったのは、Windowsでは、という条件付。Macintoshでは文字をパーセント指定すると、ピクセル指定の時と比べると文字が若干汚くなることがわかった。
まったく、デザインがブラウザやマシンに依存するって、本当にやっかいものだ。でも、とにかくWEBデザインって奥が深くて面白い。
2007年2月21日