圖表系列 ❸
拆解圖表大門，零件有哪些？
圖表可訪問性零件有哪些 | 怎樣才叫「夠」 accessible ？
在圖表可訪問性系列上一篇《圖表大門上了鎖，很重要嗎？》，我們提供了「可感知 / 可理解」以及「設計 / 功能」這兩個面向，所組成的四個維度來說明，究竟圖表可訪問性可能是什麼。本篇我們試著透過體驗和介紹圖表可訪問性的稽核規範，讓圖表可訪問性概念更具體、鮮明。
體驗看看才知道
或許有些朋友會覺得「字我都認識但合在一起就好陌生，圖表可訪問性還是好抽象！」。我們嘗試製作了一個頁面，刻意使用 trial and error 方式說明，並非刻意要再製障礙，勾起負面經驗。因為每個人的生命經驗都是獨特的，可能需要找到適合自己的理解方式，也因為生命經驗都是獨特的，不一定能同理多元的觀點，或實際經驗到圖表障礙。頁面中會盡可能使用同一筆數據，呈現圖表可訪問性的正向、負向例子，包含：顏色對比度、單色填滿、樣式填滿、鍵盤導航時有 / 沒有可見的聚焦位置提示、圖表可聽化等。邀請有興趣的朋友，可以到 Demo 頁面跟著說明文字操作看看。
怎樣才叫「好」
究竟什麼是「好的」圖表可訪問性，怎麼稱得上圖表「夠」 accessible 呢？「 A11y 新手村」夥伴也跟大家一起在探索中，但如果必須先提供一個簡短回答，或許可以參考 Frank Elavsky 發展的圖表檢核規範 Chartability ，除了適用大部分網路無障礙情境的 W3C 、 WCAG 等規範之外，這套 Chartability 很適合用來檢視自己周遭數位環境中的圖表。目前這套稽核規範已經發布到 2.0 版，提供了 7 大檢測原則，可以讓我們對圖表可訪問性有一個概觀圖像。以下僅列出規範中建議優先檢測的項目，每一個原則其實還有其他細項，可以點擊連結到規範官網瞭解更多：
原則1.可感知
使用者必須能夠輕易透過（視覺、聽覺、觸覺）感官辨識圖表內容
- 低對比度 ( ❗ critical )
- 內容只能夠用視覺感知 ( ❗ critical )
- 字體過小 ( ❗ critical )
- 視覺呈現上可能觸發光敏性痙攣及癲癇風險 ( ❗ critical )
原則2.可操作
所有操作必須可以容錯、可以探索、支援多種操作（不限滑鼠，包含鍵盤等）
- 互動方式只支援一種輸入操作 ( ❗ critical )
- 沒有互動方式的提示或指引 ( ❗ critical )
- 自訂的鍵盤、觸控操作方式不能跟螢幕閱讀器設定衝突 ( ❗ critical )
原則3.可理解
所有資訊、數據呈現必須避免混淆、清晰、盡可能降低認知負擔
- 沒有解釋圖表目的或如何閱讀圖表 ( ❗ critical )
- 沒有標題、摘要或註解 ( ❗ critical )
- 可閱讀性不適當 ( ❗ critical )（例如，用字過於艱深）
原則4.穩定
設計必須符合現有的規範標準，而且可以兼容不同使用者的輔助科技選擇
- 不符合無障礙或輔助科技標準
- DOM網頁元素誤用（例如，按鈕但不是用<button>元素）
- 科技支援度不夠廣（例如，只支援Chrome一種瀏覽器）
原則5.妥協
資訊流必須透明、容錯，並考量到多元且可能使用不同輔助科技的使用者，閱讀圖表時會有不同偏好
- 圖表沒有附表格 ( ❗ critical )
原則6.輔助工具
人和圖表互動方式，必須是聰明的、支援多種感知方式，降低閱讀圖表時所需的認知、人工上的負擔
- 資料密度不適當 ( ❗ critical )
- 導航或互動方式過於疲乏 ( ❗ critical )
- 視覺上凸顯的特徵或關係無法描述 ( ❗ critical )（例如，統計上有顯著、重要數值至少至少要能用文字描述）
原則7.彈性
設計必須尊重使用者對瀏覽設備的偏好設定（瀏覽器、作業系統），或提供適合（簡報者、閱讀者）不同角色的操作。
- 使用者不能夠調整成自己喜歡的樣式 ( ❗ critical )
原則好複雜，該怎麼理解
除了上述原則之外，如果有發現好的案例 Chartability 也會在詳細版本的說明中附上連結，也有提供每一個檢測規範的參考來源。例如，在可操作的原則中，有一個可訪問化學結構圖表的案例，是我們覺得很特別、特定專業領域會接觸的圖表類型。這個化學結構圖表的互動中支援了一些自訂的按鍵導覽，例如透過鍵盤按下 Enter 或 A 按鍵，又或者滑鼠點下左鍵，可以啟動鍵盤導覽模式，而按下 B 按鍵，則可以啟動選單導覽。
另外， Chartability 還提供了一些稽核範例，透過具體案例告訴我們要如何跟著這套規範進行稽核。而稽核過程使用的工具例如 Viz Palette 或 Chroma 也很適合收編進自己的工具箱！
未來可能長成什麼樣
圖表可訪問性未來趨勢與方向，有不少團隊嘗試結合電腦視覺、自然語言技術，不論是「電腦講解圖表給你聽」的技術，今年2月村報介紹的 SeeChart 、 VoxLens ，利用自然語言理解（Nature Language Understanding, NLU）在圖表加上語音說明，由電腦擔任小助手告訴我們圖表中重要的統計數字或趨勢。也可以期待 Highcharts GPT 這類服務，「只要跟機器人聊個天，圖表就做完了！」，大大降低製作圖表在程式、語言或視覺編輯上的門檻。另外， Highcharts accessiblity 開發團隊的簡報中，也說明了團隊開發時的考量以及觀察到的趨勢。
最後最後，本篇文章礙於篇幅並沒有逐一說明 Chartability 檢測細節，不過其中有 14 個標示 ❗ critical 的項目，是 Chartability 規範建議適合入門、可以優先檢測，推薦有興趣的朋友可以用身邊的圖表當成案例，實際操作看看！
本文作者：又建
喜歡資料科學的社福人。很希望能把資料科學應用在公共議題、社會政策上。
聯絡信箱：ikngoo@twvip.org
