web-dev-qa-db-ja.com

アクセシビリティを正しくするには、iframeにタイトルを付けるにはどうすればよいですか?

最近、サイトでGoogleタグマネージャーの使用を開始し、アクセシビリティをテストするツールを使用しています。

Googleタグマネージャーによって生成されたiframeに関して、WCAG 2.0レベルAに対してサイトを実行すると、エラー(WCAG 2.0レベルA 2.4.1および4.1.2)が発生します。

<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-XXX" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>

フレームのタイトルは少し新しいので、この要素のタイトルの推奨は何ですか? HTML img要素では、空のalt/title属性(<img src="cosmetic-image.jpg" alt="" />);ここでも同じようにできますか、それともユーザーのアクセシビリティに影響しますか?

私が探しているものをもう少し明確にするために、アクセシビリティが必要なユーザーのために、iframe/frameがユーザーが読み取り/使用する必要のあるコンテンツを提供しないことをどのように示すことができますか?

私の当初の感想は「Googleタグマネージャー」をタイトルにしたのですが、平均的なユーザーはそれを理解できません。コンテンツがあり、「グローバルナビゲーション」、「メインコンテンツ」などを置いていたのではありません。

7
James Skemp

(チェックツールが報告したエラーは無視します。これは実際のエラーである場合とそうでない場合があります。)

iframeの内容が意味を持たない(つまり、装飾的/プレゼンテーション的なもののみである)ことを表明したい場合は、WAI-ARIAの presentation role を使用できます。

HTML5では、 iframe element は次のWAI-ARIAロールのいずれかを持つことができます。
applicationdocumentimgpresentation

Ville Niemiがコメントで指摘しているように、 aria-hidden state を代わりに使用する必要があります(CSSでiframeを非表示にしているようです)。その場合、そもそも認識可能でなければ、役割がどんな役割を持っているかは関係ないため、役割を追加する必要はありません。

6
unor

ブラウザに関する限り、iframe要素のタイトル<iframe title="Web Page Title">はWebページのタイトルとまったく同じです<head><title>Web Page Title</title></head>

あなたが探している情報は、次のスレッドで見つけることができます。

ウェブサイトのタイトルはどのように構成する必要がありますか?

2
DaveAlger