文字サイズ変更ボタンは必要？アクセシビリティ達成基準から判断する
「大」「中」「小」と文字サイズを切り替えるボタンを付けたい——そんな要望を、クライアントから受けたことはないでしょうか。自治体などの公的機関のサイトでよく見かけるあの機能です。
アクセシビリティの達成基準を満たすために、この機能は必要なのでしょうか。
結論から言うと、必ずしも必要ではありません。ブラウザの標準機能によって、達成基準を満たせていることが多いからです。
この記事では、文字サイズに関するアクセシビリティの達成基準を整理しながら、コントローラーの要・不要をどう判断すればよいかを解説しています。
文字サイズに関する達成基準
アクセシビリティのチェック項目のひとつに、「文字を200%まで拡大しても、内容が問題なく読めて、操作もできること」が求められています。具体的な達成基準は次のとおりです。
キャプション及び文字画像を除き、テキストは、コンテンツ又は機能を損なうことなく、支援技術なしで 200% までサイズ変更できる。
達成基準 1.4.4 テキストのサイズ変更 - WCAG 2.1（WAIC日本語訳）
小さい文字は読めなくても、大きい文字なら読める人は大勢います。サイト側で特別なソフトを用意しなくても、ブラウザの拡大機能だけで文字を読めるようにする——そうした配慮が、この基準の趣旨です。
達成基準を満たす2つの方法
この達成基準を満たす方法として、次の2つの方法が挙げられます。
- ブラウザのズーム機能に対応する：ブラウザが備えている拡大機能を、サイト側が妨げない
- サイト側で独自のコントロールを提供する：いわゆる文字サイズ変更ボタンを設置する
つまり、独自ボタンはあくまで選択肢の1つであり、必須ではありません。
ブラウザのズーム機能で基準をクリアできることが多い
現代の主要なブラウザは、すべてズーム機能を備えています。Chromeであれば、Macではcommand + +、WindowsではCtrl + +のキー操作や、右上のメニューの「ズーム」から、ページを25%〜500%の間で拡大縮小できます（200%を大きく超える範囲までカバーしています）。
つまり、サイトに文字サイズ変更ボタンを付けなくても、ブラウザのズームが正しく使えればこの基準は満たせます。ブラウザのズーム対応のみでこの達成基準をクリアしているケースは多いでしょう。
ブラウザのズームだけでは違反となり得るケース
ただし、「ブラウザに任せておけば必ず大丈夫」というわけではありません。サイト側の作りによっては、ズーム機能があっても達成基準違反となり得ます。代表的なのは次の3つのケースです。
200%に拡大すると文字が重なる・見切れる
達成基準が求めているのは、拡大できることだけではなく「コンテンツ又は機能を損なうことなく」拡大できることです。200%に拡大した際に文字が重なったり、見切れて読めなくなったりする場合は、違反と判断され得ます。
デジタル庁の「ウェブアクセシビリティ導入ガイドブック」でも、次のようなNG例が示されています。
そもそもズームが効かない
CSSでの文字サイズの指定方法によっては、ブラウザのズーム機能を使っても文字が拡大されないことがあります。代表的なのは、ビューポート単位（vwなど、画面幅を基準にする指定方法）だけで文字サイズを指定しているケースで、WCAGの公式文書でも失敗例として明記されています。
このあたりの技術的な詳細は、文字サイズのpx指定はアクセシビリティ違反なのか？達成基準の解釈を整理するで解説しています。実装者向けの内容ですが、興味のある方はあわせてご覧ください。
ズーム機能そのものを無効化している
HTMLのmetaタグの設定（user-scalable=noなど）によって、スマートフォンでのピンチズームを無効化しているケースです。ユーザーが拡大する手段を奪ってしまうため、達成基準違反となり得ます。デジタル庁のガイドブックでも「使用しない」ように明記されています。
文字サイズ変更ボタンを置くメリット・デメリット
達成基準のクリアに必須でないなら、自治体サイトなどで導入されている文字サイズ変更ボタンにはどのような意味があるのでしょうか。メリットとデメリットを整理してみました。
| メリット | デメリット |
|---|---|
|
|
こうして並べてみると、メリットよりもデメリットの方が多く、この達成基準はサイト独自のボタンではなく、ブラウザ側の機能で満たす方が合理的と言えるでしょう。
デジタル庁のガイドブックでは「非推奨」とされている
デジタル庁の「ウェブアクセシビリティ導入ガイドブック」では、文字サイズ変更ボタンのような機能をサイト側で提供することは、一歩踏み込んで非推奨に位置付けられています。
理由は、文字の拡大を必要とするユーザーは、すでにOSやブラウザの機能を使いこなしていることが多く、サイト個別の実装はそれと重複する上に、そのサイトでしか使えないためです。
文字サイズ変更ボタンを多く導入してきたのは自治体などの公的機関のサイトですが、その行政のガイドラインを取りまとめる立場のデジタル庁が「非推奨」としているのは、少し意外に感じられるかもしれません。
「ボタンを付けてほしい」と言われたら
とはいえ、実際の案件ではクライアントから文字サイズ変更ボタンの設置を希望される場合もあるでしょう。次のような観点で整理して、判断・説明することをおすすめします。
- 誰のための機能か：要望の背景に具体的なユーザー像（ブラウザのズーム操作に不慣れな高齢のユーザーなど）があるのか、それとも単に「他の自治体サイトにもあるから」なのかを確認する。
- 実装・保守コストに見合うか：全ページに一貫して効かせ続けるコストと、得られる効果を天秤にかける。
上記を踏まえて、ボタンの設置がアクセシビリティ上の配慮として本当に意味を持つかどうかを判断する必要がありそうです。
まとめ
文字サイズ変更ボタンの要・不要について整理しました。
- 文字サイズ変更ボタンは、アクセシビリティの達成基準を満たすために必須ではない。ブラウザのズームが正しく使えれば基準をクリアできることが多い。
- 大事なのは、200%に拡大しても読める・操作できるページであること。
- デジタル庁のガイドブックでも、ボタンの設置は非推奨と位置付けられている。
- ズーム操作に不慣れなユーザーが多いサイトなど、設置に意味があるケースもある。目的とコストを整理して判断する。
参考サイト
この記事を書いた人
