余白(アクセシビリティ)
余白におけるアクセシビリティ観点での留意点について説明します。
空白や両端揃えを使ってレイアウトを調整しない
余白の種類には空白(ホワイトスペース)がありますが、これはCSSのword-spacing、letter-spacing、あるいは両端揃え(text-align: justify)によって表現されるような小さな余白のことです。
単語間のスペースによってテキストブロック内には意図せず川(タイポグラフィのリバー)が生じます。両端揃えには、標準的な両端揃えのほか、inter-word(word-spacingを変化させる)、inter-character(letter-spacingを変化させる)といった種類の設定があります。偶然に生じる分の川を回避することはできませんが、両端揃えによって川が余計に多く生じることで、認知障害のあるユーザーの多くはテキストを読むことが困難になることがあります。
日本語文字の文章は、ふつう空白で単語を区切らないため、川はあまり生じません。しかし表組のセル内や定義リストの見出し等で両端揃えをするケースはしばしば散見されます。文字と文字の間隔が大きいと、特に拡大ソフトウェアを用いるロービジョンのユーザーにとっては一つの言葉に読めないことがあるなど不都合があることにも留意してください。
なお、空白文字(全角スペース、あるいは「 」)を使って文字の位置をそろえようとする試みについては、そもそも単語が文字単位で分断されてもとの言葉の原型が失われてしまい、スクリーンリーダーでの読み上げに支障をきたします。
空白や両端揃えを使って文字の表示位置やレイアウトを調整しないようにしましょう。