コミュニティのハイライト: Melanie Sumner 氏

Melanie Sumner は、デジタル アクセシビリティを専門とするソフトウェア エンジニアです。エンジニアリングへの道、アクセシブルなデザイン、Ember.js、こうした取り組みへの資金提供の重要性について話しました。

Alexandra Klepper
Alexandra Klepper

この投稿は、アクセシビリティを学ぼうの一環として、コミュニティ エキスパートを紹介するものです。

Alexandra Klepper: ご参加いただきありがとうございます。自己紹介と仕事内容を教えてください。

メラニー サムナーの顔写真。

Melanie Sumner: Melanie Sumner と申します。デジタル アクセシビリティを専門とするソフトウェア エンジニアです。私は 25 年間ウェブのコードを書いてきました。私の最初のキャリアは… スパイのようなものでした。私は米海軍の情報分析官で、コーディングは趣味でした。

スパイはあまり好きではありませんでした。死は好きではなかった。ほとんどの人はそうではないため、近づく必要がある場合は、次に何をしたいかを決める必要があり、趣味を仕事にする時が来ました。この 10 年間は、特にアクセシビリティ分野のソフトウェア エンジニアリングに注力してきました。

Alexandra: 「私はもともとスパイだった」という話はあまり聞かないですよね。お任せください。アクセシビリティの仕事に携わるようになったきっかけは何ですか?

メラニー: 当時、私はノースカロライナ大学チャペルヒル校の開発部門で働いていました。ウェブ開発のような開発ではなく、資金調達のような開発を意味します。

直属の上司は視覚障がいがあり、すべてを 400% に拡大しないと見えませんでした。彼は素晴らしいソフトウェア エンジニアでした。今までで最高のマネージャーだったと思います。でも、彼はいつも私の作品を拡大して見ていたので、私の作品を壊していました。レスポンシブに構築することを考えていなかったら、壊れていただろう。

私のマネージャーの上司は青色盲でした。UNC ブルーがどんな色かご存知かどうかはわかりませんが、明るい空色です。白い背景での使用を好んでいました。

Alexandra: (笑)ああ、だめだ。

Melanie: 彼のボスは、私の仕事がまったく見えないといつも文句を言っていました。サイトの補色とカラーパターンを開発する必要がありました。そこから、色覚異常(またはその他の視覚障がい)のある人がウェブをどのように利用しているかについて、色のコントラストについて考えるようになりました。

UNC は州立大学であるため、WCAG のアクセシビリティ レベル AA に準拠する米国の連邦要件があります。教育機関であるため、レベル AAA を目指しました。

州と連邦政府の要件について詳しく学び、W3C のアクセシビリティ仕様を読み始めたとき、「すべてが理にかなっている」と思いました。私が確認した限りでは、ウェブのほとんどが準拠していませんでした。もちろん、ウェブ アクセシビリティはウェブが存在する限り取り組むべき課題です。JavaScript エンジニアは、デジタル アクセシビリティの理解が遅い傾向があります。

私はアクセシビリティをウェブの最後のフロンティアと呼んでいます。アクセシビリティの自動化に取り組んでいる優秀な人々はたくさんいます。パフォーマンスやセキュリティなどの他の難しい問題に取り組んだのと同じ方法で、ソリューションに取り組む必要があります。

Alexandra: 海軍や UNC で、複雑な長いドキュメントをたくさん読んだことがあるでしょう。仕様の理解に苦労しましたか?

Melanie: 5 回ほど読み返してようやく理解できました。以前にも他の仕様書を読んだことはあります。私はいつも、理解できなくても気にしないでくださいと言っています。なぜなら、私も仕様を 5 回読まなければならなかったからです。冗談じゃない。

仕様言語に慣れるには時間がかかります。正しく解釈しないと、間違ったことをしてしまう可能性があります。また、仕様の言語の多くはブラウザ デベロッパーを対象としていることを理解することも重要です。「authors should」という文言を探してください。これはウェブ デベロッパーへの言及です。

Alexandra: 仕様の解読方法をより多くのデベロッパーが知っていれば、ウェブ上の多くのことが改善される可能性があります。

Melanie: そのような解釈を自動で行ってくれるサイトには、多くのメリットがあります。a11y-automation.dev を作成しました。このサイトは、私の子供のような、サイド プロジェクトのようなものです。ユーザー補助の違反をすべて項目化し、問題の WCAG 成功基準にリンクするようにしています。エラーを防ぐ自動化がある場合は、その解決策を提案します。

違反の可能性のあるリストを把握することも重要ですが、それよりも重要なのは、違反を修正する方法を学ぶことです。自動修正が存在しない場合は、リンターやテンプレートの作成を思いつくかもしれませんし、何らかのテストの作成を思いつくかもしれません。

オープンソースで作業するのが好きです。お互いにアイデアを出し合い、改善案を提案できるからです(改善案が採用されることもあれば、されないこともありますが、みんな最善を尽くしています)。お互いの成果を基盤として、ウェブにとって非常に優れた結果を生み出しています。

ユーザー補助機能の資金調達方法

Alexandra: pleasefunda11y.com にとても惹かれました。アクセシビリティの高いサイトを構築する方法を開発者に学んでもらうことは非常に重要ですが、経営陣の資金提供と承認がなければ、リソースが常に確保されるとは限りません。このサイトを構築することにしたのはなぜですか?

Melanie: アクセシビリティへの資金提供が不足していることに不満を感じていました。オープンソースの資金はすべて CSS に流れているようです。CSS は大好きです。CSS でできることはたくさんあります。

このサイトを構築したのは、Chrome のソフトウェア エンジニアリング マネージャーである Addy Osmani 氏から連絡があり、アクセシビリティの資金調達を求めていることを知ったが、具体的にどのような作業に資金を投入できるかについてアドバイスが欲しいと言われたからです。これは大きな問題です。オープンソースの資金提供者は、特定のプロジェクトに資金を提供したいと考えており、結果が定まっていない一般的なアイデアには資金を提供したくないと考えています。具体的な取り組み、必要なもの、サイトのアクセシビリティを高める方法について、時間をかけて書き留めました。

たとえ私がいなくても、企業がこうした取り組みを進めていけば、ウェブのアクセシビリティを大きく前進させることができます。他のウェブ関連の取り組みと比較すると、費用はごくわずかですが、人々の生活に大きな影響を与えるでしょう。

現在の考え方は、「障害のある人は何人いるのか?」というものです。「テクノロジーと人との関係とは何か?」

「色覚異常は障害ではないと思う」と言われたこともあります。色覚異常は障がいとは認識されないかもしれませんが、テクノロジーとの関係に影響します。

15 %

障がい者であると自己申告したユーザー。

ソース

253 m

視覚障がいのある方。

ソース

39

ウェブ アクセシビリティに関する法律がある国。

ソース

Learn Accessibility の最初のモジュールの統計情報について詳しくは、 デジタル アクセシビリティとは何か、なぜ重要なのかをご覧ください。

Alexandra: テクノロジーとの関係を理解することについて、詳しく教えてください。これはユーザー補助とどのように関係していますか?

メラニー: たとえば、神経多様性のある方は、非常にシンプルな言葉と明確な指示が必要になるかもしれません。フロー内の 3 つまたは 4 つの画面を移動し、一度にいくつかの選択肢を選んで最後まで進む方が、ユーザーにとって使いやすい場合があります。最新の技術アプリケーションに関する適切なガイダンスがない。

DevOps を行う企業全体があり、そうしたウェブサイトを使おうとすると、「なんてことだ」と思うでしょう。最近では、すべてのインターフェースにキッチンシンクを詰め込もうとしています。

Alexandra: 例を挙げていただけますか?

Melanie: たとえば、GitHub にはネストされたタブを含むプルダウンがあります。[ため息]。イライラしても、怒ることはできません。最新のウェブは、新しい需要に対応するために成長する必要があります。しかし、人々を置き去りにしない方法で構築する責任もあります。

それが私の原動力であり、情熱です。仕事で使うツールにアクセスできないために、仕事に就けない人が出てくるのは避けたい。

Alexandra: 100% です。また、外部ユーザー向けのアクセシビリティ対応プロダクトの構築はよく考えられていますが、従業員向けのアクセシビリティ対応プロダクトの構築は必ずしも考えられていません。

Melanie: この資金調達のアドバイスは、おそらくすべての人に役立つだろうと思いました。

エンジニアから「アクセシビリティに取り組みたいけど、会社が気にしない」という話をよく聞きます。きっと気にかけているはずです。ビジネス ロジックのギャップを埋めるだけで済みます。ビジネスにとって有益な結果を示す。もちろん、サイトはオープンソースです。投稿や編集は大歓迎です。

Alexandra: アクセシビリティは、プロセスの一番最後に残されることがよくあります。「後でアクセシブルにすればいい」というように。ただし、後で追加するよりも、プロジェクト全体でアクセシビリティのプラクティスを統合する方が、はるかに時間がかかります。

Melanie: 私はよく「1 回だけ構築する費用を払うか、2 回構築する費用を払うか」と言います。

Ember.js とコア ユーザー補助チーム

Alexandra: Ember.js フレームワークのコアチームにも参加されていると伺っています。どのように関わりましたか?

Melanie: JPMorgan Chase の企業投資銀行プラットフォームで働くために採用されました。Ember は、非常に安定した(退屈な)ベースが必要な場合に使用される強力な JavaScript フレームワークです。これにより、銀行の資金を失うようなコードの作成を回避できます。Ember には下位互換性の保証があります。メジャー バージョンに達した場合でも、毎回アップグレードできます。アプリが壊れないように、段階的に変更を加えています。

とにかく、Ember のカンファレンスに参加して、コミュニティのたくさんの人たちと出会いました。Ember の人々はとても親切でした。また、他の場所ではまだ見たことのない非常に強力な行動規範もあります。

軍隊を退役したとき、私はセキュリティの仕事に就きたいと思っていました。情報セキュリティのミートアップに参加しましたが、女性は私だけでした。年配の男性が私を見て、「この部屋でいいのかい、お嬢ちゃん?」と言いました。

Alexandra: [うめき声] 痛い。これはまったく驚くことではありません。私も同様の経験があります。

Melanie: 2011 年か 2012 年だったと思います。状況は大きく変化しました。その夜、そのミートアップを通して、私は自分の主張を証明しました。そのコメントで私を黙らせることはできませんでした。冗談を言ったり、メモをしっかり取ったり、会話に参加したりして、自分の存在をアピールしました。キャリアの多くは、男性の誤りを証明することに費やしてきたように感じます。

しかし、男性の誤りを証明するためだけに女性がソフトウェア エンジニアになることを望んでいるわけではありません。ソフトウェア エンジニアになって素晴らしいものを作りたいと思いました。なぜなら、それが楽しいからです。女性にもそのようなキャリア オプションがあるべきです。

Alexandra: そのとおりです。

メラニー: 銀行プラットフォームとして、米国の連邦要件に準拠する必要があるため、アクセシビリティについて知っていることを Ember コミュニティと共有しました。Yehuda Katz と Tom Dale は、「チームにギャップがある。JavaScript の専門家、パフォーマンスの専門家、驚くほど賢い人がたくさんいますが、アクセシビリティの知識を持つ人が必要です。」そして、コアチームへの参加を誘われました。

私は、Ember をデフォルトでアクセシブルにするための取り組みを進めています。つまり、ember new <my-app-name> と言ったときに、すぐに WCAG の達成基準を満たす必要があります。

Alexandra: GitHub で Ember のアクセシビリティ ツールの一覧を見ました。Ember コミュニティのメンバーは、そうしたツールへの貢献に意欲的だと感じていますか?

Melanie: それは、この仕事の非常にエキサイティングな部分です。LinkedIn に在籍していたときに、Ember のアクセシビリティ リンティング ルールを作成しました。その後、私は LinkedIn を離れて Hashicorp で働くようになりましたが、他の人たちはリンターが便利なので、今でもリンターに貢献しています。この仕事のゾクゾクするような、ワクワクするような部分です。

Google は、アクセシビリティは基本的人権であると考えています。それは議論の対象ではありません。

議論するのは、何を実装できるかということです。日時どのように作成しますか?これをどのように教え、下位互換性を確保すればよいでしょうか?デベロッパーが、構築や計画を必要とする大規模な追加機能なしで、ユーザー補助機能をサポートするにはどうすればよいでしょうか?

Alexandra: アクセシビリティは公民権です。鳥肌が立つわ!それは、誰もが真実として知っているべきことです。

Melanie: 「目が見えなかったらインターネットは使わない」など、無知なことを言われたことがあります。「ユーザーの 90% が問題なく利用できているのに、ユーザーの 5% のために障害について考える必要があるのはなぜですか?」そうした議論は、作業の妨げになることが多いため、行いません。

アクセシビリティの高いコードを書くと、W3C 仕様に準拠したサイトの構築を考えることになるため、パフォーマンスが向上します。div だけでなく、セマンティック HTML を使用し、見出しを使用します。<div> にクリック イベントを追加する代わりに <button> を選択すると、パフォーマンスが向上します。

1 つのことに集中する: ユーザー補助を自動化する

Alexandra: アクセシビリティの高いウェブサイトを構築するために、ウェブ デベロッパーがすべきことは何ですか?

Melanie: 自動化を追加します。使用しているフレームワークやコードの種類に関係なく、既存のリンターから始めましょう。どちらを使用しても構いません。これらのルールのいずれかが破られた場合、ビルドは中断される必要があります。

AI はまだ意図を解読できないため、自動化できないものもあります。たとえば、画像の代替テキストの値は「意味のあるもの」にする必要がありますが、実際にはどういう意味でしょうか?現時点では、自動化ではなく、人間がそれを判断する必要があります。

しかし、自動ツールは「色のコントラストが基準を満たしていません」と教えてくれます。修正してください。抵抗したり、「でも、私はこうしたい」と言ったりしないでください。これはあなたのためではありません。Google の使命は、世界中の人々が毎日利用できるサービスを提供することです。

アクセシビリティは旅のようなもので、常に学び続ける必要があります。私は 10 年以上にわたってアクセシビリティを専門としてきましたが、今でも常に新しいことを学んでいます。言い訳をせずに、ただ実行してください。


Melanie の活動については、ウェブサイト(melanie.codes)と Twitter(@a11yMel)をご覧ください。彼女のアクセシビリティ リソースについては、pleasefunda11y.coma11y-info.coma11y-automation.dev をご覧ください。