ズームとスケーリングを無効にしないでください

ルールID: meta-viewport
ルールセット: axe-core 4.10
ユーザーへの影響: 緊急
ガイドライン: WCAG 2.1 (AA), WCAG 2.0 (AA), WCAG 2.2 (AA), EN 301 549
 

Need accessibility training?

Deque University offers an extensive curriculum of self-guided online courses for every skillset and experience level.

Compliance Data & Impact

User Impact

緊急
Minor
Critical

Disabilities Affected

  • ロービジョン

Standard(s)

  • WCAG 2.1 (AA)
  • WCAG 2.0 (AA)
  • WCAG 2.2 (AA)
  • EN 301 549

WCAG 達成基準 [WCAG 2.1 (AA)]

  • 1.4.4: 必須: Resize text

WCAG 達成基準 [WCAG 2.0 (AA)]

  • 1.4.4: 必須: Resize text

WCAG 達成基準 [WCAG 2.2 (AA)]

  • 1.4.4: 必須: Resize text

    修正方法

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

    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% まで拡大できるように設計することを求めています。

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

    ルールの説明

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

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

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

    リソース

    その他のリソース

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

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

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

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

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

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