nolan
2021 年 2 月 2 日午後 1:17
1
みなさん、こんにちは。
これが既知の問題か、どこかで追跡されているかどうかはわかりません。もしそうであれば、リンクを教えていただけると幸いです。改善されつつはあるものの、スクリーンリーダーを使って Discourse を利用する経験には、いくつかの課題があり、それらを記録しておきたくて投稿しました。
私はスクリーンリーダーユーザーで、主に視覚障害のあるユーザーを対象としたセルフホスト型のインスタンスを立ち上げたいと考えています。通常、アクセシビリティの問題から Discourse を推奨することはあまりありませんが、私が求める機能を使ってセルフホスト化を非常に簡単にしてくれているため、アクセシビリティがまだ完全ではないことに悲しくなります。以下に私が直面している課題をいくつか挙げます。
スクリーンリーダーに HTML の <select/> として報告されるドロップダウンメニューは、ほぼ完全に機能していません。通常のキーボード操作で展開はできますが、アクセシビリティはそこで終わってしまいます。課題は、セットアップ中に言語を選択しなければならないところから始まりました。英語（米国）がデフォルトに設定されていたのかどうかはすぐにわかりませんでしたが、確認しようとしたところ、誤ってスペイン語に設定してしまい、元に戻すのに苦労しました。最終的にスクリーンリーダーでリストを見つけ、修正することができました。しかし、ほぼすべてのドロップダウンが壊れています。「すべて」とは言いたくありません。インターフェースの遠く離れた隅に動作するものが一つあるかもしれないからです。しかし、私が試した限りでは、一つとして動作するものがありませんでした。
直接移動しない限り、管理インターフェースにたどり着く方法が見つかりません。セットアップ画面ではギアアイコンの下にあると教えていましたが、ギアアイコンが何を表しているのかを示すテキスト表現が見つかりません。また、キーボードでアクセス可能なコントロールを見つけても、最終的に管理インターフェースにリンクしているようには思えません。現時点では /admin に直接アクセスしていますが、このギアが見つからないため、見逃しているツールがあるのではないかと心配になります。
設定ドロップダウンに関連して、カテゴリリストの上部にあるドロップダウン/セレクトを使用してカテゴリリストに移動することができません。カテゴリリンクについては知っていますが、普段はそれを使っています。しかし、もしあのセレクターが動作すればいいのにと思います。
Discourse にサインアップしない場合、読み終わった場所をフォーラムが記憶してくれるからサインアップすべきだと伝えられますが、スクリーンリーダーではこれが一度も機能したことがありません。これはどのように機能するのでしょうか？リンクをクリックすると、最後に読んだ投稿にフォーカスが移動するのでしょうか？
私のサイトとは直接関係ありませんが、ここでのモーダル型のサインアップ体験にもいくつかの課題がありました。メールでサインアップしようとしましたが、あなたのインスタンスが私が約17年間使用しており、自分のサイトでは問題なく機能していた .info のメールアドレスを拒否しました。その後、Google 経由でサインアップしましたが、戻ってきたときに提示されたモーダルにいくつかの課題がありました。
キーボードフォーカスを取得しなかったので、自分で見つけて対話する必要がありました。
そうしている間、無限にスクロールするトピックリストに新しいトピックが追加され続け、フォーカスが実際にダイアログに到達するのがより困難になりました。トピックが表示される速度よりどのようにして速く移動できたのかは覚えていません（まだコーヒーを飲んでいないので）が、ここに来ました。
さて、いくつか質問があります。
もし可能なら、Discourse に固執したいと考えています。これらはいくつくらいなら自分のサイトで変更できるでしょうか？特に：
カテゴリリストのセレクターを削除して、ユーザーが一時的にカテゴリリストリンクと対話するようにすることはできますか？
新しいトピック作成ページのカテゴリセレクターを削除して、ユーザーがまず投稿したいカテゴリを入力し、誤って未分類の投稿をしたり、混乱したりしないようにすることはできますか？
これら両方を、アップグレードが容易な方法で行うことはできますか？できれば、標準テンプレートを編集したり、プロジェクトをフォークしたりしたくありませんし、完全に新しいテーマも必ずしも必要ではありません。
この作業はどこかで追跡されていますか？また、これに取り組む担当者はいますか？Discourse フォーラムはインターネットを食い尽くしています。どこを見回しても、私が時間を費やしているプロジェクトやコミュニティが Discourse を採用しています。地獄のように、視覚障害のある私でさえ、Discourse を運営したいと考えています。なぜなら、またもや、あなたがこれを非常に簡単にするからです。ただ、それほど重要なツールのアクセシビリティが後付けになったり、新しい開発に追いつくために永遠に追いかける状態になったりしてほしくないのです。
お読みいただき、ありがとうございます。
「いいね！」 29
pmusaraj
2021 年 2 月 2 日午後 3:52
2
素晴らしい投稿ですね、@nolan 。他のチームメンバーもあなたの質問に回答すると思いますが、開発者があなたが直面している問題を再現できるように、あなたの環境設定について共有していただけますか？具体的には、使用しているOS、スクリーンリーダーなどです。
「いいね！」 11
nolan
2021 年 2 月 2 日午後 4:22
3
Windows 10、NVDA スクリーンリーダーを使用しています。ただし、穏やかに表現すれば、この問題は十分に深刻なため、おそらくどの環境でも正常に動作しないでしょう。つまり、ほぼどのような OS とスクリーンリーダーの組み合わせでも、同様の問題に直面する可能性が高いです。
「いいね！」 11
フィードバックをありがとうございます！アクセシビリティの面でまだ完全ではないことは認識しており、最近その改善に力を入れています。2020 年末には、Discourse の最も重要な管理画面以外のページを対象に第三者によるアクセシビリティ監査を実施し、ここ数週間は優先度の高い課題の解決に取り組んでいます。
おっしゃる通り、管理メニューを見つけるのが難しい理由が理解できます。そのメニューへのリンクは、主要なヘッダーメニューのいずれかに配置されており、aria-label は「別のトピックリストまたはカテゴリへ移動」となっています。これでは、そこにいくつかの管理リンクが含まれていることが明確ではありません。
「Discourse は読み進めた場所を記憶する」というメッセージについてですが、期待される動作は、トピックを開いた際に読み進めていた場所へ自動的にジャンプすることです。キーボードでの操作を試しましたが、フォーカスが正しい場所に移動しないことが確認できました。
当社の多くのドロップダウンメニューは独自の実装であり、それがアクセシビリティ改善の観点から指摘されている分野の一つです。また、モーダルウィンドウがフォーカスをトラップしないため、特に無限スクロールのあるページではアクセスが困難なコンテンツが生じていることも認識しています。
Discourse を使い続けることに関するご質問については、挙げられたすべての要件は可能です。それらの要素を非表示にするには、数行の CSS で対応できます。この CSS はテーマ内に記述する必要がありますが、既存のテーマに追加できる「テーマコンポーネント」内に配置することも可能です（そのため、メインのテーマを変更する必要はありません）。テーマは Discourse の上に構築されるため、アップグレードプロセスがはるかに容易です。ご指摘のようにテンプレートを編集したりフォークしたりすると、更新が非常に困難になります。
アクセシビリティに関する報告は、Meta 上で accessibility
特に追加の労力を要して投稿してくださったフィードバックに心から感謝します。今後数ヶ月のうちに、Discourse がより使いやすいものになることを願っています。
「いいね！」 17
aschrijver
2021 年 2 月 5 日午後 6:36
9
視覚障害を持つ Robert Kingett 氏（プロフィールには「アクセシビリティ加速主義者」と記載）から、Fediverse のディスカッション で質問をいただきました。
ソーシャルハブは、スクリーンリーダーやその他の障害を持つ方々に対して、どのようにアクセシビリティを確保していますか？発作への配慮などを含めて。
SocialHub は Discourse で動作しており、この質問が当サイトのアクセシビリティに関するものであるため、このスレッドを Markdown ドキュメントとして Github Gist にコピーして共有することを提案しました。以下がその内容です。視覚障害のある方々をはじめ、他の皆様にもご活用いただけます：Accessibility: Discourse with a screen reader · GitHub
「いいね！」 4
nolan
2021 年 2 月 5 日午後 6:40
10
また、もしまだ提起されていないようであれば、これはすぐにアクセシビリティを改善できる方法として指摘させてください。
スクリーンリーダーは、HTML5 のセマンティックタグを効果的に活用しています。それら間を効率的に移動できるだけでなく、現在表示されているコンテンツの種類も読み上げてくれます。
できれば、投稿を <article> 要素で囲み、その見出しとフッターをそれぞれ <header> と <footer> 要素で構成してほしいです。要素の入れ替えが難しい場合は、適切な role 属性を使用することで同じ意味を伝えることができます。
現状では、長いスレッドを読むのが困難です。最初の投稿の後、おすすめトピックなどのセクションをスクロールして通過する必要があります。その後、同じ見出し（日付以外は全く同じで何千回も聞いた内容）や、同じメッセージ操作を含むフッターを何度も読み飛ばす手段がなく、投稿を逐次的に読むことになります。より高度な ARIA の調整でさらに改善できることは確かですが、タグの入れ替えや role の使用は、手間をかけずに大きな効果が得られる解決策だと考えます。
ありがとうございます！
「いいね！」 8
レビューキューに、トピックページにいくつかのARIAマークアップを追加する更新が含まれています。仕様によると、投稿下のコントロールやページ下部のツールバーを、toolbarロールでマークアップするのが適切のようです。
また、スクロールバーとして機能するトピックのタイムラインツールバー領域もあります（これには現在、scrollbarロールを付与しました）。さらに、「最初の投稿へ移動」および「最後の投稿へ移動」ボタンも含まれており、これらには説明を追加しました。
これらの変更は、来週のDiscourseの更新で利用可能になる予定です。
「いいね！」 7
nolan
2021 年 2 月 13 日午後 12:06
12
すばらしいですね、楽しみにしています！
言うまでもないことかもしれませんが、あえて言っておきます。これらのコントロールに単に ARIA を貼り付けて終わりでは不十分です。つまり、ツールバーのパターン に従わずに、単にそれらの領域をツールバーとしてマークアップするのは、役割（role）を付与しないよりもむしろ悪影響を及ぼす可能性があります。ツールバーに移動した場合、役割を付与しただけでは自動的に実現されない動作を期待するはずです。アクセシビリティを追加する際に頻繁に見られる誤りは、これらの役割を追加するものの、関連するキーボード操作の動作を追加しないことです。すると、期待通りに動作しないコントロールの山に直面し、その期待との格闘が、最初から期待を持たない場合よりもはるかに苦痛になります。
この説明がわかりやすいことを願っています。追加のご質問があれば、喜んでお答えいたします。
「いいね！」 9
MarcoZehe
2021 年 2 月 13 日午後 5:01
13
こんにちは、クリスさん。scrollbar ロール は、ここで求めているものと完全に一致しない可能性があります。実際に動作を確認する必要がありますが、現時点ではこのように使われているのを見たことがありません。これは、コンテナの相対的なスクロール位置を表す HTML5 の range 要素に似たものです。「最初の投稿へ移動」や「最後の投稿へ移動」の項目は、ビューをスクロールさせる可能性のある単なるボタンですが、これらを scroll bar コンテナの内容として適切に扱うことはできないと思います。scroll bar コンテナには aria-value* 属性の取得が必須だからです。
追伸：VS Code コミュニティでは、私は ARIA ロールの専門家として知られています。なぜその評判を得たのかは定かではありませんが、ロールに対して非常に神経質であることで知られています。ロールは害を及ぼすことの方が多いので、この変更は取り消さざるを得ないかもしれません。ほぼ間違いなく取り消されるでしょう。
「いいね！」 7
nolan
2021 年 2 月 13 日午後 5:41
14
気になっただけの質問ですが、チームにアクセシビリティに特化したメンバーはいますか？最近のアクセシビリティ監査と今後の予定されている変更にはワクワクしていますが、Discourse はインターネットの多くの部分を動かしているため、これらの変更を一緒に進め、助言できる、現場の経験を持つ人がいるべきではないでしょうか。誤って問題を悪化させてしまうことは非常に簡単です。
例えば、Slack はアクセシビリティに重点を置いていると主張し、ARIA の使用も試みていますが、私のスクリーンリーダーではチャットエリアが完全に使えなくなっているように見えます。あるいはアクセス可能だとしても、数十年の経験を持つ私でもそれがどうなっているのか分かりません
ともあれ、私はこの分野や類似の仕事を生業としており、お手伝い可能です。また、Discourse のフォーラムをいくつか利用しているため、アクセシビリティが確保されることは私にとって具体的な生活の質の向上になります
「いいね！」 8
@MarcoZehe 当社のタイムライン制御については、スクロールバーロールとスライダーロールのどちらを採用するか、少し迷っていました。最終的にスクロールバーロールを選択したのは、このコントロールが実際にページをスクロールさせるものであり、W3C が示す説明にも合致していると考えたからです。
表示領域内でコンテンツのスクロールを制御するグラフィカルなオブジェクト。コンテンツが完全に表示領域内に表示されているかどうかは問いません。
とはいえ、これは私たちが独自に構築したやや特殊なコントロールです。ページをスクロールさせるだけでなく、現在の投稿範囲内での位置も表示します（例えば、「現在 12 件中 6 番目の投稿にいます」といった具合です）。スクリーンリーダーに対して適切なマークアップがそもそも存在しない可能性もあり、その場合は隠したほうが良いかもしれません。通常のページスクロールは、このコントロールなしでも期待通りに動作します。まずは試してみて、実際の動作をあなたにご確認いただき、問題があれば元に戻すことも検討したいと考えています。
@nolan のご質問にお答えします。アクセシビリティに関する推奨事項の整理と監査の実施を担当していますが、私が以前に携わったアクセシビリティの経験の多くは、他者が定義した仕様の実装に限定されていました。Slack に比べればまだ規模が何桁も小さいため、アクセシビリティに専任で取り組む専門家はいません。しかし、現状では外部の専門家を契約して対応し、適切に対処し、状況を悪化させないよう努める必要があるかもしれません。
お二人のご返信、本当にありがとうございます。感謝しております！
「いいね！」 6
ツールバーの役割について補足させていただきます。W3C で説明されているこのパターンに従わない限り、その役割には価値がない、とおっしゃっているのでしょうか？
ツールバーのキーボードタブ移動に 1 つの停止点を含めるようにフォーカス管理を実装し、矢印キーでツールバー内のコントロール間をフォーカスを移動できるようにします。
もしそうであれば、フォーカスと矢印キーによる操作が正しく機能するまで、その役割を実装しません。
「いいね！」 5
MarcoZehe
2021 年 2 月 13 日午後 7:18
17
その通りです。ロールを使用する場合は、デザインパターンを実装することも約束することになります。デザインパターンの提供がまだ準備できていない場合は、ロールもまだ使用しないでください。
「いいね！」 5
ホストされたDiscourseインスタンスに関する独自のアクセシビリティ監査の結果を報告する適切な場所でしょうか、それとも新しいスレッドを開始すべきでしょうか？
また：
以前お話ししたサードパーティによるアクセシビリティレポートとそれ以降の作業は、公開で追跡されていません。
この決定を見直す可能性はありますか？クライアントと共有できるような、この件に関する透明性があれば助かります。
「いいね！」 4
jomaxro
2021 年 2 月 19 日午後 4:40
19
こんにちは、Aaronさん。
見落としを防ぐため、ご自身の監査で発見された項目ごとに、新しい ux accessibility
「いいね！」 6
了解、やりますね。WAVE issues from homepage
「いいね！」 9
nolan
2021 年 5 月 21 日午後 5:18
22
少し補足しますと：
パターンを実装せずにロールだけを使用するのは、ボタンに見えるようにスタイルを設定しておきながら、マウスをホバーしてスクロールホイールを回さないと反応しないようなものと同じです。ツールバーにタブ移動するか、他の方法でフォーカスを当てた際、すべてのボタンが個別に露出している場合や矢印キーに反応しない場合、それは前述の奇妙なホイールボタンと同じように感じられます。すべての操作のたびに考えなければならず、実際にはそうではないのに、あたかもそうであるかのように振る舞っていると主張することになります。
これで少しは明確になったでしょうか。ツールバーであることが価値を持つのは、それが実際にツールバーとして振る舞う場合に限られます。そうでなければ、むしろ気を散らすだけです。
「いいね！」 5
nolan
2021 年 5 月 21 日午後 5:24
23
ああ、がっかりですね。私がこの投稿をした時点で進行中だったように思えたこれらのアップデートの状況について尋ねに来たのですが。まだコミュニティを立ち上げていませんが、既存の古い PHP フォーラムがまもなく終了してしまうため、今が最後のチャンスです。これまでに素晴らしい変更がいくつかあるだろうと考えていました。
しかし、サイトの管理エリアにアクセスする方法がわかりませんでした。確かに /admin にアクセスはできますが、サイトへのリンクは、私が確認した限り、キーボードからはアクセスできない状態のままです。そのため、スクリーンリーダー利用者の方にモデレーションのお手伝いを頼む際に少し困難をきたしています。
その後、5 分前にこの返信を入力しようとしたところ、何らかの理由で「編集」または「引用」ボタンをクリックしてしまいました。すると、以前送信したメッセージの編集可能なバージョンが表示されました。「キャンセル」というリンクのラベル付きのリンクで Enter キーを押してみましたが、機能しませんでした。ページを再読み込みしても同じでした。最終的には返信を送信した後、最初にここで報告したようなアクセスできないモーダルを見つけ、それと対話してメッセージを破棄しました。
この点について何か変更はありましたか、あるいは公開されたロードマップはありますか？私自身はスクリーンリーダー利用者として、Discourse コミュニティと関わり合いになることを避けられない状況ですが、自分自身では何とか対応できています。しかし、盲目の方々のコミュニティに、このプラットフォームを使ってもらうよう頼んだり、少なくとも彼らが楽しめるコミュニティを Discourse 上で構築してもらうよう頼んだりするのは、あまり気が進みません。
ありがとうございます。
「いいね！」 5
riking
2021 年 5 月 21 日午後 5:55
24
残念ながら、それによりドラフトの扱い（破棄/保存/キャンセル）を尋ねるモーダルが表示されましたが、モーダルのフォーカス捕捉が機能していないようです。
「いいね！」 5
ethindp
2021 年 5 月 22 日午後 4:54
25
Discourse は私にとって問題ありませんが、アクセシビリティの改善をぜひ実現していただきたいです。管理画面や Discourse フォーラムの管理を最後に使って以来、すでにかなりの時間が経過していますので、3 ヶ月で多くの進展があることを期待しています。@nolan さん、私も以前同じ問題に直面しました。「キャンセル」をクリックしても編集ボックスが消えない理由を理解するのに時間がかかりました。将来的に自分のコミュニティのフォーラムとして Discourse を使いたいと強く思っていますが、アクセシビリティの改善が進まなければ、その考えを見直さざるを得ないかもしれません。そして、PHP に戻りたくないというのが本音です。@nolan さんも私も喜んでお手伝いする用意があります。Discourse のテストインスタンスを立ち上げることも喜んで行います。
「いいね！」 7
