アクセシビリティ:新しいトピック/返信フォームがスクリーンリーダーで利用できません

A screen reader user on iOS reported that several buttons on the New Topic/Reply form are not correctly labelled.

Image%20from%20iOS(3)

  • The reply button in the bottom-left is being read as “Or press Ctrl+Enter”, not “Reply” as expected
  • The hamburger button in the top-right is not labelled
  • The upload image button in the bottom-right is read as “link”
「いいね!」 9

Is this specific to mobile?

「いいね!」 1

Of the buttons listed, I think only the Reply button appears on the desktop version but it’s still labelled “Or press Ctrl+Enter”

「いいね!」 2

@owlish I would love to get this sorted, can you provide us with a quick start of how to test this? What software do we install locally?

「いいね!」 5

The Chrome Vox screenreader was recommended for accessibility testing.

NVDA is another free option for Windows.

「いいね!」 3

Just wanted to check in to see if there’s been any movement on this or if you need any more information

「いいね!」 1

Hi @sam, is there any other information you need for this?

「いいね!」 1

I think we have what we need, its just a question of resources at the moment.

I am adding a pr-welcome on this in case someone from the community wants to help out.

「いいね!」 5

The issue with the reply button was fixed by commit 31ffcf989ce63e. I just tested this on iOS with VoiceOver.

Now I’ll investigate the other two issues.

「いいね!」 7

I verified that the hamburger button in the composer isn’t labeled. Specifically, this is the toggle-toolbar button in the composer-toggles component. This button is only rendered in the mobile view.

What would be a reasonable label for this button? Maybe “Formatting”, since many of the toolbar options are formatting related? Not all of them are, though. Maybe the more generic “Tools” would be better.

「いいね!」 5

It occurred to me that, to enable accessibility fixes to reach Discourse’s worldwide user base without imposing too much on translators, we should use existing strings for unlabeled controls when it makes sense. So, for the hamburger button, would it make sense to use “show more” as the title? We could use “options”, and I think that would be a better fit, except that there’s already an “options” button in the toolbar itself. I think that would be confusing.

「いいね!」 6

アップロードボタン、プレビューボタン、およびツールバーの切り替えにラベルを追加しました。

@Matt_Campbell 既存のテキストを可能な限り活用することの利点についてはご指摘の通りですが、ラベルを「[表示/非表示] コンポーザーツールバー」とするために、2 つの新しい文字列を追加しました。「オプション」という表現も検討しましたが、特にこのボタンが切り替え機能であることを考慮すると、十分説明的ではなかったためです。

「いいね!」 6

@owlish @Matt_Campbell @awesomerobot 、最近の状況はどうですか?
元のリクエストは、返信ボタンの「Ctrl+Enterキーを押す」というタイトルの修正に関するものでした。このボタンにaria-label="返信"を追加するだけでよいのでしょうか?

「いいね!」 2

iOSのVoiceOverはボタンのラベル「返信」を読み上げてからタイトルを読み上げます。デスクトップのNVDAでも同様です。そのため、ここではすべて対応できていると思いますが、もし何か不足している点があれば、さらに詳しく確認します。

モバイルでは、キーボードショートカットは一般的に関連性がないため、タイトルを削除するという軽微な改善が考えられます。

「いいね!」 3

承知しました。これを閉じるために2週間のタイマーを設定します。

何か見つかった場合は、フォローアップを開いてください @owlish

このトピックは9日後に自動的に閉じられました。返信はもうできません。