問題タブ [wai-aria]

WAI-ARIA初心者です。既存のロールに基づいてカスタム ロールを作成する方法を知りたいです。

たとえば、アリア ボタン ロールからカスタム ボタン ロールを作成したいとします。誰かがそうするための手順を提供すれば、それは素晴らしいことです。

GWTでコンポーネントを作成しましたが、コンポーネントにアクセシビリティを追加する必要があります。GWT2.4を使用しています。IEDisclosurePanelにロールタグまたはariaタグを追加する方法。ありがとう。

WAI-ARIAaria-hiddenサポートと jQuery の .toggle() メソッドを組み合わせたいと思います。

与えられた<p id="myElement">Hi there</p>

$('#myElement').toggle()要素を非表示にして、次のように設定しaria-hidden="true"ます。

<p id="myElement" style="display: none;" aria-hidden="true">Hi there</p>

同じ$('#myElement').toggle()スクリプトを再度実行すると、要素が表示 (トグル) され、設定 (トグル) されますaria-hidden="false"。

<p id="myElement" style="display: block" aria-hidden="false">Hi there</p>

おそらく、メソッドの完全な機能を使用したいのですが、おそらく次のようなものです

状態.toggle()を切り替えるように拡張するための最もパフォーマンスの高いソリューションは何ですか?aria-hidden

http://validator.w3.org/nu/を使用して、ドキュメントでHTML5検証を実行しています。次のコードで検証エラーが発生する理由がわかりません。http://www.w3.org/TR/wai-aria/roles#treeitemを確認し、role="group"の要素ul内にrole="treeitem"のli要素を配置しても問題ないと思いました。nuバリデーターはそれが許可されていないことを教えてくれます。nuバリデーターが彼の評決で正しいかどうか知りたいのですが、正しい場合は、それを規定するARIAツリーのスキーマに関する情報をどこで見つけることができますか。ありがとうございました。

検証しないサンプルコード：

ですから、これは私が時々考え続ける小さな問題です。約1、2年の間、HTML5要素を使用する最良の方法に興味がありました。

私が見る最も頻繁なテクニック-ヘッダー、フッター、セクションなどの要素を、クラスとARIAの役割は別として使用します。古いブラウザにはhtml5shiv.jsを使用してください。

これは、プログレッシブエンハンスメントではなく、グレースフルデグラデーションとより一致します。古いモバイル/デスクトップブラウザでJSが有効になっていないか、まったく利用できない場合、HTML5要素のみで構築されたレイアウトのスタイルを設定する機能が失われます。

私が見たもう1つのアプローチは、プログレッシブエンハンスメントと一致し、レイアウトが正しく機能するために古いブラウザーでJSが有効になっていることに依存していません。これについて、Josh Clark[GlobalMoxie]と簡単に話しました。彼らはmでこのアプローチを使用しました。ピープルマガジンのバージョン。http://www.people.com/people/mobile/home/ HTML5要素を使用して、スタイリング用のクラスを使用してドキュメントとdivのセマンティクスの概要を説明しました。ヘッダー、フッター、脇、セクションなどのHTML5要素に依存するスタイルはありませんでした。

私の質問の1つは、ARIAの役割がすでにdivに設定されている場合、ドキュメントのマークアップにより良いアウトラインを与えるために、div / spanの周りにHTML5要素を重ねることは有益ですか？「セマンティックであること」以外に、これには何のメリットがありますか？

スタイリングに使用されるdivの周りにHTML5要素を追加する場合、ARIAロールをdivからHTML5要素に移動することは有益でしょうか？私はそうなると思いますが、このテクニックについてもっとフィードバックをもらいたいです。

javascriptを使用してコンボボックスで選択したアイテムを変更しようとしていますが、HTMLの通常の種類のドロップダウンリストのようには見えません。オンラインで回答を見つけようとしましたが、さまざまな種類のドロップダウンリストでしか回答が見つかりませんでした。私を助けてくれる人に感謝します。

コードは次のとおりです。

私は、アコーディオンの WAI-ARIA 1.0 Authoring Practicesを含むように拡張された jQuery アコーディオンを使用しています。NVDA を使用した場合の結果は、すべてのブラウザーで期待したとおりです。アコーディオンのヘッダーに注目すると、ヘッダー内のすべてが読み取られます。

IE 9 と JAWS を組み合わせると、JAWS はヘッダーの最初の行のみを読み取り、残りのコンテンツをスキップします。Chrome と Firefox を使用する JAWS は、ヘッダー全体を読み取ります。

ヘッダー HTML のコンテンツ:

これがシナリオです。実際に表示されているもの以外の見出しを読み上げるには、スクリーン リーダーが必要です。

「私の見出し」が表示されますが、スクリーン リーダーは「これは私の見出しです」と読み上げます

上記のコードは、VoiceOver で必要な動作を実現しますが、JAWS に同じ動作をさせることはできません。JAWSで動作させる方法はありますか?

最終的には、VoiceOver と JAWS の両方と互換性のあるソリューションを探しています。

ありがとう

レスポンシブウェブサイトがあります。ウェブサイトがモバイル幅に達すると、メニューが非表示になり、メニューアイコンをクリックしたときにのみ表示されます。このアイコンは、このブレークポイントに到達するまでHTML内で非表示になります。

質問：要素に付ける必要のある正しいラベルは何ですか？

aria-hidden="true"デスクトップブラウザに適したものを追加することを考えていましたが、モバイルでは非表示になりません。

私は、より大きなサイト内で動的に構築されたクイズでアクセシビリティの作業を行っています (質問を入力するために Knockout バインディングを使用しています)。現在、ラジオ ボタンの質問に取り組んでいます。当初、適切な場所に「aria-labeledby」を貼り付けるノックアウトがいくつかありましたが、フィールドセットと凡例を適切に使用すると、ロード時間が短縮されると判断しました。

私たちのフレームワークでのみ、IE8 で JAWS 12 を使用して、ラジオ要素に焦点を当てると、ラベルのみが読み取られ、凡例は読み取られません。

私はこの簡単なサンプル コードも取り上げました。フレームワーク内に貼り付けたところ、凡例の読み取りが停止しました。

私たちのサイトから HTML 全体を投稿する必要があることはわかっています (多数のテンプレートから作成されています) が、巨大です。

ここに私が心配しているいくつかの初期のビットがあります：

そして、これが実際のラジオの質問です。

人々は、私がこれを引き起こしているものを継承している可能性があるという考えを持っていますか?

前もって感謝します！