文章の色・行の長さ・間隔・大きさを、読みやすい形にできるようにする。

05条件と補足

五つの条件を実現する仕組み

この基準は、見た目として表示するテキストブロックが対象です。テキストブロックは、単独の一文より長い文章のまとまりを指します。次の五つをすべて実現できる仕組みが必要です。

例えば文字サイズ16px・行送り24pxなら、段落間の追加の間隔は36px以上にする方法があります。文字の上下に24pxずつ余白を足す意味ではありません。行送りは隣り合う行の位置の間隔、段落間の追加の間隔は文章のまとまりを区別する余白として考えます。

初期表示と、利用者が選ぶ表示

初期表示をすべてこの値に固定することが要件ではありません。サイト内の設定、ブラウザーなど、利用者が条件を実現できる仕組みがあれば使えます。サイト独自の色選択や文字サイズのボタンを必ず付けるという基準でもありません。

ブラウザーの設定を使う方法では、その設定をサイトが上書きしてしまわないかも確認します。色の選択は、明暗差の大きい配色だけを押し付ける意味ではありません。人によっては、特定の背景色や文字色で読みやすくなることがあります。

図は、サイト内に設定を設ける方法の一例です。日本語の案内を短い行で表示し、片側揃え、広い行と段落の間隔を使っています。文字サイズを変える操作は図内の実演であり、ブラウザー全体の拡大とは区別します。

拡大と全画面表示

全画面表示は、一般的なデスクトップやノートPCで、ブラウザーのウィンドウを画面いっぱいにした状態で確認します。特定の全画面モードを実装する義務ではありません。

一行を読むために何度も左右へスクロールすることを避ける条件です。別の段へ移るための横スクロールまで、一律に禁止する意味ではありません。スマートフォンの小さな画面や、とても長い単語・URLの扱いは、公式解説も確認します。図は幅320pxでも折り返しますが、その表示確認だけで、この拡大条件をすべて確認したことにはなりません。

言語と、ほかの基準との違い

言語や文字体系によって、読みやすい表示の方法は異なります。その文字体系で使わない表示項目まで、一律に使わせる要件ではありません。日本語のページ全体を対象外にするという意味ではなく、実際の文章に合う条件を確認します。

1.4.4「テキストのサイズ変更」は200%まで拡大したときの内容と機能、1.4.10「リフロー」は所定の表示幅などでの折り返しを扱います。1.4.8には、文章の配色・行長・揃え方・間隔の条件もあります。

1.4.12「テキストの間隔」は、利用者が四つの間隔を同時に上書きしても内容や機能を保つ基準です。1.4.8の段落の間隔は行送りを基準にするため、1.4.12の「文字サイズの2倍」と取り違えないようにします。