Accessibility

建立數位無障礙的三大思維
1. 從同理心出發 2. 建構無障礙產品是「整個團隊」的事 3. 學習無止盡，擁抱成長心態
2024-10-28
    <div class="prose">
  <div class="prose">
  <div class="prose">
  <p>原文連結｜<a href="https://medium.com/uxi-design/%E5%BB%BA%E7%AB%8B%E6%95%B8%E4%BD%8D%E7%84%A1%E9%9A%9C%E7%A4%99%E7%9A%84%E4%B8%89%E5%A4%A7%E6%80%9D%E7%B6%AD-9b34dc940b92">Medium 文章</a></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">近年來，不論是 DEI (Diversity, equity, and inclusion；多元、平等與包容性) 意識抬頭，或是無障礙設計的浪潮，都鼓勵我們聆聽以往被忽略的聲音、關注不同群體的需求。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">當我們試著去了解少數群體的需要，不同的設計概念隨之浮現。經常提到的三種類型分別為：無障礙設計、包容性設計、通用設計。先前遊石有發表一篇文章<a href="https://medium.com/uxi-design/%E6%9B%B4%E5%8F%8B%E5%96%84%E7%9A%84%E6%9C%AA%E4%BE%86-%E6%B7%BA%E8%AB%87%E5%8C%85%E5%AE%B9%E6%80%A7%E8%A8%AD%E8%A8%88-674ffe54a245">〈更友善的未來：淺談包容性設計〉</a>，介紹包容性設計的精神，它與無障礙、通用設計之間的區別。有興趣的話，歡迎大家閱讀，了解三者的不同。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">儘管存在細微的差異，無障礙設計、包容性設計、通用設計的初衷與本質是一致的。這三種設計都是希望幫助所有使用者，設計出好用、友善的數位產品。為了建立一個更加包容和多元化的社會，透過確保產品和服務對所有人都可用和可理解，我們能夠消除對於身體能力、年齡、技能或其他特殊需求的歧視和排斥。這不僅在個人層面上的尊重，也為社會創造了一個更加平等的環境。</span></p>
<p><img src="https://miro.medium.com/v2/resize:fit:500/1*e5tmM5KkiHPOxdgIyxVgKw.png" alt="淺談包容性設計、通用設計與無障礙設計文章縮圖。「無障礙設計」聚焦於輔助身障與高齡使用者的使用情境；「通用設計」希望符合所有群體，盡可能讓特殊族群跟一般使用者可使用同樣行為達成目的；而「包容性設計」為有意識的考量使用群體的多樣性，不僅考量行動上的限制，也需考量使用上的心理情境。" width="630" height="465" data-image="9pbl30863aqm"></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">上圖中，在內圈的無障礙設計已經成為開發產品和實體服務的重要原則之一。無論身體上的限制、視覺或聽覺上的困難，或是技術能力的差異，每個人都應該能夠輕鬆地瀏覽網站、使用應用程式和參與數位互動。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">在開始建立無障礙之前，如果你在心中保有三個關鍵思維，往後在實踐無障礙的路上會更順利。</span></p>
<h2 data-selectable-paragraph="">從同理心出發</h2>
<p data-selectable-paragraph=""><span style="font-size: 18px;">想像一下，當你看不清楚網站內容，想放大字體和畫面時，卻沒辦法放大、無法看清資訊是什麼感受？「確認」的按鈕明明就在網頁上，怎麼點都毫無反應，更新也毫無動靜⋯⋯ 是不是造成很大的困擾呢？當數位產品不支援無障礙，就會有一些使用族群完全無法取得網路資訊。剛剛描述的情況，可能是他們正在經歷的。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">無障礙所提倡的其中一個概念便是「所有人都享有取得資訊的權利」。不管我們有什麼困難或限制，都能取得自己需要的重要資訊。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">這樣的概念，不僅服務了永久性的身心障礙者，也幫助到暫時性與情境式障礙的族群；在我們不方便的時候，提供我們莫大的便利。像是在邊走路邊回覆訊息時，我們可以透過語音輸入快速打字。或是，我們可以拖著行李箱走上無障礙坡道、使用電梯降低我們的負擔。還有，我們在吵雜的餐廳看 YouTube 影片時，有字幕能讓我們理解聽不見的內容。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">如果想更深入了解「永久性身心障礙、暫時性與情境式障礙」，可以參考目前市場上最常被引用的 Microsoft 微軟人物誌光譜。</span></p>
<p><img src="https://miro.medium.com/v2/resize:fit:700/1*3wb1HGc_aRKUXXFoUeEx2w.png" alt="引用自微軟的人物誌光譜，介紹視覺、聽覺、行動、口說等不便的類型，以永久性、暫時性和情境式三個類型來區分。以行動不便為例，永久性可能是生來只有單臂，暫時性障礙則是手臂摔傷打石膏，而情境式障礙則是抱著新生兒的父母。" width="630" height="490" data-image="b1trcd8c0082"></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">未來高齡化的社會，可能會因為疾病與身體老化，出現更多的暫時性與情景式障礙。無可避免地，社會整體對無障礙的需求隨之成長。而同理心便是了解無障礙需求的第一步。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;"><strong>從個人建立同理心</strong>，就像是做使用者研究時，我們需要去理解使用者的問題、痛點，釐清他們所遇到的狀況；我們才能夠從使用者的角度出發，思考可能的解決方法。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;"><strong>在組織內建立同理心</strong>，有助於培養組織成員的無障礙思維、在組織文化中納入數位無障礙文化，最終提升整個組織在無障礙產品的發展成效。「同理心」是無障礙的基礎，我們才能夠了解彼此、看到建立無障礙的重要性。</span></p>
<h2 data-selectable-paragraph="">建構無障礙產品是「整個團隊」的事</h2>
<p data-last-active-input=""><img src="https://miro.medium.com/v2/resize:fit:700/1*69JMRbpZFZL-SlSj2xTV1Q.png" alt="產品開發流程簡圖：共六階段。第一階段、產品發想，集思廣益來構想產品概念。第二階段、產品定義，界定產品範疇與概念，完善產品策略。第三階段、原型設計，以原型來進行深入的評估、確認關鍵功能等。第四階段、驗證與測試，確認正式發佈前，每個面向的可行性。第五階段、產品開發，實際開發與逐步迭代。第六階段、測試與上線，品質測試與確認最終產品上線。" data-image="holw5f7ix2f3"></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">有些團隊在不熟悉無障礙設計的情況下，會安排在產品後期導入無障礙，期待能一次性解決所有無障礙問題來取得標章。實際上，在產品上線前才投入無障礙，會花費許多資源與成本，加重團隊成員的負擔。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">理想中的情況是，在每個產品開發環節都導入與無障礙相關的步驟，這是無障礙成熟的團隊作法。在無障礙成熟之前，團隊成員需要嘗試不同方法將無障礙體驗融入產品開發流程，在達到目標的過程中形塑適應團隊協作的互動模式。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">所謂的<strong>無障礙「成熟」</strong>是什麼呢？以當時 2010 年的 Responsive Web Design（響應式網站設計）為例。在響應式網站概念與應用的初期，Mobile First Approach （行動優先設計）對整個開發團隊帶來新改變、挫折與適應期，最終融入開發團隊的日常。十年多後的今天，網站響應使用者的螢幕設備已經成為基本要求。無障礙最終的「成熟」目標也是如此，將其融入日常程序，各個產品開發環節都考量到無障礙，最終無障礙會成為產品的其中一個面向。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">建構無障礙產品是各個職能一同協作、合作的過程，不單是前後端工程師，或是品質管理專家的職責。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">舉例來說，為了建立產品的無障礙面向，身為<strong>產品經理</strong>，需要熟悉無障礙規範，進而定義開放優先順序、調配團隊需要的資源，並協助團隊釐清問題。</span></p>
<blockquote><p data-selectable-paragraph=""><span style="font-size: 18px;">只有足夠瞭解無障礙的目標與價值，才能讓產品滿足使用者需求，並向團隊內外傳遞無障礙的價值，甚至引導高層將無障礙願景融入企業的商業目標。</span></p></blockquote>
<p data-selectable-paragraph=""><span style="font-size: 18px;">無障礙對企業和組織的商業利益也具有積極影響。它不僅能夠擴大潛在客戶群體，吸引更多用戶和消費者，還提供了優質的使用體驗，提升了品牌形象和忠誠度，進而增加了市場競爭力。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">而<strong>品質管理團隊</strong>需要熟悉規範與檢測標準，並善用不同類型的輔助技術，在檢驗的過程中協助團隊排除無障礙相關的問題。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">除了上述兩種的產品開發團隊角色，行銷、客服、法遵、文案撰寫等其他組織成員也能為無障礙盡一份心力。像是撰寫產品文案時，如何運用產品的文字，讓認知障礙族群、較無法理解複雜概念等類型的使用者，也能操作產品，達到他們的目的。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">有鑑於此，W3C （全球資訊網協會；World Wide Web Consortium）針對不同的職能，將 WCAG 2.1 （網頁內容無障礙指南 2.1）的規範分類，協助團隊角色更瞭解自己能如何實踐無障礙。如果你已經熟悉 WCAG 規範的內容，並想深入瞭解職責劃分，可以參考<a href="https://www.w3.org/community/wai-engage/wiki/Accessibility_Responsibility_Breakdown" target="_blank">這份資料</a>。</span></p>
<h2 data-selectable-paragraph="">學習無止盡，擁抱成長心態</h2>
<p data-selectable-paragraph=""><span style="font-size: 18px;">產品開發導入無障礙看似高門檻，實際上我們只要掌握基本概念，它並不如想像中困難，而是需要耐心與實踐。建立無障礙文化是場馬拉松，而不只是短跑比賽，它需要長期的承諾與投入。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">根據具有許多國外實戰經驗的無障礙專家表示，要將一個成熟的數位產品成功建立為無障礙，產品團隊熟悉無障礙的流程，需要至少五年的時間。五年的過程可能包含教育訓練、確認產品現況，並逐步從設計、程式開發、品質管理等面向讓團隊熟悉無障礙的運作。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">要建立一個成熟的無障礙產品，以下是三個我們建議的<strong>出發點</strong>：</span></p>
<ul><li><span style="font-size: 18px;">產品設計師和研究員們，可以將 Heuristic Principles（啟發式評估的十大原則）推展到使用輔助技術與輔助工具的障礙族群，讓自己更了解無障礙的原則與出發點。下一篇我們會深入說明，怎麼用啟發式評估的概念，來推展到數位無障礙設計。</span></li></ul>
<ul><li data-selectable-paragraph=""><span style="font-size: 18px;">練習把 WCAG（網頁內容無障礙指南）應用到產品上，並且深入瞭解 WCAG<strong>，每個規則的背後都有闡述其脈絡與應用情況</strong>。透過實務練習，我們就會逐漸掌握無障礙的心法。</span></li><li data-selectable-paragraph=""><span style="font-size: 18px;">直接觀察身心障礙者怎麼操作產品，是在研讀 WCAG 之外，最直接理解無障礙的實踐方式。</span></li></ul>
<p data-selectable-paragraph=""><span style="font-size: 18px;">一旦開始動起來，不論是從哪個面向切入，團隊漸漸能釐清問題並安排優先順序，逐步將產品的不同功能轉變為無障礙版本。這是個需要耐心的實踐過程。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">投入教育訓練是幫助團隊開啟無障礙大門的另一種方式，透過教育訓練可以培養不同職能的無障礙專家。對於工程師、品質管理、產品設計師等角色而言，除了掌握無障礙的基本概念，他們也需要培養技術與實務練習，才能真正落實與自身職能相關的無障礙面向。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">舉例來說，雖然網站在呈現／渲染（render）圖示時，有許多不同的選擇：背景圖片、Unicode 字元、圖示字型（icon font）、可縮放向量圖形（SVG）等格式；在考量到包容性時，SVG 格式是最適合無障礙網站的解決方案。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">這些教育訓練培養的專家，未來能在組織中發揮影響力，並且將無障礙的知識與技術交給團隊的其他成員。有機會的話，我們也能借鏡國外組織的作法，聘僱具有專業無障礙知識的身心障礙者加入團隊中。除了有助於增加身心障礙者的就業機會，也能將使用者對於無障礙的切身洞察帶入組織之中，幫助企業建立無障礙。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">在數位無障礙的路上，學習無止盡，我們也會在過程中挖掘產品更多的可能。</span></p>
<h2 data-selectable-paragraph="">結語</h2>
<blockquote><p data-selectable-paragraph=""><span style="font-size: 18px;">無障礙是建立更平等的世界的關鍵。幾十年來，我們致力在開發和設計新技術時，參考身心障礙者的意見、專業知識和創意，設計出所有人都能使用的技術。</span></p></blockquote>
<p data-selectable-paragraph=""><span style="font-size: 18px;">蘋果執行長 Tim Cook</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">看向科技巨頭 Apple 蘋果，已經開發過無數個數位無障礙功能，而 iOS 和 iPhone 被身心障礙者視為最好用的工具，蘋果仍持續地用上述的三大思維，不斷探索、創新、推動更平等的世界。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">這些新技術幫助了許多人，一週前，蘋果再次推出新的<a href="https://www.apple.com/accessibility/" target="_blank">輔助技術</a>。現在除了以語音輸入來打字，還能將輸入內容轉為語音。我們可以一邊使用放大鏡功能，一邊用手機辨識人事物、文字、符號和場景，甚至，在視訊的時候會有即時字幕支援。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;"><strong>從同理心出發</strong>，懷著無障礙的初衷，了解到數位無障礙是<strong>全體開發團隊都需要一同參與</strong>的面向，並且<strong>擁抱成長心態來實踐</strong>，這是在打造無障礙產品前，我們需要保有的思維。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">掌握以上三大關鍵後，希望讓你與無障礙的距離更近了一步。接下來，我們會從設計與研究的角度出發，讓你了解身為產品設計師或設計研究員，能夠做什麼事情來幫助實踐數位無障礙。</span></p>
<p data-selectable-paragraph=""><span style="font-size: 18px;">Let’s do it!</span></p>
<h2 data-selectable-paragraph="">Key Takeaways</h2>
<ol><li data-selectable-paragraph=""><span style="font-size: 18px;"><strong>從同理心出發</strong><br>・從個人建立同理心，就像是做使用者研究時，我們需要去理解使用者的問題、痛點。<br>・在組織內建立同理心，培養成員的無障礙思維、納入數位無障礙文化，最終提升無障礙產品的發展成效。<br>・微軟人物誌光譜：「永久性身心障礙、暫時性與情境式障礙」的定義</span></li><li data-selectable-paragraph=""><span style="font-size: 18px;"><strong>整個團隊一同建構無障礙產品</strong><br>・無障礙「成熟」的定義：就像 2010 年的響應式網站設計導入日常開發的一環。<br>・W3C （全球資訊網協會）針對<a href="https://www.w3.org/community/wai-engage/wiki/Accessibility_Responsibility_Breakdown" target="_blank">團隊職能與分工</a>的建議。<br>・投入教育訓練，培養不同職能的無障礙專家。<br>・聘僱具有專業無障礙知識的身心障礙者加入團隊。</span></li><li data-selectable-paragraph=""><span style="font-size: 18px;"><strong>擁抱成長心態，無障礙需要長期的承諾與投入<br></strong>・三個出發點，來建立成熟的無障礙產品：<br>・將 Heuristic Principles（啟發式評估的十大原則）推展到使用輔助技術與輔助工具的障礙族群。<br>・深入瞭解 WCAG，探究規則的脈絡與應用情況，將準則應用到產品上。<br>・直接觀察身心障礙者怎麼操作產品，是最直接理解無障礙的方式。</span></li></ol>
<p></p>
<p><span style="font-size: 14px;">封面圖片：<a href="https://unsplash.com/photos/three-green-leafed-plants-sEApBUS4fIk" target="_blank">Unsplash</a></span></p>
</div>
</div>
</div>
你可能有興趣的文章
和我們聊聊您的需求，
一同定義未來願景
共同打造更優質的無障礙體驗
Our Locations

#1 UXI Prime Office

+886-2-2709-2260
臺北市大安區安和路二段 63 號 4 樓
#2 UXI Basecamp

+886-2-2709-3060
臺北市大安區安和路二段 7 號 9 樓之 2
推開數位無障礙大門，輕鬆淺談數位無障礙規範

建立數位無障礙的三大思維

為銀髮族打造友善的數位介面

Our Locations

#1 UXI Prime Office

#2 UXI Basecamp
