このページの本文へ移動

Resize text1.4.4 テキストのサイズ変更(レベルAA)

キャプション及び文字画像を除き、テキストは、コンテンツ又は機能を損なうことなく、支援技術なしで 200% までサイズ変更できる。

出典:WAIC. “ 達成基準 1.4.4 を理解する新しいウィンドウを開きます ” WCAG 2.0 解説書(参照2024年6月1日)

概要

ユーザーがテキストを200%まで拡大してもコンテンツが利用可能であり、機能が損なわれないことを求めています。これにより、視覚障害を持つユーザーが、ウェブコンテンツをより容易に読み取ることができるようになります。

このページでは、ウェブサイト制作でよく直面する課題に対して、基本的で取り組みやすい方法を紹介しています。
ただし、他にも対処すべき状況や多くの手段があり、具体的な状況に応じて最適な方法を選ぶことが大切です。

課題に対する実践的な方法

ズーム機能の使用

ウェブページを作成する際、一般的に使用されるブラウザ(ユーザエージェント)が提供するズーム機能を活用できるように設計します。例えば、標準的なHTMLとCSSを使用し、コンテンツが拡大されてもレイアウトが崩れないようにします。

em単位でサイズ指定

テキストコンテナのサイズをem単位で指定することにより、ユーザーがブラウザのズーム機能を使用してテキストサイズを変更しても、レイアウトが適切に調整されます。em単位は、フォントサイズに依存する相対単位であるため、テキストの拡大縮小に柔軟に対応できます。

パーセントでフォントサイズ指定

フォントサイズをパーセントで指定することで、基準となるフォントサイズに対して相対的にテキストのサイズを調整できます。これにより、ブラウザのズーム機能を使った際にも、ユーザーが意図した通りの表示が保たれます。

名前付きフォントサイズ

名前付きフォントサイズ(例えば、small、medium、largeなど)を使用することで、標準的なサイズの変化を提供し、ユーザーがテキストを読みやすいサイズに簡単に調整できるようにします。

レイアウト調整

テキストサイズを変更しても、テキストコンテナの幅を変更しないように設計します。これにより、レイアウトが崩れず、コンテンツや機能が失われないようにします。例えば、固定幅のコンテナを使用する場合、内部のテキストが溢れないように調整します。

まとめ

達成基準1.4.4の遵守は、視覚に障害のあるユーザーにとって、ウェブコンテンツをよりアクセスしやすくするために重要です。実践的な方法としては、ユーザエージェントのズーム機能のサポート、em単位やパーセントを使用したフォントサイズ指定、テキストサイズを変更できるコントロールの提供、レイアウトの調整などが挙げられます。これらの方法を取り入れることで、すべてのユーザーが快適にウェブコンテンツを利用できるようになります。

WCAG 2.0とその翻訳文書の利用について

本ページの内容は、「Web Content Accessibility Guidelines (WCAG) 2.0新しいウィンドウを開きます」、「WCAG 2.0 解説書新しいウィンドウを開きます」および「WCAG 2.0 達成方法集新しいウィンドウを開きます」からの引用を含んでいます。引用された内容は、W3CおよびWAICによって公開されており、以下のクリエイティブ・コモンズライセンスに基づいて使用されています。これらのガイドラインを参考にしつつ、ウェブアクセシビリティの向上に向けた具体的な取り組みを分かりやすく説明しています。

WCAG 2.0

この作品はクリエイティブ・コモンズ 表示 4.0 国際ライセンス新しいウィンドウを開きますの下に提供されています。

WCAG 2.0 解説書及び達成方法集

この作品はWCAG 2.0 解説書及び達成方法集からの引用を含みます。翻訳はWAICによって提供されており、文書のステータスは「勧告」です。なお、この文書の正式版はあくまでW3Cのサイト内にある英語版であることにご注意ください。

Contactお問い合わせ

当社ではウェブアクセシビリティ診断を提供しております。すべてのユーザーにアクセスできるウェブサイトを目指して、一緒に取り組みましょう。診断のご依頼や詳細については、お気軽にご連絡ください。

お問い合わせ