問題タブ [section508]

真の衒学者への質問

何かが私の目にとまり、この質問を促したとき、私はChromeの開発者ツールの要素タブを調べていました。

タグの意味のあるalt属性imgはアクセシビリティに必要な期待ですが（ alt = " OliviaCulpo<img src="/path/to/beauty.png"がミスUSA2012コンテストで優勝しました" ）/>、「スペーサー」またはその他の「装飾的な」画像の属性に空白の値：= "" alt<img src="/images/spacer.gif" alt/>

これらの質問は、装飾的な画像のみを対象としています。

• alt属性を宣言したが、定義しないとどうなりますか： <img src="/images/spacer.gif"alt/>
• 2つのオプションのうち、どちらが最適ですか（そしてその理由）？

私はこの質問を知っています: JavaScript リンクには、「#」または「javascript:void(0)」のどちらの「href」値を使用する必要がありますか? javascript リンクの正しい href コンテンツがどうあるべきかについての議論が含まれています。これは 508 準拠とどのように関連していますか? クリックハンドラがJavaScriptコードの他の場所で定義されている場合、 javascript:void(0) が許容されるかどうかは誰にも分かりますか?

特定のブラウザーでは、スクロール可能な div 要素がフォーカスを受け取ることができるように見えます。その要素にフォーカスがあると、ユーザーは矢印キーとページの上下を使用できます。私の会社は 508 に完全に準拠しようとしているので、この機能についてできる限りのことを学びたいと思っています。

私の質問は、スクロール可能な要素でフォーカス イベントをサポートするブラウザーはどれですか?

私はカスタム スクロール バー コンポーネントを作成して、よりスタイリッシュなスクロール コンテナーを作成し、UX (ユーザー エクスペリエンス) の人たちを満足させてレイアウトをきれいにしようとしています (はい、これは良い考えではない可能性が高いことは承知しています)。要件を満たすコンポーネント。

カスタムのスクロール可能な div 要素を 508 に完全に準拠させる方法について、ここで提供できるその他の情報/ヒントは素晴らしいでしょう。

現在、次のことを検討しています。

1. スクロール可能な要素に焦点を当てると、矢印キーで上/下およびページ/上/下が可能になります...どのブラウザーですか? これはすべてのブラウザですか？
2. マウスの中ボタンが機能するはずです (マウスの動きに合わせて高速スクロールが表示されます)。
3. マウスホイールが機能するはずです
4. 通常は矢印キーを使用しないスクロール可能な要素 (input や textarea など) 内の何かにフォーカスがある場合、矢印キー/ページアップ/ダウンは div をスクロールします

忘れているスクロールを移動する他の方法はありますか?

この問題は、アクセシビリティ（508）への準拠に関するものです。

ツールチップに表示されるtitle属性のリンクがあります。そのツールチップの中には、略語「Dr」があります。<abbr>スクリーンリーダーに「dur」ではなく「doctor」と表示させるには、 2行目のように略語をタグで囲む必要があります。

ただし、タイトルタグ内でabbrタグを使用すると、ポップアップツールチップに次のように表示されます。

これは、altまたはtitle属性内にabbrタグをネストできないことを意味すると思います。そうすることで、タグは常に通常のテキストとして表示されます。同意しますか？回避策はありますか？これに対する答えはどこにも見つからないので、StackOverflowに初めての質問を送信します。他のほとんどの投稿の雄弁さを私が十分に持っていない場合は、すみません。

この機能を必要とする他の誰かのインスタンスを他の場所で 1 つも見つけることができなかったという事実を考慮すると、これは壁から離れた要件である可能性があります。それは言った：

私が取り組んでいる Web サイトでは、フォーム検証のために数十の異なるバリデータ コントロール (RequiredFieldValidaotrs から CustomValidators までのすべて) を使用しています。セクション 508 への準拠の一環として、CSS を無効にするユーザーをサポートする必要があります。これは、バリデーターがエラー テキストをページにレンダリングし、CSS 表示プロパティを使用して非表示にするため、問題があります。CSS を無効にすると、すべてのエラー メッセージが表示され、スクリーン リーダーで読み上げられます。

ラベルとポストバックを使用してラベルを表示および非表示にする以外に、CSS を無効にして ASP.Net バリデータ コントロールを使用する既知の方法はありますか?

私は現在、508/ADA 準拠のライトボックスを開発しようとしています。これを実現するには、ライトボックスを表示させ (既に完了しています)、ライトボックスのすぐ後ろにあるページテキストにフォーカスを変更してそれを読むのではなく、NVDA などのリーダーにライトボックスの内容を読み取らせる必要があります。より簡潔に言えば、ライトボックスをオンロードで表示し、フォーカスをライトボックスに残し、バックグラウンドに戻らずに NVDA がライトボックスの内容を読み取るようにします。他の誰かが回答を提供する前に回答が得られた場合は、更新を続けます。

現時点では、この問題の解決策はありません。これは、Aria-hidden が適切に認識されない NVDA の問題です。http://www.nvda-project.org/ticket/2706 // http://www.nvda-project.org/ticket/2117 -

私が提案する解決策：

メッセージが表示されることを意図している場合にのみ、展開または折りたたみ / 表示または非表示を行う iFrame (または DIV) を作成します。これにより、NVDA の参照ポイントとなる「フォーカス可能な」領域が作成されます。この問題に対する JavaScript/JQuery ソリューションの開発を続けます。

このコントロールを 508 コンプライアンス テストに合格させるためにいくつかの方法を試しましたが、すべて失敗したようです。テスターからのフィードバックはなく、合格/不合格のみです。ラジオボタンの周りに自動的にレンダリングされるテーブルに関係していると思われます。ラベルはテーブル内にある必要があると思いますが、これは RadioButtonList のオプションではありません。以下は私が試して失敗した方法です。

フィールドセット/レジェンド ソリューション

ASP/NET ページ:

レンダリングされた HTML:

AssociatedControlID を使用してコントロールをラベルにリンクする

ASP.Net ページ:

レンダリングされた HTML:

コントロールを独自のパネルで囲む

ASP.Net ページ:

レンダリングされた HTML:

どんな助けでも大歓迎です!!

セクション 508 の要件の 1 つは、ページがスタイルシートなしで読み取り可能であることです。

§ 1194.22 (d) 文書は、関連するスタイル シートを必要とせずに読みやすいように編成する必要があります。

現在、スタイルを有効にしないと Google マップが機能しないという問題に直面しています (図を参照)。マップのすべての異なる部分が順番に印刷されるだけで、意味はありません。以下にサンプル画像を添付しました。

これに対処する簡単な方法はありますか？私が考えることができる唯一のことは、CSS が無効になっているかどうかを確認するために JavaScript を使用してテストすることです (ひどいことです、私は知っています) 。 . (JavaScript も無効になっていると、マップが読み込まれなくなるので問題です。) 明らかに、静的マップには同じ機能 (ズーム、パンなど) がすべて組み込まれているわけではありませんが、読みやすいページが提供されます。そう：

• スタイルの無効化に関して Google マップ 508 準拠にする別の方法はありますか?
• そうでない場合、上記の修正を行うために CSS が無効になっていることをテストするにはどうすればよいでしょうか?

スタイルのない地図の例: