Melanie Sumner 是軟體工程師,專精於數位無障設計。我們談到了工程、無障礙設計、Ember.js,以及投資這些工作的重要性。
這篇文章會介紹社群專家 (屬於學習無障礙工具!)
Alexandra Klepper:感謝你的參與!請問您是誰?您從事哪種工作?
Melanie Sumner:我是軟體工程師 Melanie Sumner,專精於數位無障設計。我從事網頁程式開發已有 25 年,我第一份工作是... 有點像間諜。我曾是美國海軍的情報分析師,程式設計是我的興趣。
我其實不太喜歡當間諜。我發現自己不喜歡死亡。由於大多數人都沒有,因此當他們必須靠近時。我必須決定下一步想做什麼,也該是時候將興趣轉變為職業。在過去 10 年間,我一直專注於無障礙空間的軟體工程。
Alexandra:你不常聽到「我先前是間諜」這類話,沒什麼大不了的,您為何投入無障礙設計工作?
Melanie:當時我在北卡羅來納大學教堂山分校的發展部工作。這裡的開發並非指網站開發,而是指籌款等開發活動。
我的直屬主管有視力障礙,他必須將所有內容放大至 400% 才能看見。他是一位出色的軟體工程師。其實,你可能是我遇過的最佳主管。但他總是會因為放大看我的作品而弄壞我的東西。如果不思考要如何建構回應能力 他們就會損壞
主管的老闆是藍色的色盲,我不確定你是否知道 UNC 藍的樣子,但它是這種淺天藍色。他們喜歡在白色背景上使用這項功能。
Alexandra:(笑) 不,
Melanie:老闆一抱怨他根本沒看到我的作品!我需要為網站開發一組互補的顏色和配色。 這讓我開始思考色彩對比,以及色盲 (或其他視障) 人士如何使用網路。
由於 UNC 是一所州立大學,因此須遵守美國聯邦法規,符合 WCAG 無障礙級別 AA 的規定。我們希望達到 AAA 等級,因為這是一所教育機構。
在進一步瞭解州和聯邦政府的規定,並開始閱讀 W3C 無障礙規格後,我認為「所有這些規定都很合理」。據我所知,大多數網站都未遵守規定。當然,自從網路誕生以來,人們就一直致力於改善網路無障礙性。JavaScript 工程師在數位無障礙功能方面的表現有時並不容易。
我認為無障礙設計是網路的最後一道防線。許多優秀的人員致力於無障礙自動化,我們需要以解決其他難題 (例如效能和安全性) 的方式,來處理這類問題。
Alexandra:您可能在海軍和 UNC 讀過許多冗長複雜的文件。您是否覺得很難理解規格?
Melanie:我大概要讀五遍才能瞭解,而且我之前也讀過其他規格。我總是告訴大家,如果不理解規格,也不必感到不好意思,因為我讀了五次規格!我甚至完全不開玩笑。
我們需要花費大量時間才能適應規格語言。如果您無法正確解讀,可能會做出錯誤的決定。另外,請務必瞭解許多規格語言都是為瀏覽器開發人員設計。請尋找「作者應」這類字詞,因為這代表網站開發人員。
Alexandra:如果更多開發人員知道如何解讀規格,網路上的內容就會更完善。
Melanie:網站為您提供這類解讀服務,我建立了 a11y-automation.dev,這個網站就像是我的孩子,也是我的副業。我會逐項列出每項無障礙違規事項,並連結至相關的 WCAG 成功標準。如果有自動化功能可避免發生錯誤,我會提供這項解決方案。
您可以熟悉潛在違規事項清單,但更重要的是瞭解如何修正。如果沒有自動修正項目,您或許可以編寫 lint 工具或範本,或者編寫某種測試。
我比較喜歡在開源軟體中工作,因為您可以互相交流,提供改善建議 (有時會改善,有時不會,但我們都會盡力)。我們會互相借重彼此的內容,最後為網路帶來非常出色的成果。
如何為無障礙功能提供資金
Alexandra:我非常喜歡 pleasefunda11y.com。讓開發人員學習如何建構無障礙網站非常重要,但如果沒有高層主管的資金和核准,他們可能無法取得資源。為什麼決定建構這個網站?
Melanie:無障礙設施的資金來源不足,讓我感到不悅。所有開放原始碼資金似乎都會持續提供給 CSS。我很喜歡 CSS,我們可以用它做很多事。
我建立這個網站,是因為 Addy Osmani (Chrome 軟體工程經理) 與我聯絡,表示他知道我正在尋求無障礙功能的經費,但想瞭解哪些具體工作可以獲得經費。這會造成很大的問題:開放原始碼的贊助者希望將資金提供給特定專案,而不是沒有明確結果的一般想法。我花了一些時間記錄一些具體計畫,包括需要什麼,以及這些計畫如何協助讓網站更易於存取。
即使沒有我,公司也能朝著這些目標努力,我們可以透過非常重要的方式,推動網路無障礙的發展。相較於其他網路活動,這筆支出非常少,但對人們的生活影響卻非常大。
而目前的思考方法通常是 「有多少人具有身心障礙?」正確的拼法應為:「What is any person's relationship to their technology?」
有些人告訴我:「我認為色盲並非一種障礙。」您可能不會將自己視為色盲人士,但這確實會影響您與科技的關係。
Alexandra:請進一步說明你與科技的關係。這與無障礙設計有何關聯?
Melanie:舉例來說,如果您是神經多樣性人士,可能需要非常簡單的語言和非常明確的指示。您可能會在流程中瀏覽三到四個畫面,一次做出幾個選擇,直到流程結束為止。目前沒有針對現代技術應用程式提供良好的指南。
我們有整間公司在做開發維運,如果你試著使用其中一些網站,你會覺得「天啊!」我們最近會嘗試將所有介面都納入其中。
Alexandra:可以舉例說明嗎?
Melanie:例如,GitHub 有包含巢狀分頁的下拉式選單。而且 [惱怒地嘆息]。我因沮喪而失望 (即使我很沮喪)。新型網頁必須不斷成長,才能滿足新的需求。但我們也有責任以不讓使用者落後的方式進行開發。
這就是我的熱情所在。我不希望有人因為無法使用工作所需的工具而無法找到工作。
Alexandra:百分之百。許多人常常會想到為外部使用者打造無障礙產品,但不一定會想到自己的員工。
Melanie:我認為,這項資金建議可能對每個人都有益。
我一直聽到工程師說他們想實現無障礙設計,但「我的公司不在乎」。我敢打賭他們會在乎!您只需要彌補業務邏輯差距即可。向他們說明這對企業有何益處。當然,網站是開放原始碼,我熱愛貢獻內容和編輯內容。
Alexandra:無障礙功能通常會留到程序結束時才處理,例如「我們可以稍後再讓這個功能無障礙」。不過,與在整個專案中整合無障礙做法相比,日後再新增這些功能會耗費更多時間。
Melanie:我經常會說:「您想付費建構一次,還是想付費建構兩次?」
Ember.js 和核心無障礙團隊
Alexandra:據我所知,您也參與 Ember.js 架構核心團隊。你如何參與?
Melanie:我受聘於摩根大通,負責該公司的企業投資銀行平台。Ember 是一種繁瑣的 JavaScript 架構,當您需要相當穩定 (甚至有點無聊) 時,可以幫助您避免編寫損失大量金錢的程式碼。Ember 提供向後相容性保證,因此即使您使用的是主要版本,也能隨時升級。我們確實嘗試以漸進方式處理,因此不會中斷您的應用程式。
總之,我參加了 Ember 大會,並在社群中認識了許多人。澳洲民族人很善良。「還有一種嚴謹的行為規範」是我在其他地方還沒見過的。
退伍後,我想從事保全工作。我參加了一次資訊聚會 但都沒看到其他女性其中一位年長的男士看著我說:「親愛的,你確定你在正確的房間嗎?」
Alexandra:[呻吟] 好痛這一點一點也不令人意外。我也有類似的經驗。
Melanie:我想說的是 2011 年,也許是 2012 年?市場環境已經大幅改變。我那天晚上參加了聚會,證明瞭我的觀點。我好不覺得這個留言被破壞了。我會開玩笑、做好筆記,並參與對話,讓大家知道我有在現場。我覺得我的職涯經歷,很多都是在證明男性的錯誤。
但我不想讓女性變成軟體工程師,只是為了證明男人有錯,我希望成為軟體工程師,因為這很有趣 因為這很有趣 所以我希望成為軟體工程師
Alexandra:當然可以。
Melanie:我將自己對無障礙設計的瞭解分享給 Ember 社群,因為銀行平台必須符合美國聯邦法規。Yehuda Katz 和 Tom Dale 表示:「我們團隊有空缺,我們有許多 JavaScript 專家、效能專家,以及超級聰明的人員,但我們需要具備無障礙知識的人才。」並邀請我加入核心團隊。
我正在推動相關計畫,讓 Ember 在預設情況下提供無障礙功能。也就是說,當您說出 ember new <my-app-name>
時,應立即通過 WCAG 成功標準。
Alexandra:我在 GitHub 上看到 Ember 的無障礙工具清單。您是否發現 Ember 社群的使用者很樂意為這些工具做出貢獻?
Melanie:這也是這項工作的一大亮點。我在 LinkedIn 工作時,曾為 Ember 編寫無障礙 Lint 規則。接著,我離開 LinkedIn 到 Hashicorp 工作,其他人仍在為 linter 做出貢獻,因為這對他們來說很有用。這就是這部作品讓我感到興奮且激動人心的部分。
我們認為,無障礙設計是基本人權。但我沒想到這裡
我們討論的是:我們可以實施哪些措施?發生在何時?我們要怎麼做?我們要如何教導這項功能,並讓它具有回溯相容性?我們如何協助開發人員提供無需額外建構或規劃的無障礙支援功能?
Alexandra:無障礙是公民權利,這讓我起雞皮疙瘩!這應該是我們都知道的事實。
Melanie:我曾有人表示不對勁的說法,例如「如果我失明,我會不會使用網際網路」。或者,您可能會想:「為什麼我必須考慮到使用者有 5% 的人有身心障礙,而 90% 的人都能正常使用應用程式?」我不會進行這類討論,因為這類討論通常會讓人分心,無法專心工作。
撰寫無障礙程式碼時,您會考慮以 W3C 規格建構網站,因此可提升效能。您會使用語意 HTML 而非單純的 div,並使用標題。您會選擇 <button>
,而不是將點擊事件新增至 <div>
,這樣就能提升效能。
做一件事:自動化無障礙功能
Alexandra:網頁程式開發人員應如何建構無障礙網站?
Melanie:新增自動化動作。無論您使用何種架構,都可以從現有的 Linter 開始著手。我無所謂你使用哪一個!如果違反其中一個規則,您的建構作業就會中斷。
AI 尚未解讀意圖,因此部分項目無法自動化。舉例來說,圖片的替代文字值應「具意義」,但這實際上代表什麼意思?現階段,人類需要知道這一點,而不是自動化作業。
不過,自動化工具可以告訴您:「您未通過色彩對比測試。」只要修正即可。不要抗拒,也不要說「但我不想,我喜歡這樣做」。這不是你的錯。我們致力於讓全球使用者每天都能使用我們的服務。
無障礙設計是一條漫長的旅程,您永遠都會在學習中。我專攻無障礙功能已有十多年,但仍持續學習新事物!別怕,放心做就對了。
請造訪 Melanie 的網站 melanie.codes 和 Twitter 帳戶 @a11yMel,瞭解她的最新動態。請造訪 pleasefunda11y.com、a11y-info.com 和 a11y-automation.dev,查看她的無障礙資源。