網頁無障礙的技術方法檢測報告和修改課件

1、網頁無障礙的技術方法：檢測、報告和修改第二部分 2009.10檢測工具類型2檢測工具無障礙工具欄AIS網頁無障礙工具欄是由澳大利亞國家信息和圖書館服務公司（the National Information and Library Services）提供無障礙信息解決方案（ Accessible Information Solutions，AIS）。它可以幫助分析研究無障礙網頁組件，包括結構和可能的色彩問題。具體來說，無障礙工具欄可以幫助無障礙分析人員來評估：圖像替代文本在沒有樣式表的情況下網頁的可讀性表格結構顏色對比率標題結構Javascript 組件表結構Tab鍵控制次序框架標題3檢測工具讀

2、屏軟件 Pocket HAL 7.1 Dolphin Computer JAWS Professional Freedom Scientific Windows Eyes 6.1 GW Micro4檢測工具 Dragon Naturally Speaking語音識別(Preferred 和 Pro) Nuance通常，語音識別是一種利用語音來傳遞的、替代鍵盤命令的輸入方式。 ZoomText 突觸適應性和魔術屏幕放大程序 Freedom Scientific公司產品，可放大并改善屏幕顯示內容 Windows 無障礙工具欄 包括聽寫器、放大器、以及無障礙顯示設置等-微軟Windows 5檢測工具

3、 PowerBraille可更新點字顯示器 Freedom Scientific公司產品: 一個點字顯示器是一種觸覺裝置，由一行特殊的軟單元格組成。一個軟單元格具有6或8個金屬或尼龍針;引腳被電子控制上下移動以顯示在源系統顯示器上出現的字符，通常是一臺計算機或盲文記錄器（Braille note taker）。 手工檢測 - 微軟粘滯鍵、篩選、切換鍵和鼠標鍵無障礙功能選項的手工驗證使用聲音衛(wèi)士（ Sound Sentry ）和顯示聲音無障礙功能選項的語音警報的手工驗證視覺代碼檢查 6檢測工具 肯辛頓軌跡球（ Kensington trackball ） - 肯辛頓 Macromedia Dre

4、amweaver (與無障礙擴展) - Adobe 自制的口操縱桿：四肢癱瘓者可用于按鍵盤上的鍵或電腦屏幕上的鼠標鍵。 頭操縱桿：四肢癱瘓者可用于按鍵盤上的鍵或電腦屏幕上的鼠標鍵。7網頁無障礙檢測的最佳方法8最佳方法，TecAccess方法在建設之初就認真確定范圍是非常關鍵的，但這一點在理解無障礙建設的工作量、要求及成本時經常被忽略。網站或應用程序的規(guī)模大小和復雜性網站或應用程序的內嵌技術是什么？有其它內容需要考慮嗎？你需要哪種技能資源？你需要哪種檢測工具？交付的時間計劃表是什么？員工的可用性？最佳方法，TecAccess方法最初確定范圍時要考慮的問題網站和應用程序的規(guī)模大小和復雜性：問題可以

5、包括網頁 數量、相關網頁的鏈接、內容復雜性、視頻、表格和表單的使用、各種瀏覽器（IE、火狐、Apple Safari、 Google Chrome)最佳方法，TecAccess方法最初確定范圍時要考慮的問題內嵌技術（例如包括Web2.0等）提高了復雜性和風險。用戶使用時無障礙是個易被忽略的典型問題。 社交網絡 博客 RSS（Really Simple Syndication） Wikis 播客 視頻最佳方法，TecAccess方法最初確定范圍時要考慮的問題需要關注的、與網站或應用程序有關的其它內容包括： 幫助文件對于經常忽略在無障礙努力 的用戶起關鍵作用。 PDF文件庫-許多網站都包含歷史記錄

6、、 產品列表，趨勢和分析等豐富的PDF文件。 地圖和圖表最佳范例，TecAccess方法最初確定范圍時要考慮的問題檢測和評估需要考慮哪些技能資源？一旦由資深專家對此作出計劃和確定，檢測的執(zhí)行則可以在認真計劃和確定的前提下依靠較少的技能資源來完成。在這里，使用模板和檢查表是非常有用的。 最佳方法，TecAccess方法最初確定范圍時要考慮的問題檢測和評估需要考慮哪種檢測工具？輔助技術（包括采用殘疾人作為檢測者來確保輔助技術的使用）、各種平臺和瀏覽器。確保測試團隊的所有用戶都能獲得所需的工具和許可(適當的版本)。最佳方法，TecAccess方法最初確定范圍時要考慮的問題認真考慮交付的時間計劃表、員

7、工可用性特別是你們的專家和實驗室的可用性?；卷椖抗芾砹鞒痰氖褂脩撌枪膭畹模踔潦潜匦璧?。最佳方法，TecAccess方法所有測試人員都應該使用“是/不是”來回答，如果可能的話也加上一些詳細報告（例如“替代文本標簽存在，但缺乏實質內容”）如果有多個測試人員，所有的測試結果都必須由一位資深專家進行核對。客觀數據和主觀數據（可用性備注，流量以及用戶反饋尤其是殘疾人提供的反饋）。然后，測試經理可以把結果進行優(yōu)先級排序，以確保反饋是客觀的、可用性、信息全面豐富的、可執(zhí)行的。這樣做將會使檢測報告更加清晰，有助于進行修改，并確保這些事項經得起審核。16最佳方法，TecAccess方法花一些時間在修改之后

8、進行驗證，確?？陀^和主觀無障礙問題都已經得到解決。在TecAccess,我們一直有兩個目標：1) 無障礙合規(guī)符合/不符合2) 可用性/有效性17最佳方法，TecAccess方法符合指導方針或標準并不總能保證輔助技術用戶 無障礙訪問信息。例1： 替代文本：等效描述例2：實施指導方針的方式會極大地影響有效性。例如要求“跳過導航代碼”被添加到頁面底部而不是頂部。這個雖然符合要求，但不是特別有效。1819總結最佳方法包括最初確定范圍時要考慮的問題。在本階段更嚴格地考慮這些問題，在接下來的步驟中就可更容易、更低成本地進行：檢測修改驗證檢測過程中檢查表的使用20制定檢查表無障礙檢查表有助于確定在開發(fā)、檢測

9、、執(zhí)行和維護無障礙產品以及解決方案中所使用的過程。這也有助于記錄項目目的和目標，使目的和目標可以被衡量.首先，列出你的項目目標。為每個項目目標都列出執(zhí)行目標，并簡要描述執(zhí)行目標的衡量方法。制定無障礙檢查表21當你定義目標、目的以及衡量方法時：在計劃階段要與開發(fā)團隊一起合作，確保無障礙首先被考慮在內。從長遠看來這將會節(jié)省時間和金錢。在無障礙需求方面要具體，考慮以下示例：項目目標執(zhí)行目標方法內部應用（附件1 附屬）：(申請普通名稱).(申請普通名稱).以508標準作為依據應審查所有的現有應用程序并且記錄其反傾銷協定限制。 應注明不足之處和修改機構的戰(zhàn)略計劃，以反映修改或更換。以附件1為指南，性能須

10、經由目前的戰(zhàn)略計劃所支配。508標準的成功會議的定義為謹慎地要求所有的新采購先于或作為當前更新周期的一部分，以符合508合規(guī)性。需要硬件或中間件來提出申請介紹給符合508標準的最終用戶的解決方案，對于滿足反傾銷協定合規(guī)的要求是足夠的。所有更換，更新或修繕合同的申請應要求產品在這一領域滿足508標準中規(guī)定的聯邦和各州的普及標準，并且包括任何可能來自國家或機構標準的需求。 所有的車輛采購（招標書，投標邀請，獨資來源等）都應具有如上所述任何中標者的產品必須符合508合規(guī)性的語言。制定無障礙檢查表22確定關鍵成功因素關鍵成功因素（或者成功方法）可能包括：技術要求可用性要求人工代碼檢查輔助技術檢測用戶測

11、試制定無障礙檢查表23將無障礙結合到你的成功因素中，并計劃你將如何具體衡量無障礙。例如，你將會：使用殘疾員工？模擬殘疾測試？使用自動化檢測工具？采用外部的檢測咨詢？制定無障礙檢查表24制定一個無障礙問題解決檢查表，以幫助衡量成功因素。例如，檢測應用軟件的檢查表可能包括以下內容：檢查圖像替代文本。檢查表單和表格，確認標簽的適當使用。檢查色彩的合理使用。檢查所有鏈接是起作用的、有意義的。檢查確保所有的音頻和多媒體元素具有等效的替代文本，且文本是 準確的。檢查時間響應。使用鍵盤導航應用程序檢查圖片閃爍或者轉動圖片。制定無障礙檢查表25重要事件應符合一般產品的要求。通常一個重要里程碑的總結將明確項目進

12、度中關鍵路線上的事件。設備清單: 立即確定步驟：X天正在進行的審查項目完成：X天制定無障礙檢查表26關鍵路徑是確定項目最早完成時間的一系列活動。對于每一個事件，提供預測的完工日期和列出里程碑或事件重要性的簡要說明。 考慮重要事件里程碑或事件項目完成日期重要性設備清單在12個月內提交該計劃1：高 確定目前合規(guī)的級別。27將里程碑事件結合到路線圖中，路線圖可以記錄你的策略并記錄所取得的成果。如果需要，一定要包括修改或改進的里程碑。最重要的是，使用這個路線圖作為項目團隊的溝通工具，并定期更新。制定無障礙檢查表28驗證：要被公布的單個創(chuàng)建文檔職責：單個創(chuàng)建文檔：完成檢查表，驗證合規(guī)在檢查表中填寫網站管

13、理員的（或其他人員）的名字縮寫制定無障礙檢查表29流程. 單個編碼文檔:檢查文檔，確保它是合規(guī)的。如果有問題，讓無障礙團隊評估文件。完成符合具體法律、要求、標準相關的網站無障礙清單請網站管理員審核并開始填寫檢查表。向網站管理員遞交文檔以供發(fā)布。制定無障礙檢查表30檢查及平衡 網站管理員在檢查表已經完整填寫了以后才會簽署檢查表。網站管理員是唯一有權批準例外/豁免的人。網站管理員只能發(fā)布有完整檢查表的一個網頁文件。 如果網站管理員沒有得到完整的檢查表,則應有責任來確保無障礙合規(guī)。已發(fā)布的不合規(guī)文檔必須在一個特定的時間框架內修改，或者必須從網站上刪除。31經驗學習大部分網絡作者不理解無障礙。必須由網

14、站管理員作為這個流程中的聯絡人，確保讓網絡作者履行其職責。要向管理層和網絡作者證明使產品合規(guī)并不是那么困難和費時的。做到這一點最好的方式是通過快速修改一個網站的問題來做出示范。作為一個雙贏的方式來宣傳這一做法。公開表彰表現突出的合規(guī)網址。例如設立一個季度獎,這樣在你的部門中的每個人都能看到它。32經驗學習讓網絡作者簽署文檔來保證合規(guī)，不如在其他地方簽名認證那么有效。大多數的政府部門已經不僅僅只是制定一套網站要求/指南。所有的要求都需要公布出來，這樣網頁作者都會意識到這些要求，而不僅僅是討論一套標準。33從你的無障礙詞典中拿掉“不當負擔”這個詞。拜訪那些有可操作的無障礙項目的組織機構，參考他們的

15、流程。提供持續(xù)數年的培訓。通常人們要到第二年才會相信你對無障礙是認真的。 先實施那些小的、容易合規(guī)化的問題。要讓員工和管理層設定一個期望值，認為無障礙既不難，也不貴。不斷地尋找方法來促進無障礙。常規(guī)提示34制定網頁無障礙計劃，以檢測和修改錯誤35為什么要有一個無障礙執(zhí)行計劃？無障礙項目計劃的制定可以確保項目進行過程中適當的協調，以確保項目目標的實現。36制定你的計劃確定適用標準確定你的需求進行初步檢查確定你的成本編制清單 再利用還是新建？制定你的項目計劃培訓團隊制定測試標準37初步審核：問問你自己.你理解什么是無障礙、無障礙意味著什么嗎？2. 你知道在你們的機構里哪些部門和人員負責無障礙合規(guī)嗎

16、？3. 你的IT經理（部門主管/主任/網站管理員）了解電子及信息技術問題嗎？這些與你的總體無障礙需求是相關的。4. 你們?yōu)榻M織機構內部不了解信息無障礙的人提供培訓和技術支持嗎？對電子信息技術無障礙標準有實用的實施計劃嗎？5. 你已經決定如何評估你的無障礙進展（檢查表、無障礙工具等）嗎？38初步審核定義你的假設要制定一個合乎實際的項目計劃，同時也要考慮意外變數，你必須做一定的假設。這些假設會幫助你定義你的項目范圍。39初步審核定義你的假設假設清單示例：一次更新所有的網絡硬件是不可行的。在硬件更新的過程中，所有不合規(guī)的設備將被替換為合規(guī)的設備，并且是分階段進行，以免擾亂日常的工作流程。在新的wor

17、k-hires趨勢表明前線部門的能力必須是無障礙的，因此無障礙合規(guī)的努力要從前線部門開始，并逐步擴展到內勤部門。 40制定項目描述一旦已經確定了假設并明確了項目，就需要制定一個項目描述。該項目描述可能包括下列因素：確定員工開展工作所必須的硬件或軟件組件，確認為什么需要進行不同的修改以便于殘疾員工、老年員工或能力受限的員工能夠與沒有殘疾的員工一樣獲得平等的工作能力。在可能或需要的情況下，確認硬件/軟件的改進建議，以使單個硬件組件合規(guī)。41制定計劃確定以及記載項目描述的理想方式首先是：確定技術和無障礙需求確定開發(fā)團隊的需求，包括：培訓要求獲得輔助技術獲得領域專家或外部顧問的幫助42制定計劃不要忘記

18、考慮以下幾點：哪個產品更可能需要無障礙處理什么時候需要對無障礙進行例外處理，例如：“內勤部門”例外基本變更不當負擔商業(yè)上不提供現有產品保存期限用戶類型（終端用戶vs.系統管理員）43制定計劃總結項目范圍如果你的假設是可靠的、項目的描述是合理的，那么在你的項目范圍定義就有一個比較好的基礎。44制定計劃 在你定義項目范圍時，你可能需要重新審視你的假設，或增加新的假設。 例如，你會不會使用分階段做法 如果這樣的話，有哪些或什么樣的中期解決方案45制定計劃制定一個階段性實現策略制定合乎實際的時間表考慮預算周期根據不同的項目，要考慮其他因素包括：制定內部無障礙指導方針/無障礙的最好做法。確定用于開發(fā)、測

19、試、實施和維護無障礙產品和解決方案的流程。46制定內部指導方針制定內部指導方針內容制作，軟件和操作系統導航替代文本無障礙的在線幫助和安裝使用說明47制定內部指導方針內容制作，軟件和操作系統導航替代文本無障礙的在線幫助和安裝使用說明大多數軟件方面的要求都和視障人士的可用性有關。例如，一個規(guī)定要求替代鍵盤導航，這對無法依靠指點設備（例如鼠標）的視覺障礙人士來說是很重要的。其它規(guī)定涉及到動畫顯示、顏色和對比率設置，閃光頻率和電子表格等等。制定內部指導方針48制定內部指導方針內容制作，軟件和操作系統導航替代文本無障礙的在線幫助和安裝使用說明導航元素應該安放一致。應該提供替代擊鍵設備。制定內部指導方針4

20、9制定內部指導方針內容制作，軟件和操作系統導航替代文本無障礙的在線幫助和安裝使用說明所有非文本元素（圖像，flash元素或視頻）都應該有替代文本，用來為那些不能看見內容的人描述圖片。開發(fā)者應該確保：所有圖像都有alt屬性或alt標簽；文本描述傳達的信息與相應的圖像傳遞的信息相同； 所有多媒體圖片、電影、聲音和小應用程序都有alt標簽或以無障礙形式呈現。制定內部指導方針50制定內部指導方針內容制作，軟件和操作系統導航替代文本無障礙的在線幫助和安裝使用說明無障礙的在線幫助和安裝使用說明應該：易于訪問易于導航易于搜索可以打印制定內部指導方針51制定計劃制定硬件和其他設備的指南. 例如: 電信語音郵件

21、、短信、自動接聽和交互式語音應答通信系統需要用戶在一定時間間隔內作出反應，應該在時間即將結束時發(fā)出警報，并且為用戶提供足夠的時間來表明他們需要更多的時間。這項規(guī)定用于滿足人們的需要，比如那些在認知上或靈活性上有障礙的人，他們需要額外的時間來對交互式語音應答通信系統作出反應，以避免被過早掛斷。不對具體警報的的聲音如何或需要多少額外時間作出具體規(guī)定，因為這些因素是在變化的。52 制定計劃把遵守指導方針作為項目范圍的一部分 例如會不會需要更多的時間、更多的專門知識？有沒有其他方面的考慮？ 53制定計劃無障礙檢測檢測應該包括在項目范圍內考慮下列方式：內部技術檢測手工代碼檢查由健全用戶以及殘疾用戶來檢測

22、 確定你在時間和資源方面采取了適當的調整措施，以保證測試正確進行。54確定最好做法W3C網頁內容無障礙指南1.0/2.0替代文本指導方針提供無障礙的、對用戶友好的在線幫助 制定無障礙及可用性的檢測策略確保有關如何訪問以及使用該課程的所有說明是無障礙的55確定你的成本開發(fā)者和測試者培訓費用輔助技術購買可用性測試咨詢費用產品重新設計還是新產品開發(fā)56產品重新設計vs.新產品開發(fā)現有的內容 修改還是或開發(fā)新內容？可以考慮的其他策略： 轉錄文本 純文字版本 什么也不做57常見的障礙問題圖片沒有替代文本復雜的圖像或視頻沒有適當設計的轉錄文本 表格不能準確地閱讀框架是無意義的表單的標簽設置或導航較差頁面的

23、字體大小固定，不能容易地被更改音頻/視頻元素缺少字幕58開發(fā)無障礙網頁的規(guī)則為所有圖片提供替代文本使含義不依賴于色彩確定語言變化獨立制作層疊樣式表頁面為動態(tài)內容更新替代形式為服務器端圖像映射圖提供冗余文本鏈接59開發(fā)無障礙網頁的規(guī)則盡可能的使用客戶端圖像映射圖在數據表中放入行和標題將所有數據單元與標題單元結合起來給所有框架加上標題制作獨立的腳本站點同步多媒體替代形式提供一個跳過重復鏈接的選項 來源公用設施管理60制作替代文本簡短的替代文本50個字符或5個字詞或者更少長的替代文本（ longdesc屬性）或者D-LINK (外部鏈接到一個長介紹） 轉錄文本無意義的圖像或圖像ALT屬性為無值61替

24、代文本要考慮：避免縮寫和縮略詞避免在圖像中嵌入文本注意使用標點符號（測試）為小圖片提供適當的文本， 例如項目符號、標志、導航按鈕建立一個替代文本樣式指南 62導航用一致的用戶界面（UI）來設計頁面當頁面被載入時即確認頁面名稱將滾動的需要減到最少當提供選項時將選項放在同一相鄰區(qū)域63提高有效性你可以提高基于web和非web技術的有效性： 無障礙的在線幫助圖片的替代文本正確地顏色和對比率無障礙的、一致的導航提供交互式元素增加工具提示提供思維導圖為音頻/視頻材料添加封閉式字幕64無障礙在線幫助桌面在線幫助 易于訪問易于導航易于搜索可以打印 65圖像 需要回答的問題所有的圖像都有Alt標簽或Alt屬性

25、嗎？文本描述所傳遞的信息是否與圖片傳遞的信息相同？3. 圖片、電影、聲音以及小應用程序有Alt 標簽嗎？66為圖片提供替代文本Image: Five young professionals of different race and gender, with the caption Diversity: Many forms67使用適當的顏色和對比率Note: One out of every ten American men is colorblind!68顏色 需要回答的問題使用的顏色是用于強調文字、按鈕或任務的一個獨特標記嗎？ 2.文本有不適當的背景顏色或圖案對比率嗎？69舉例.該設備上

26、有個綠色的“ON”按鈕。確定“ON” 按鈕。相互作用色盲很常見。不要忘記各種形式所產生的局限性。例如，一個并未完全失明或失聰或喪失行動能力的人也會需要無障礙輔助。 70在交互時使用工具提示 工具提示71使用思維導圖（Mind Map）思維導圖提供關于頁面設置、如何導航、如何用快捷方式啟動的文檔72音頻和多媒體 需要回答的問題多媒體內容的轉錄文本和描述之間有區(qū)別嗎？字幕（封閉式或者開放式）轉錄文本73視頻 要回答的問題描述總結是：視覺信息包含動作設置狀況字符74無障礙檢測檢測你的產品所支持的所有標準配置對編碼和用戶界面執(zhí)行檢查用輔助技術進行檢查 讀屏軟件、屏幕放大器、語音識別使用自動工具來幫助查

27、找和修改無障礙錯誤 (例如: 508法案和WAI violations)5. 招募殘疾人作為測試人員 沒有比讓真正殘疾的人來驗證可用性更好的檢測辦法了75創(chuàng)建網頁無障礙檢測報告76網頁無障礙檢測、報告、修改The TecAccess Web Accessibility Testing Process修改錯誤 制定檢測策略及計劃實施檢測創(chuàng)建網頁無障礙報告驗證合規(guī)本階段：記錄你的調查結果！TecAccess 網頁無障礙檢測流程77網頁無障礙檢測、報告、修改創(chuàng)建一個有效的網頁無障礙報告一個好的網頁無障礙報告應該:確定用于檢測的無障礙標準/指導方針對于技術人員和管理人員都提供了豐富的信息逐條說明不符合

28、無障礙標準的缺陷，以及在測試中 發(fā)現的一般無障礙和可用性問題具有可行性，對修改提出具體的建議78網頁無障礙檢測、報告、修改創(chuàng)建一個有效的網頁無障礙報告一個好的網頁無障礙報告確定檢測標準:清楚說明在綜合檢測中所使用的具體的網頁無障礙標準或指南如果適用的話，確定具體的合規(guī)等級例： WCAG2.0 合規(guī)等級AA；中國無障礙上網技術要求等級XYZ79網頁無障礙檢測、報告、修改創(chuàng)建一個有效的網頁無障礙報告一個好的網頁無障礙報告包含豐富的信息:描述檢測對象：具體的網站網址、應用把重要信息放在報告前面 檢測結果概述總結調查結果：無障礙合規(guī)狀態(tài)即：網站具有主要幾個無障礙合規(guī)問題；網站基本符合網頁無障礙指南,只

29、需做少量修改即可達到100%合規(guī)并可被常見輔助技術的用戶完全無障礙地訪問。80網頁無障礙檢測、報告、修改創(chuàng)建一個有效的網頁無障礙報告一個好的網頁無障礙報告會逐條說明合規(guī)缺陷:描述在檢測中最常遇到的合規(guī)缺陷的類型即：大部分圖片的替代文本較差或根本沒有替代文本援引無障礙指南來說明合規(guī)缺陷，重申每一條指南內容！81網頁無障礙檢測、報告、修改創(chuàng)建一個有效的網頁無障礙報告一個好的網頁無障礙報告從測試者中獲取可用性問題和導航觀察: 執(zhí)行測試的人工測試者有機會觀察多個網站上的可用性特征及技術應該鼓勵測試者自由評注與網站可用性有關的意見和建議用與獲取測試數據（紙質表格、在線表格、數據庫等）相同的方法來獲取原始

30、的可用性和導航觀察82網頁無障礙檢測、報告、修改創(chuàng)建一個有效的網頁無障礙報告一個好的網頁無障礙報告是可行的!獲取最高級別的檢測信息，并輔以具體的測試結果，旨在幫助讀者理解報告中的合規(guī)缺陷可作為截至某個特定網站版本或日期的“無障礙標準/指南合規(guī)現狀”正式記錄 既提供無障礙合規(guī)缺陷，也提供修改這些合規(guī)缺陷的具體建議83網頁無障礙檢測、報告、修改創(chuàng)建一個有效的網頁無障礙報告資源：中國殘疾人聯合會網站的網頁無障礙評估報告樣本中國無障礙上網技術要求84概述使用網頁無障礙報告來：確定檢測目標獲取檢測準則描述最概要的調查結果細化描述具體的合規(guī)缺陷記錄修改建議85答疑86親身實踐87評估網頁無障礙合規(guī)的簡單技術提示 88進