基于WCAG2.1的直轄市學分銀行網站可訪問性研究

于蓓莉 門正興 徐亮 龔宏 張小霞

（成都航空職業技術學院 四川省成都市 610010）

1 引言

構建學分銀行是建設終身教育體系和學習型社會的需要。國家和各級政府長期教育改革和發展規劃綱要都要求建立“學分銀行”制度，搭建終身學習“立交橋”，建設終身教育體系和學習型社會。[1]構建學分銀行是滿足國民多元化學習和發展的需要。國家層面、省級層面、市級層面分別建設了“學分銀行”網站，以供學習者使用[2]。

在網站開發中，公認三大要求為：可用性、可訪問性和可維護性。創建一個易于訪問的網站首先確保網站的可訪問。可訪問性是指“網站能夠被任何人、通過任何瀏覽技術進行同等訪問，以獲取網站內包含的所有信息和功能，并于網站進行完全交互的能力的一種特性。”[3]“網站的可訪問性不僅關系到普通用戶對網頁內容的理解，更關系到殘障用戶是否能夠無障礙地獲取網絡信息，享受在線服務。可訪問性對網站來說尤其重要。”[4]

目前國內學術界對直轄市級別學分銀行網站的可訪問性研究還處于空白階段。本文以四個直轄市級的學分銀行網站為研究對象，對其可訪問性進行實證研究。

2 調查對象及標準

2.1 調查對象

目前，四個直轄市分別建立了面向轄區內市民的學分銀行網站并投入使用，他們分別為北京市學分銀行（http://bjcb.org.cn/）、天津終身學習網（http://www.tjedu.cn）、上海市終身教育學分銀行（http://www.shcb.org.cn/）、重慶終身學習學分銀行（http://credit.cqdd.cq.cn/）。

2.2 調查標準

網站可訪問性的評價標準較多，比如德國（BITV 系列標準）、日本（JIS 標準）、美國（508 條例）、意大利（訪問標準）、中國（《網站設計無障礙技術要求》）。本次調查采用的標準為萬維網聯盟W3C 標準，該標準獲得國際一直認可并影響深遠，目前發展為三個版本。版本分別為1995年制定的《網頁內容可訪問性指南》被稱為WCAG1.0，制定了網站可訪問性評判標準。其涵蓋14 條指導項和65 個點，得到世界各國的認可。伴隨著新技術的出現2008年W3C 于該標準的升級版WCAG2.0，2018年更新為WCAG2.1，該標準依據分級設置差異化的判定標準，分別為A、AA、AAA，其中A 標準為基本標準，是可訪問性的基本標準，AA、AAA 是較高級別評價標準。[5]

2.3 調查工具和測評過程

（1）調查工具采用目前國內外測評可信度較高的PoweMapper為測評工具；

（2）測試過程：登陸四個直轄市的學分銀行門戶網站，搜集門戶網站的網絡地址；利用PoweMapper平臺調用WCAG2.1（LEVEL AA 和LEVEL A）標準測評；

（3）測評時間：2021年7月16-21日；

（4）統計分析數據，收集整理四個直轄市門戶網站的可訪問性報告。基于報告數據和反饋意見進行歸納和分析。為了保證樣本的可靠性，筆者預先對四個直轄市樣本網站進行預檢測。從預檢測結果看，出現的錯誤數LEVEL A 標準低于LEVEL AA，鑒于大部分研究者對網站的測評均采用LEVEL A 標準，因此本文擬采用LEVEL A 標準檢測檢索結果進行分析。

3 結果分析

學分銀行承擔著其轄區內所有市民終身學習的保障任務，每個用戶是否能公平、平等地利用網絡對網站進行利用，主要取決于網站的可訪問性。分析其已知的可訪問性問題，可以提高其門戶網站的可訪問性水平，促進用戶公平、平等地利用、轉換學習資源。從調查的結果可以看出，測評的結果不理想。

3.1 門戶網站首頁布局問題

布局風格導致出現錯誤數存在一定的差異。可訪問性較差的網站頁面上承載大量的圖片和動畫，無法突出圖書館網頁的主要功能和服務項目。大量的圖片和列表導致部分功能的可訪問性受到限制，增加訪問者的訪問難度。

通過網絡調查得出四個直轄市網頁的布局大致可以分為兩類，國字型和封面海報型。其中北京、重慶網站屬于國字型。此種類型的主要特點為的圖書館網站承載較多內容。大致結構為頁面的最上面是圖標、新聞，內容的展示以列表為主，左右分別羅列。頁面的最底端為版權聲明、聯系方式等。這也一定程度上導致出現的錯誤數較多。上海、天津市學分銀行主頁面采用封面海報型布局結構，大致結構為頁面上方主要為檢索欄或鏈接，頁面下方主要分布圖書館的服務項目和圖片。簡單的布局保證出現錯誤數較少。

3.2 門戶網站已知錯誤類型分布

如表1所示，通過匯總表可看出，測評出來的主要問題集中在，“網頁默認語言可用程序確定”、“為任何非文本內容提供替代品”。其他問題頻次較高依次為“展現的信息、結果和關系可被軟件識別或可用文本表達”、“每個鏈接的目的課通過鏈接文本確定”、“網頁提供描述其主體或目的的標題”、“每個鏈接的目的課通過鏈接文本確定”，“標記語言使用規范”、“顏色并不是作為傳達信息、表明動作、引起反應或區分視覺元素的唯一視覺手段”較為分散。

表1：四個直轄市學分銀行網站可訪問性測評基于LEVELA

3.3 門戶網站文檔可讀性問題

已知錯誤類型中占據第一位為 “網頁默認的語言可用程序確定”問題，其錯誤主要表現為表現文檔語言未被識別，文檔的語言代碼無效。原因為文檔未添加lang 屬性和xmllang 屬性。此類問題只要在設計時候，對相關文檔的根元素中設置符合ISO-639-1 的雙字母語言代碼到opening html 元素中即可解決。比如針對html 類型文檔設置lang 屬性，對xhtml 文檔設置lang 和 xmllang 屬性即可解決。

3.4 門戶網站圖片、動畫問題

在已知錯誤中出現頻率第二位的“為任何非文本內容提供替代品”，其錯誤主要表現為圖片、動畫等非文本內容缺乏相應的屬性。設計網站時，工作人員未對非文本的圖片等內容進行設計，比如圖片、動畫首先應該選擇可以實現文字解釋類的圖片和動畫類型，再勾選alt 屬性進行文字解釋。功能性圖片和動畫應該考慮顏色對比等，將相關的可訪問性標準在具體的設計中加以實現。

3.5 其他問題歸納

除了上述幾種問題外，其他問題歸納如下：在1.3.1 條款中出現的主要問題為Input 元素，缺少相關的label 標簽。通過設置label標簽即可。在2.1.1 條款中“內容的所有功能都可通過鍵盤接口實現操作”出現的主要問題為“未向腳本添加處理程序”，通過向腳本添加onblur 處理程序，亦可解決類似問題。其他問題諸如文檔使用語言、文本指示性信息等，均可在設計時通過已有的技術進行設置。

4 學分銀行門戶網站建設建議

4.1 改進學分銀行門戶網站的設計

作為信息門戶，學分銀行網站應該設置檢索服務，幫助使用者檢索資源。在交互功能方面，四個直轄市學分銀行網站均進行設置。網站在設計時首先應該保障這些基本功能的前提下，注重網站設計的簡潔性與實用性，首頁不應承載過多欄目。門戶網站首先應該確保布局清晰簡單，混亂的布局會加重用戶的認知負擔，界面必須能夠對功能組件的尺寸進行調整，因此響應式布局至關重要。此外還應該保證有清晰的路徑指示器和簡單的任務流程可以實現順暢的導航。

4.2 加強可訪問性建設意識及人員培訓

從上述的檢測結果分析可看出，目前基于WCAG2.1 的標準下出現的可訪問性標準出現的主要問題均可通過開發人員的建設過程中重視并利用一定的信息技術即可解決。這表明在開發網頁時，開放人員缺乏可訪問性建設的相關意識。急需對開發人員進行相關知識的普及和技術培訓。

4.3 定期對網站進行可訪問性檢測

在網站運行過程中，應定期利用相關標準進行檢測，以保障其可訪問性。應以制度的形式對可訪問性檢測的手段和時間進行界定。為保障各類用戶利用任何設備都能夠有效地訪問圖書館網站，應該在制度中對可訪問性的標準進行界定。此外，網站維護人員在日常任何時間對圖書館進行維護和更新后，都應對學分銀行網站的可訪問性進行檢測，以保證其正常運行。

4.4 設置輔助工具，增強網站的可訪問性

通過網絡調查四個直轄市，均未設置無障礙訪問工具。為保障每個公民平等公平、平等地利用網絡對教育資源進行利，作為信息門戶應當適當增加一些無障礙訪問輔助工具。網站通過設立一些小程序或增加輔助功能對有訪問有障礙的用戶進行輔助訪問。比如為視障用戶提供的可為其朗讀的輔助工具或提供音頻資源，用戶必須能夠暫停/停止、他，調整音量以及控制字幕等。此外還需要考慮那些無法使用鼠標和行動不便的群體可以通過鍵盤進行導航，例如使用各種按鈕，包括箭頭、空格鍵、回車鍵等。