ICS35.240L60團 體 標 準T/ISC0065-2024企業級產品UI設計可訪問性（無障礙）EnterpriseproductUIdesignaccessibility(barrierfree)specification（發布稿）2024–11–26

2024–11–25實施中 國 互 聯 網 協 會 發布T/ISC0065-2024T/ISC0065-2024目 次目 次 I前 言 1范圍 1規范性引用文件 1術語和定義 1符號和縮略語 1總體架構 1技術要求 1文本描述要求 1時基媒體輸出要求 2可辨別性 2可預測性 3輸入輔助 3頁面布局要求 4可操作性 5本土化 611前 言本文件按照GB/T1.1—2020《標準化工作導則第1部分標準化文件的結構和起草規則》的規定起草。請注意本文件的某些內容可能涉及專利。本文件的發布機構不承擔識別這些專利的責任。本文件由中國互聯網協會提出并歸口。本文件起草單位：中國信息通信研究院、北京盡微致廣信息技術有限公司、北京創作美好科技有限公司、北京高德云圖科技有限公司、阿里巴巴控股集團、招商銀行股份有限公司、中國銀行股份有限公司、中國第一汽車集團有限公司合眾新能源汽車股份有限公司、中央美術學院、中國計量大學、北京飛書科技有限公司、東海證券股份有限公司、科大訊飛股份有限公司、浙江零跑科技股份有限公司、北京三快在線科技有限公司、平安銀行股份有限公司、天津大學、天津美術學院、中國郵政儲蓄銀行、北京師范大學、廣州小鵬汽車科技有限公司、北京集度科技有限公司、泰康保險集團股份有限公司、中國電信股份有限公司研究院、福建省農村信用社聯合社、寧波銀行股份有限公司、北京郵電大學、北京汽車研究總院有限公司、江蘇常熟農村商業銀行股份有限公司、交通銀行股份有限公司、京東科技控股股份有限公司、奇瑞汽車股份有限公司、麒麟軟件有限公司、華夏銀行股份有限公司、龍盈智達（北京）科技有限公司、清華大學國家服務外包人力資源研究院、北京科技大學、國能數智科技開發（北京）有限公司。本文件主要起草人：王景堯，吳荻，馮藝卓，曾晨曦，馬霽陽，羅琨，黃夢楠，孫繼成，張信峰，孫峰，曹海嘯，何夢醒，張家琿，常天恩，張然，顧世榮，王人杰，陳明，張樂，王妍，劉佳，鐘偉，程峰，王帥，趙默涵，李昭璐，呂貴林，劉杰，高杰，王芊，俞書偉，秦篤印，朱斌，朱一冰，王昊，張卓超，馬冬冬，沈越然，張立，趙倩，王兆龍，胡君，趙天嬌，朱鵬飛，蔣旎，張欣，郭利菊，張健，周雯，蔣希娜，馬丁，明芳文，范召國，董智明，劉馨，郝小超，李鐵萌，馬洋，胡丁丁，李莎莎，潘琳，吳佳虎，陸文杰，黃河東，蓋勝平，王雙，忻運躍，楊明星，陳芳，楊迎，鄧煥玉，何雄，竇金花，李夏光，劉斐。T/ISC0065-2024T/ISC0065-2024PAGEPAGE1企業級產品UI設計可訪問性（無障礙）規范范圍本文件規定了企業級產品UI設計可訪問性（無障礙）規范。本文件適用于互聯網類產品的企業級產品UI設計可訪問性（無障礙）的評價、測試和指導，也可作為第三方權威評估機構衡量企業級產品UI設計可訪問性（無障礙）的標準依據。規范性引用文件下列文件對于本文件的應用是必不可少的。凡是注日期的引用文件，僅注日期的版本適用于本文件。凡是不注日期的引用文件，其最新版本（包括所有的修改單）適用于本文件。術語和定義下列術語和定義適用于本文件。UI（無障礙）UIDesignAccessibilityBarrierfree)UI設計可訪問性（無障礙）指的是在用戶界面設計中考慮到各種使用者的需求，包括殘障人士、老年人和其他特殊群體，確保他們能夠方便地獲取信息和使用產品或服務。這種設計考慮到視覺、聽覺和操作上的障礙，通過合適的設計和技術手段，使得產品對所有用戶都更加友好和易用。Time-basedMedia基于時間的媒體藝術，泛指使用膠卷、錄像、錄音、投影和電腦元素等具有播放長度的作品。SynchronizeMedia同步媒體指實時同步的媒體活動。包括但不限于網絡直播、新聞發布會和在線培訓演示。符號和縮略語下列縮略語適用于本文件。UI：用戶界面（UserInterface）LOGO：徽標或者商標（logotype）總體架構企業級產品UI設計可訪問性（無障礙）規范旨在確保產品能夠滿足各種用戶的需求，包括身體殘障、視覺障礙、聽覺障礙和認知障礙的用戶。通過遵循規范，產品能夠提供清晰的導航、易于理解的內容結構、充分的鍵盤操作支持、以及對輔助技術的友好性，從而最大程度地包容并服務所有用戶群體，實現真正意義上的包容性設計。技術要求文本描述要求為任何非文本內容提供文本描述，以便將其延展為部分用戶需要的其他形式，例如大字體、盲文、語音、符號或更簡單的語言。控件或輸入框若非文本內容是一個可操作控件，或允許用戶輸入的組件，則需要明確的名稱描述其目的和用處。時基媒體若非文本內容是一個時基媒體，則至少需要通過文本描述其題目標識。驗證碼(CAPTCHA)若非文本內容的目的是為了區分用戶是計算機還是人，則需要提供描述其目的和內容的文本。并提供多種感官形式輸出驗證碼，以適應不同的感知殘障。裝飾性元素若非文本內容是視覺裝飾性元素、輔助格式布局，或是不展現給客戶的隱藏元素，則需要以不被殘障輔助技術識別的方式實現。時基媒體輸出要求需提供以其他形式輸出的內容。如字幕和閉合字幕、音頻描述、轉錄文本等，具體如下：a)預錄制純音頻：提供時基媒體的替代物，展示預錄制純音頻內容的等價信息；b)預錄制純視頻：提供時基媒體的替代物或音頻軌道，展示預錄制純視頻內容的等價信息。多媒體視頻和音頻對于預錄制的視頻和音頻素材，須符合以下標準（除非音頻或視頻素材已經提供文本描述）a)音頻素材：需提供以其他形式輸出的音頻內容，呈現音頻內容的等效信息。b)視頻素材：需提供視頻素材的替代方案，或提供視頻對應的音頻內容來呈現等效信息。字幕(預錄制素材)為所有預錄制的多媒體素材提供字幕（除非該音視頻素材是文本信息的替代方案，并以明確標注）字幕(直播)為同步媒體中的所有實時音頻內容提供字幕。語音描述為預錄制的視頻素材提供語音描述。可辨別性用戶可以更容易聽或看到頁面內容顏色的運用不將顏色用作傳達信息、動作引導、提示信息或區分視覺元素的唯一方式。音頻控制若網頁上的音頻文件自動播放超過3秒，需要通過某種方式可以暫停或停止音頻播放。或提供獨立于系統音量的機制來控制音頻音量。文本對比度大文本(標題)和背景圖像呈現的色彩對比度至少為3:1；正文文本和背景圖像呈現的色彩對比度至少為4.5:1，以確保內容便于閱讀和識別。文本大小的調節無需借助輔助工具，可將文本大小調整至200%。同時保證其功能性和內容完整性。文本間距使用支持以下文本樣式屬性的語言實現的內容的情況下，通過設置以下內容來保證文本的可讀性：a)行高至少為字體大小的1.5倍；2字母間距（字距）0.120.16文字圖片(即文字以圖片的形式呈現)盡量使用文本而非文字圖片來傳達信息。以下情況除外：a)定制化：可根據用戶需求在視覺表達層面定制文字圖片；b)重要文本信息：特定的文本呈現方式對于所傳達的信息至關重要（例如LOGO中包含的文本內容或品牌名）非文本內容對比度以下視覺元素與周邊環境顏色需呈現3:1的顏色對比度：組件：用戶界面中的組件，以及判斷其狀態的視覺信息（例如輸入框組件邊框顏色）b)圖片：需要用戶理解圖片中的部分內容懸停和聚焦狀態下的內容主要指通過光標懸浮或聚焦，可呼出額外信息的圖層信息可被關閉：提供無需通過移動光標懸停區域或切換鍵盤焦點，可關閉信息提示的機制。除非額外信息展示的是輸入錯誤的提示，或不對其他內容存在遮擋。光標可懸浮：若是通過光標懸停觸發的額外信息展示，則應滿足光標移動到額外信息區域，內容不會消失信息持久性：額外提示信息應保持可見，直到光標移出觸發區域、移除聚焦狀態、用戶將其關閉或展示信息失效。可預測性網頁的視覺外觀和操作方式應具有可預測性。聚焦時當界面組件進入聚焦狀態時，不會引發上下文的更改。輸入時對于界面中組件的操作不會自動引發上下文的變化，除非在使用組件之前已向用戶進行了說明了。導航的一致性在一個網站中，多個網頁重復出現的導航每次出現時都以相同的順序出現，除非用戶發起了變更。視覺一致性在一個網站中，具有相同功能的組件應具有一致性。輸入輔助輸入錯誤的識別如果自動檢測到輸入錯誤，會標識出錯誤，并以文本方式描述錯誤。標簽或說明當需要用戶輸入內容時，應提供標簽或說明文本。錯誤建議如果自動檢測到輸入錯誤并且已知如何糾正錯誤，則向用戶提供糾正建議，除非會危及內容的安全性。錯誤預防對于會導致用戶產生法律承諾或財務交易的網頁，修改、刪除數據時，或提交用戶數據時，應滿足以下任一條件：可逆轉：提交是可逆轉的。檢查：用戶輸入的數據會被檢查輸入錯誤，并為用戶提供進行更正的機會。c)確認：在最終提交之前，用戶可查看、確認和更正信息。語音輔助支持殘障等閱讀障礙人事的語音輔助功能（可選）。操作輔助誤操作的識別在檢測到用戶可能進行誤操作時，系統應明確標識并提供相應的反饋信息。操作提示對于任何需要用戶進行操作的功能，應提供清晰的標簽、圖標或幫助文本，以便用戶理解其作用。錯誤糾正建議如果系統檢測到誤操作，并且知道如何糾正，應提供糾正操作的明確建議，除非這樣的糾正會違反安全性或隱私政策。操作可逆性對于涉及重要數據修改、刪除或提交的操作，系統應滿足以下至少一個條件：a)可逆操作：任何修改或刪除操作都應該是可逆的，允許用戶撤銷操作。操作確認：在執行操作前，系統應提供預覽，并讓用戶有機會更正。多步驟提交：對于重要操作，應采用多步驟確認流程，確保用戶有機會在最終提交前重新檢查和更正。誤觸防護在設計界面時，應考慮到誤觸的可能性，通過增大可點擊區域、添加間隔、減少易誤觸的元素來降低誤觸風險。清晰的返回和取消選項為用戶提供明確的返回和取消選項，以便在誤操作或改變主意時可以輕松撤銷。操作反饋每次用戶操作后，系統應提供視覺、聽覺或觸覺反饋，以確認操作已被執行。頁面布局要求合理的布局設計頁面的不同部分必須易于定位和識別。包括但不限于導航、菜單、標題、正文部分。不同模塊應位于符合用戶習慣的可預測的位置，并且具有視覺一致性。界面布局保持聚焦可操作頁面布局可根據屏幕尺寸進行自適應，但當可視的布局結構發生變化時，界面中組件依然可以保持焦點聚焦的操作順序，保持可操作性。文本內容可讀性網頁中采用便于閱讀的字體風格(避免草書、裝飾性字體等)。同時遵循5.3.3、5.3.4、5.3.5，保證字體顏色、字體大小和文本布局的可讀性。支持符合殘障等閱讀障礙人士的閱讀模式（可選）。可操作性用戶界面組件和導航必須可操作。可使用鍵盤操作通過鍵盤可使用所有功能鍵盤操作：所有內容的功能均可通過鍵盤操作。鍵盤交互一致性：如果可以使用鍵盤將焦點移動到頁面的某個組件上，那么只能使用鍵盤將焦點從該組件移開。若需要使用到除方向鍵、Tab焦點狀態：保持始終可見，且在視覺上有明顯不同，遵循“可辨別性”原則。有充足的時間進行閱讀或操作限定的時間可調整：對于有時間限制的內容和操作，需要至少滿足以下一項1)關閉：允許用戶在被限制之前關閉時間限制；調整：允許用戶在被限制之前調整限制時長，調整范圍至少是默認時長的十倍；延長：在到時前警告用戶，并提供至少20秒的時間來通過簡單操作延長時間限制，并且允許用戶至少延時十次；例外情況：時間限制是該事件的必要部分（例如拍賣），并且不存在其他方案；時間限制是該事件的必要部分，延長時間限制會導致活動無效；20小時。用戶可以進行暫停、停止和隱藏的操作：對于移動、閃爍、滾動或自動更新的信息移動、閃爍、滾動：對于任何自動開始、持續時間超過五秒、并且與其他內容并行呈現的移動、閃爍或滾動信息，應提供給用戶可以暫停、停止或隱藏的機制。除非該效果是活動的一部分且是必要的；自動更新：對于任何自動開始并與其他內容并行呈現的自動更新信息，應提供給用戶可以暫停、停止、隱藏或控制更新的頻率的機制。除非自動更新是活動的一部分且是必要的。避免不適的身體反應（可選）避免會造成癲癇或其他不適身體反應的效果設計避免三次閃爍：頁面中不包含在任何一個秒內閃爍超過三次的內容。可導航性為用戶提供可導航、查找內容并可以確定所在位置的方式頁面標題和標簽：網頁具有描述主題的標題或標簽，使用戶理解當前所處位置、當前頁面的意義。b)可跳過重復模塊：用戶可以繞過在網頁上重復出現的內容模塊。例如：在頁面的頂部添加一個鏈接，允許用戶直接跳轉到主要內容區域。焦點順序：若網頁可按順序進行導航，且導航順序影響操作進程，則組件可按順序接收焦點，保持系統的可操作性。鏈接的目的和作用：可以通過鏈接文本，或鏈接所在的上下文確定鏈接的目的和操作意義e)可通過多種方式定位：在一個網站中存在多個網頁，應提供多種方式可以定位到某一個網頁輸入模式通過各種輸入方式使用戶更輕松地操作功能光標操作手勢：所有使用多點或基于路徑手勢進行操作的功能，都可以使用單光標進行操作，而不需要基于手勢。光標操作可取消：對于可以使用光標操作的功能，需滿足以下任一條件1)無按下事件：鼠標按下事件不用于執行任何功能操作2)操作中止或撤消：操作的完成在鼠標抬起事件上，并且在完成之前可以中止操作，或在完成后撤消操作的機制界面中組件文