ユーザーは、テキストを最大500%までズームおよび拡大縮小できる必要があります

ルールID: meta-viewport-large
ルールセット: axe-core 4.10
ユーザーへの影響: 軽微
ガイドライン: Deque Best Practice
 

Start building more accessible experiences

Axe DevTools Pro helps dev teams find and fix up to 80% of accessibility issues while coding. No experience required. Get started with your free trial today.

Compliance Data & Impact

User Impact

軽微
Minor
Critical

Disabilities Affected

  • ロービジョン

Standard(s)

  • Deque Best Practice

    修正方法

    ズーミングを可能にするため、user-scalable="no" パラメーターを <meta name="viewport"> 要素の content 属性から削除し、maximum-scale パラメーターが5より上であることを確認します。

    meta viewport 要素は、ブラウザーにページの大きさや拡大縮小を制御する方法を伝えますが、それを使用した結果、ズームする機能は無効化されてしまいます。

    注記:

    ブラウザーのビューポートフォーカスはプログラムによるフォーカスには影響しませんが、ウィンドウが小さい場合、そのエリアにはページのごく一部のみが含まれ、プログラム可能なフォーカスはビューポートを追従しません。

    ズーミングを可能にするため、user-scalable="no" パラメーターを <meta name="viewport"> 要素の content 属性から削除します。

    なぜ重要なのか

    <meta name="viewport"> 要素についている content 属性の user-scalable="no" パラメーターはページのズーミングを無効にします。maximum-scale パラメーターはユーザーがズームできる量を制限します。これは web ページのコンテンツを正確に見るためにスクリーンの拡大鏡に頼っているロービジョンのユーザーにとって問題です。

    部分的に視力を持つ、またはロービジョンのユーザーは通常、web 上のテキストを読みやすくするため、ブラウザー上のフォントを拡大することを選びます。ブラウザーのビューポートフォーカスは、特定の瞬間にブラウザーウィンドウ内に表示されるすべてのものです。ユーザーがブラウザーを高解像度モニターで最大化させた場合、ビューポートのフォーカス領域が大きいので、web ページ全体を含む可能性があります。

    ブラウザーウィンドウが小さい場合、ビューポートのフォーカス領域には web ページのごく一部しか含まれません。ブラウザーのビューポートフォーカスは、プログラムによるフォーカスには影響しません。ユーザーは web ページを上下にスクロールできますが、プログラムによるフォーカスはビューポートに追従しません。Web Content Accessibility Guidelines では、開発者にページを 200% まで拡大できるように設計することを求めていますが、5倍ズームを求めることがベストプラクティスです。

    ルールの説明

    ロービジョンのユーザーにとって重要なテキストの拡大縮小やズーミングを無効化するため、ドキュメントは user-scalable="no" パラメーターを <meta name="viewport"> 要素に使用してはなりません。

    仕組みについて (簡単に言うと)

    user-scalable="no" パラメーターが <meta name="viewport"> 要素に存在しないこと、および maximum-scale パラメーターが500%より上であることを確認します。

    リソース

    その他のリソース

    その他リソースもあわせてご参照ください。

    axe 4.10 ルールの一覧 を参照する

    この情報は役に立ちましたか?

    すでにフィードバックをいただきました、ありがとうございます。.

    あなたの回答は次のとおりです。

    この情報は役に立ちましたか?
    フィードバックが提出された日付/時刻: