HTMLの「ロール」属性の目的は何ですか？

一部の人の仕事には、役割の属性が見られます。私も使っていますが、効果はわかりません。

例えば：

<header id="header" role="banner">
    Header stuff in here
</header>

または：

<section id="facebook" role="contentinfo">
    Facebook stuff in here
</section>

または：

<section id="main" role="main">
     Main content stuff in here
</section>

この役割属性は必要ですか？

この属性はセマンティクスに適していますか？

それはSEOを改善しますか？

役割のリストはこちらにありますが、自分で作成する人もいます。それは許可されていますか、それとも役割属性の正しい使用ですか？

これについて何か考えはありますか？

表示されるほとんどの役割は、ARIA 1.0の一部として定義され、その後HTML5に組み込まれました。新しいHTML5要素のいくつか（ダイアログ、メインなど）は、元のARIAロールにも基づいています。

http://www.w3.org/TR/wai-aria/

ネイティブのセマンティック要素に加えてロールを使用する主な理由は2つあります。

理由＃1。適切なホスト言語要素がない場合、またはさまざまな理由により、意味的にあまり適切でない要素が使用された場合の役割のオーバーライド。

この例では、結果の機能がナビゲーションリンクよりもボタンに似ていますが、リンクが使用されました。

<a href="#" role="button" aria-label="Delete item 1">Delete</a>

スクリーンリーダーはこれを（リンクではなく）ボタンとして認識します。CSS属性セレクターを使用して、class-itisやdiv-itisを回避できます。

*[role="button"] {
  /* style these a buttons w/o relying on a .button class */
}

理由＃2。ARIAロールを実装したが、まだネイティブ要素のロールを実装していないブラウザーをサポートするための、ネイティブ要素のロールのバックアップ。

たとえば、「メイン」の役割はブラウザで長年サポートされてきましたが、HTML5への比較的最近の追加であるため、多くのブラウザはまだのセマンティクスをサポートしていません<main>。

<main role="main">…</main>

これは技術的に冗長ですが、一部のユーザーに役立ち、害はありません。数年後には、この手法はおそらく不要になるでしょう。

あなたも書いた：

自分で作る人もいます。それは許可されていますか、それとも役割属性の正しい使用ですか？

実際のロールが含まれていない限り、これは属性の有効な使用法です。ブラウザーは、トークンリストで最初に認識されたロールを適用します。

<span role="foo link note bar">...</a>

リストのうち、唯一linkかつnote有効な役割であり、それが最初に来るので、リンクの役割が適用されますので。カスタムの役割を使用する場合は、ARIAで定義されている役割や使用しているホスト言語（HTML、SVG、MathMLなど）と競合しないようにしてください。

私が理解しているように、役割は当初XHTMLによって定義されていましたが、廃止されました。ただし、現在はHTML 5で定義されています。https：//www.w3.org/WAI/PF/aria/roles#abstract_roles_headerを参照してください。

role属性の目的は、Webアプリケーションの一部として要素（およびその子）の正確な機能を解析するソフトウェアを識別することです。これは主にスクリーンリーダーのアクセシビリティに関するものですが、埋め込みブラウザやスクリーンスクレイパーにとっても便利だと思います。通常とは異なるHTMLクライアントで役立つようにするには、属性を、リンクした仕様のいずれかのロールに設定する必要があります。自分で作成した場合、この「将来」の機能は機能しません。コメントの方がいいでしょう。

ここでの実用性：http : //www.accessibleculture.org/articles/2011/04/html5-aria-2011/

この役割属性は必要ですか？

回答：はい。

• 言語が独自のロール属性を定義していない場合に、XMLベースの言語でロールを定義するためにAccessible Rich Internet Applications （WAI-ARIA）をサポートするには、ロール属性が必要です。
• これが役割と属性がProtocols and Formats Working Groupによって公開された理由ですが、属性にはより一般的な使用例もあります。

それはあなたを提供します：

• アクセシビリティ
• デバイスの適応
• サーバー側の処理
• 複雑なデータ記述など...

これは古い質問だと思いますが、正確な要件に応じて考えられるもう1つの考慮事項は、https：//validator.w3.org/で検証すると次のような警告が生成されることです。

警告：フォームの役割は要素フォームには不要です。

ロール属性は主に、スクリーンリーダーを使用するユーザーのアクセシビリティを向上させます。アクセシビリティ、デバイスの適応、サーバー側の処理、複雑なデータ記述など、いくつかのケースで使用します。もっと知ってクリック：https : //www.w3.org/WAI/PF/HTML/wiki/RoleAttribute。