21.単語の間のスペースがバリアに！

2008年10月2日掲載

ウェブ太くんは、ウェブ上でなにかのイベントのお知らせを見たことはありますか？
 

うん、あるよ。
最近だと…、歓迎会のお知らせを見たよ。

実はウェブ太くんが見たお知らせの中に、バリアが潜んでいるのです。今回は、そのお知らせを例に、見た目は整っていてもバリアができてしまうケースについて説明していきます。 では、さっそくその歓迎会のお知らせの「問題部分」を見てみましょう。

歓迎会のお知らせには、「日時」「場所」「参加費」といった項目が、きれいに並べて書かれています。ただ項目によって文字数が違うので、見た目を整えるために、単語の間にスペースを入れています。 実は、このスペースを入れることがバリアになるんです。

へぇー、そうなの？今までよくスペースで見た目を整えていたよ。
これじゃダメなんだね。でもさ、どうしてダメなの？

画面読み上げソフトを使っている場合、間にスペースが入っていることによって単語を正しく読み上げられないことがあります。

この例は、「日時」や「場所」という単語の間にスペースを入れ、「参加費」という3文字の項目に見た目を合わせたものです。このように、単語の文字と文字の間にスペースを入れてしまうと、ひとつの単語としてコンピュータは認識できなくなってしまいます。単語として認識できなければ、画面読み上げソフトで、正しく読み上げることができません。

ある画面読み上げソフトでは、「日時」は「ひとき」、「場所」は「ばところ」、「参加費」は「さんかひ」と読み上げます。

へー、こんな読み方になるんだ！
「参加費」以外は、意味がわからないよ。

文字と文字の間にスペースを入れると画面読み上げソフト利用者のバリアになることがわかりましたよね。でも問題は、ちゃんと読み上げられないだけではありません。

ウェブ太くんは、ページの中で、欲しい情報をなかなか見つけられないときに、検索機能を使うことはないですか？

たまにあるよ。文章全部読むの大変だから結構便利だよね。
 

では、さっきのお知らせのページで、「日時」を検索してみてください。
 

あれ、検索できないよ。
なんで？

画面読み上げソフトでちゃんと読み上げられないのと同じ理由です。 単語の文字と文字の間にスペースを入れてしまうと、コンピュータにとっては違う単語になってしまうので、このように検索機能がうまく活用できなくなってしまうのです。 では、「日」と「時」の間にスペースを入れて検索してみてください。検索できましたよね。

あっ、本当だ。でも普通はスペース入れて検索なんてしないよね。
画面読み上げソフトを利用している人以外にもバリアになることがあるんだね。

でもさ、見た目もきれいになって、さらに読み上げも正しくできる方法ってあるの？

もちろん方法はあります。
まず、単語の間に入っているスペースは削除します。そして、文字と文字との間隔を調整するスタイルシートを用いて、文字間を調整します。文字と文字との間隔を広げることで、スペースを入れることなく、見た目を整えることができます。 つまり、見た目はきれいに整い、さらにひとつの単語として認識できるので、画面読み上げソフトでも正しく読み上げることができるようになるのです。

なるほど。これだと見た目の配置も整えられるし、読み上げにも対応できていて、言うことないね！ スペースじゃなくて、スタイルシートを使って見た目を整える大切さがよくわかったよ。