こんにちは、
私は RAMP COVID-19 イニシアチブに取り組んでいます。当プロジェクトではフォーラムに Discourse を採用しており、非常に満足しています。
同僚と accessibility（アクセシビリティ）について検討しています。低コントラストの問題については、管理用 CSS 機能で対応できていると考えていますが、WAVE が指摘している以下の問題については、自力で解決できるか確信が持てていません。
-
リンク付き画像に代替テキストが不足しています：これはアバター画像に関するものです。説明的なタイトルはありますが、alt 属性が空です。
-
各ページにラベルが不足しています：
<div><input type="text"></div>
-
各ページに空の見出しが存在します：
<div class="title"><h3></h3><!-- --></div>
-
SVG に関連して、多数の空のボタンが報告されています。
-
空のリンクが存在します。例：
<a href="" aria-hidden="true" tabindex="-1" class="tabLoc"></a>
および
<a href="" class="edit-topic" title="edit the title and category of this topic" data-ember-action="" data-ember-action-27="27"><svg class="fa d-icon d-icon-pencil-alt svg-icon svg-string" xmlns="http://www.w3.org/2000/svg"><use xlink:href="#pencil-alt"></svg></a>。
-
空のテーブルヘッダーが存在します：<th data-sort-order="posters" class="posters"></th>
これらの問題が当社だけで起きているとは思えません。WAVE が過剰に反応しているのか、あるいは私たちが何か見落としているのか、ご教示いただけますでしょうか。ご支援を心よりお待ちしております。
あらかじめ感謝申し上げます。
コスタス
「いいね！」 8
これらはすべて、ブラウザの F12 インスペクターを介して、レンダリングされたページの HTML で確認できますか？
「いいね！」 1
ご関心をお寄せいただきありがとうございます。一つ（空の見出し）は見つけられないかもしれませんが、残りは WAVE の「コード」機能から取得でき、F12 インスペクターを使えば（多少の努力は必要ですが）見つけることができます。
タイムゾーンが私たちに有利に働くかどうかわかりません（私は英国にいて、UTC+01:00 です）が、必要であれば Teams や同様の通話で実演することも喜んで行います。
「いいね！」 1
riking
(Kane York)
4
aria-hidden 属性は、このリンクをアクセシビリティツールから適切に非表示にするはずです。
「いいね！」 4
もしこれらの中で比較的簡単に解決できるものがあれば、@awesomerobot さん、対応していただけませんか？
「いいね！」 3
はい、少なくともいくつかは簡単な修正だと思います。詳しく確認します。
「いいね！」 3
空の alt 属性自体は問題ありません…それはスクリーンリーダーに対して画像が装飾のみであり無視してもよいことを示すためのものです…しかし、title 属性も含まれているため、`img` with null `alt `and non-null `title` attributes - Screen reader compatibility によると、これが時に問題を引き起こす可能性があります。
一部のスクリーンリーダーはアバターを正しく無視していますが、他のスクリーンリーダーはこれにより名前/ユーザー名を二度読み上げてしまいます。
投稿のアバターから title 属性を削除する PR を作成しました：
これはコピーして共有する URL を表示する入力欄です。ここに aria ラベルを追加する PR は以下の通りです：
これについては見つけられませんでした…サイト設定に基づいている可能性があります。もう少し調べる必要があります。
視覚に問題のないユーザー向けにはラベルを付けていません。列を見てその内容について推測できるからです…しかし、視覚がない場合はそれがはるかに困難になります。スクリーンリーダー用のラベルを追加するのは理にかなっています：
残りの未対応の課題はボタンに関連するもので、それらについても引き続き調査が必要です…
「いいね！」 8
こんにちは、
迅速なご対応とご行動、心より感謝申し上げます。マージされたリクエストが、あるバージョンのコードに反映されていることを確認してもよろしいでしょうか。
また、WAVE アクセシビリティテストをパスできるよう、私が修正したテーマを整理して共有することは、お役に立ちますでしょうか。
よろしくお願いいたします、
コスタス
「いいね！」 1
sam
(Sam Saffron)
10
はい、最新の Discourse には修正が含まれています。
テーマの共有も歓迎します。
「いいね！」 2
後で（できれば）勇気を出してすべての更新を行い、改めて報告します。
テーマについては、少しごちゃごちゃになってしまいました。Light テーマを使用し、一部を修正しています。色については、以下のような高レベルの変更を行いました：
Tertiary: #0088cc → #006498
Quaternary: #e45735 → #C93C1B
Danger: #e45735 → #C93C1B
Success: #009900 → #007A00
後から思いついた賢い手は、アクセシビリティの観点からカラーページをテストすることです。 
その後、CSS エディタ（admin/customize/themes/3/common/scss/edit）を使って多数の変更を加えました。これをどのように共有すべきか確信が持てません（コピー＆ペーストは可能ですが、それが望ましい方法かどうか、またこのスレッドで共有すべきかどうかはわかりません）。もし var(–primary-medium) のような他の色を高レベルのインターフェースで確認できれば、作業が楽になるかもしれません。例えば、#919191 → #595959 のような変更はよくあるケースですが、私の方法はページを巡回する際に目にする症状に対処するに過ぎず、「サイト」の動的な性質上、今日通っても明日は通らない可能性があります。
別の方法で試すことも喜んで行いますので、お知らせください。ただし、デモサービスの実行やコードの確認などは、いかなる場合も行うことはできません。
また、admin/upgrade については全く修正できませんでした（ここには多くのコントラストの問題があります）。CSS に従っていないのか、それとも他の理由があるのか、確信が持てません。
「いいね！」 3
riking
(Kane York)
12
elijah
(Eli the Bearded)
13
私の記憶では、Discourse の管理画面は、CSS の変更によって誤って管理インターフェースのアクセス不能に陥るのを防ぐため、別々の（編集が難しい）スタイルシートを使用しています。
少し遅れてしまいましたが、フォーラムのアップグレードは行いました。それでも、このスレッドを調べてくださった方々（多くの皆様、ありがとうございました！）にはお返事したいと思いました。
ありがとうございます。リンクをクリックすると、Wave が 13 件のアクセシビリティ（コントラストが低い）の問題を検出しますが、色そのものに関するものではありません。それは、色のページとは異なり、色がどのように使用されているか（背景色か、文字の前景色か）が表示されないためです。
お手伝いできることがあればお知らせください。実際、コントラストに関するエラーが多数あります。
こんにちは。
再度確認したところ、エラーの数が大幅に減少しました。@awesomerobot さんやお手伝いいただいた皆様、本当にありがとうございます！
しかし、まだ以下のエラーが発生しています：
- カテゴリの閲覧時：以下のコードでボタンが空です。
<button name="Filter by: [missing %{name} value]" role="combobox" data-name="regular" data-value="1" aria-expanded="false" aria-haspopup="menu" aria-owns="ember41-body" tabindex="0" id="ember41-header" class="select-kit-header single-select-header btn-default dropdown-select-box-header btn no-text btn-icon ember-view" type="button">- また、
ember の後の数字が異なる他のページでも同様の現象が発生しています。
- カテゴリの閲覧時：表のヘッダーが空です。
<th data-sort-order="posters" class="posters" aria-label="Posters"></th>
- ユーザー「system」による投稿：リンクされた画像に代替テキストが欠落しています。
<img alt="" src="/user_avatar/ramp-forums.epcc.ed.ac.uk/system/90/1_2.png" class="avatar" width="45" height="45">
- 任意の投稿：空のリンク
<a href="" aria-hidden="true" tabindex="-1" class="tabLoc"></a>- また、上記の要素の組み合わせでも同様の問題が発生します。
- 有効な結果を含む検索：空の見出し
<h3 class="search-footer"><!--></h3>（ここでフォーマットを編集し、空白と改行を削除しました）
- 有効な結果を含む検索：高度な検索で 5 つのフォームラベルが欠落しています（必要であればさらに詳細を提供できます）
ご協力をいただければ幸いです。
angus
(Angus McLeod)
17
@KKavoussanakis さん、こんにちは！
@fzngagan ができるだけ早くそれを確認します。
「いいね！」 1
@fzngagan さんへの言及も忘れていました。申し訳ありません。ご関心をお寄せいただき、またお話しできて光栄です。
「いいね！」 2