34

ARIA デモンストレーション Web サイトでrole="contentinfo"は、通常、要素に追加されfooterます。

ただし、最新の Web デザインのフッターは創造的であり、補助的なナビゲーション リンク、ソーシャル Web サイトのリンク、またはニュースレターのフォームなどを含めることもできます。

たとえば、フッターの次のコードを取ります。または要素 role="contentinfo"に追加する必要がありますか?footerp

<footer>
    <nav>
        <ul>
            ........
            ........
            ........
            ........
            ........
        </ul>
    </nav>
    <form>
        ........
        ........
        ........
    </form>
    <p>© 2012 Website.com. All rights reserved.</p>
</footer>


編集: W3C ARIA メーリング リストを利用してこの質問をしたところ、W3C HTML ワーキング グループのメンバーである Steve Faulkner が回答しました。彼の提案は次のとおりです。

また、ブラウザーがフッター要素をアクセシビリティ API にマップする方法も考慮に入れます。
Firefox では、フッターは ARIA role=contentinfo にマップされます
Webkit/safari/chrome では、フッターがセクションまたは記事要素内に含まれている場合、フッターは ARIA role=group にマップされます。それ以外の場合は、role=contentinfo にマップされます
IE ではマップされません


<div role="contentinfo">
    some content < footer
    >some content</footer>
</div>

ネストされた contentinfo ランドマークが、既にフッターを contentinfo にマップしているブラウザーでアナウンスされるようになります。

したがって、role=contentinfo をメイン フッターに追加することをお勧めします。フッターに配置するのが適切でないと思われるコンテンツについてあまり心配する必要はありません。


したがって、推奨されるアプローチはrole="contentinfo"main に追加することfooterです。

4

4 に答える 4

10

あなたの場合、フッタータグにあるはずだと思います。

親ドキュメントに関する情報を提供することを目的としているため、フッター要素が親の適切なコンテキストを提供する場合に使用します.

https://www.w3.org/TR/wai-aria/#contentinfo

于 2012-06-26T01:33:53.447 に答える
7

今のところ、決定的な正解はありません。

仕様に従う場合: http://www.w3.org/TR/wai-aria/roles#contentinfoは、次のcontentinfoように記述されています。

「親ドキュメントに関する情報を含む、認識可能な大きな領域。ページのこの領域に含まれる情報の例は、著作権とプライバシーに関する声明へのリンクです。」

したがって、この場合は<p>タグに配置する必要があります。

ただし、これらのランドマークを利用しているユーザーであると想定してください。誰もがrole="contentinfo"に を付ければfooter、それがユーザーの期待です。ユーザーは「仕様」が何を言おうと気にしません。Web サイトから Web サイトへとブラウジングする際に、一貫したエクスペリエンスを望んでいるだけです。contentinfo多くのサイトで実装されている方法であり、あなたが言及したように、多くのアクセシビリティの専門家が推奨する方法であるため、彼らはおそらくフッター リンクなどがセクションにあることを期待しています。

私はユーザーに応えることを好むので、それを要素に適用しますが、これは仕様(または少なくとも私の解釈) に反すること、およびこれの実装はブラウザーとして変更される可能性があることをfooter念頭に置いています。およびその他のアクセシブルなテクノロジは、より一貫した方法でアクセシビリティを実装し始めています。

于 2014-01-24T17:17:51.210 に答える
3

私はその<p>要素を使います。つまり、HTMLのポイントは、テキストにコンテキストを与えることです。したがって、適切なマークアップを実行して、適切なコンテキストを提供します。

最も適切な要素に役割を与えます。これはフッター要素に限定された属性ではありません。

于 2012-06-25T15:06:31.407 に答える
1

セマンティクスは HTML5 仕様を通じて既に伝えられているため、これは冗長な情報です

通常、ARIA の役割が HTML5 要素のセマンティックな理解と重複する場合はスキップできます。

これは正しいと思いますが、これが正確かどうかを判断するには、スクリーン リーダーでテストする必要があります。

于 2016-02-26T18:38:50.830 に答える