アクセシビリティ:アンカーリンクにラベルが必要です

ベータ版7でようやく表示されるようになったため、長い投稿内の各見出しへのリンクにaria-labelを付与するよう提案いたします。現状の実装では、名前付きのaタグのみで、CSSクラス.anchorを介して背景画像が追加されているため、スクリーンリーダーが何らかの番号(おそらく投稿ID)や見出しの一部を読み上げてしまいます。明示的に「パーマリンク」や「見出しテキストへのパーマリンク」のように記述する方が望ましいです。そうすれば、ページ内のリンク一覧を開いたスクリーンリーダーユーザーが、適切に名前付けられたリンクを取得できるようになります。

また、アンカーをh要素内の見出しテキストのではなくに配置することは可能でしょうか?現在、スクリーンリーダーは見出しから見出しへ移動する際、常にリンクを先に読み上げてしまいます。特に上記のように見出しテキストがラベルに繰り返される場合、読み上げが非常に煩雑になってしまいます。スクリーンリーダーユーザーはしばしば見出し構造を通じてページの概要を把握するため(各種WebAIMのスクリーンリーダーユーザー調査を参照)、リンクを見出しテキストの後に配置する方が望ましいでしょう。

Discourseのアクセシビリティ向上への継続的な取り組みに感謝いたします。

「いいね!」 4

ええと、どこかから数字が拾われてくるというのは少し奇妙ですね…

それはさておき、これらの提案はすべて理にかなっており、実装に問題はないはずです。アドバイスありがとうございます!

「いいね!」 1

リンクに他のラベルが存在しない場合、スクリーンリーダーは href 属性の内容を読み上げます。これにより、少なくともユーザーはリンクの宛先や URL を知ることができます。

このトピックに関する素晴らしい技術的な詳細解説はこちらにあります: Are your Anchor Links Accessible? | Amber Wilson

「いいね!」 2