Web 2.0應(yīng)用程序最佳實(shí)踐
隨著Web 2.0的日漸普及，Web 2.0應(yīng)用程序的可訪問性對開發(fā)者提出了越來越高的要求，應(yīng)用程序可訪問性是指為殘障人士掃除使用障礙。在使用電腦時(shí)，有些用戶也許無法看見或無法移動(dòng)鼠標(biāo)，或者會(huì)面臨很多其他困難。
IBM在產(chǎn)品的可訪問性方面有著悠久的歷史；讓應(yīng)用程序能夠被最廣泛的客戶群使用具有良好的商業(yè)意義。因此，IBM承諾將支持世界級(jí)規(guī)范和標(biāo)準(zhǔn)的技術(shù)帶給殘障人士。
附加測試，也稱為可訪問性驗(yàn)證測試（AccessibilityVerificationTesting，下文簡稱為AVT），被用于確保產(chǎn)品符合這些可訪問性標(biāo)準(zhǔn)。AVTChecklist是一個(gè)檢查點(diǎn)列表，支持可訪問性的產(chǎn)品需要遵守這個(gè)列表。該列表是根據(jù)世界級(jí)可訪問性標(biāo)準(zhǔn)生成的，如USsection508和W3CWebContentAccessibilityGuidelines（下文簡稱WCAG）。在本文中，我們將通過一些簡單的例子來解釋檢查列表中一些基本的、重要的項(xiàng)目。我們將分享如何對一個(gè)Web 2.0產(chǎn)品規(guī)劃和執(zhí)行AVT的最佳實(shí)踐。
背景
WAI-ARIA（下文簡稱ARIA），即AccessibleRichInternetApplicationsSuite，開發(fā)出一種方式使網(wǎng)絡(luò)內(nèi)容更易于殘障人士訪問。它讓AsynchronousJavaScript+XML(Ajax)、JavaScript或其它技術(shù)開發(fā)出的動(dòng)態(tài)內(nèi)容尤其易于使用。特別是，WAI-ARIA提供了一個(gè)框架用于添加屬性來識(shí)別用戶交互的特點(diǎn)、它們互相如何關(guān)聯(lián)以及它們的當(dāng)前狀態(tài)。在以下的例子中，您將看到，大多數(shù)屬性是特定于WAI-ARIA的。
關(guān)于AVT的例子及信息都基于我們對Web 2.0應(yīng)用程序的測試，支持Firefox3瀏覽器和JAWS10，因?yàn)橛行傩?，例如WAI-ARIA標(biāo)記，只有使用特定的組件組合才能看到。
可訪問性檢查列表的關(guān)鍵要素
那么，究竟哪些技術(shù)被認(rèn)為是與可訪問性相關(guān)的技術(shù)？可訪問性檢查列表有幾條關(guān)鍵原則：
◆輸入方式可選擇：鍵盤、鼠標(biāo)、語音，以及用于殘障人士的設(shè)備；
◆輸出方式可選擇：顯示、聲音、打印，以及將圖像提示轉(zhuǎn)換成聲音的用戶界面元素；
◆一致性和靈活性：與顏色、字體等用戶設(shè)置保持一致。
這些原則是可訪問性檢查列表的基礎(chǔ)。在本文中，我們將重點(diǎn)放在Web 2.0應(yīng)用程序的可訪問性，因此我們討論Web應(yīng)用程序檢查列表。Web應(yīng)用程序應(yīng)該符合檢查列表以便殘障人士能夠使用。這些例子將包含一些基本的要點(diǎn)以及經(jīng)常出現(xiàn)問題的方面。
1.替換文本：所有非文本內(nèi)容均應(yīng)有對應(yīng)的文本內(nèi)容
有些瀏覽器不支持圖片，因此一些視力受損的用戶看不到圖片。因而為所有的圖片提供替代文本就尤為重要，這能使所有用戶都了解其信息。有了替代文本后，屏幕閱讀器之類的輔助技術(shù)就可以以另一種方式傳達(dá)圖片的內(nèi)容，根據(jù)WCAGSC1.1.1指南描述，所有非文本內(nèi)容都應(yīng)有alt文本屬性。冗余的圖片可將alt值設(shè)置為空，但有意義的圖片應(yīng)用有意義的語句設(shè)置。替代文本應(yīng)當(dāng)準(zhǔn)確、簡明。如下所示：
圖1.非功能圖片
1.1 非功能圖片的alt內(nèi)容為空
圖1顯示的是優(yōu)先級(jí)設(shè)置。在詞語“高優(yōu)先級(jí)”和“中等優(yōu)先級(jí)”前的紅色和綠色標(biāo)志圖標(biāo)，其實(shí)與詞語意思相同，因此這些圖標(biāo)就是非功能性的或者說是冗余的。如檢查列表1.1指出的，您應(yīng)當(dāng)將圖標(biāo)的alt屬性設(shè)為空值。清單1顯示了相應(yīng)的HTML代碼。
清單1.非功能圖片的代碼
- <imgclassimgclass="lconnSpritelconnSprite-iconPriorityMedium16"
- alt=""src="/activities/javascript/dojo-ibm/dojo/resources/blank.gif"/>
1.2 功能性/重要圖片的alt包含有意義的內(nèi)容
圖2顯示的是用戶的信息卡。卡上的照片是重要的圖片，因此其alt屬性應(yīng)包含有意義的描述。清單2顯示的是HTML代碼。
圖2.重要的圖片
清單2.功能圖片的代碼示例
- <imgheightimgheight="35"width="35"alt="Profilephoto" src="http://lc40.cn.ibm.com:9082/profiles/photo.do?userid=
- CFDFB8C1-7082-428F-97EF-9E274BDE3F68"/>
圖3是另一個(gè)關(guān)于功能圖片的例子。“myactivity”前面的閃電圖標(biāo)代表活動(dòng)的優(yōu)先級(jí)，它旁邊沒有文字描述，因此alt屬性應(yīng)被設(shè)為有意義的文字以告訴用戶該圖片的作用。
圖3.功能圖片
清單3.另一個(gè)功能圖片的代碼示例
- <imgclassimgclass="lconnSpritelconnSprite-iconActivities16"dojoattachpoint="icon_AP"
- src="/activities/javascript/dojo-ibm/dojo/resources/blank.gif"
- alt="NormalPriority(Default)"/>
1.3 對于多媒體應(yīng)使用文字記錄描述其內(nèi)容
圖4是視頻文字記錄的例子。Web 2.0應(yīng)用程序通常都會(huì)提供多媒體內(nèi)容，有些甚至可以與用戶交互。視力受損的用戶感覺不到這些信息，因此，應(yīng)該有代替的方法能使殘障用戶了解其內(nèi)容。在圖4中，內(nèi)容下方有文字記錄鏈接，用戶可以通過閱讀文字記錄了解視頻信息。
圖4.多媒體的文字記錄 #p#
2.適應(yīng)性
通過UI呈現(xiàn)給用戶的網(wǎng)站結(jié)構(gòu)應(yīng)該有一套替代方法來滿足盲人用戶的需求，通過UI展現(xiàn)給用戶的信息、結(jié)構(gòu)和元素關(guān)系應(yīng)該能由程序控制或有替代文本。以下兩個(gè)例子描述了確認(rèn)UI上的表單之間的關(guān)系的方法。
2.1 如果一個(gè)表單旁邊有標(biāo)簽，可以使用“for”來確定標(biāo)簽和表單間的關(guān)系
本例子可用于大多數(shù)典型的表單結(jié)構(gòu)，即每個(gè)條目字段旁都有標(biāo)簽。使用與相關(guān)數(shù)據(jù)條目元素的id屬性相匹配的值為標(biāo)簽添加for屬性。如果for屬性未設(shè)置，僅當(dāng)焦點(diǎn)位于輸入表單時(shí)，用戶才會(huì)聽到“編輯器”。然而，如果為標(biāo)簽設(shè)置了for屬性，用戶將會(huì)聽到“用戶名列編輯器”。這能幫助用戶明確表單的用處和應(yīng)該輸入什么。清單4是這些標(biāo)簽的代碼。
圖5.表單旁邊有一個(gè)標(biāo)簽
清單4.表單中“for”參數(shù)的用法
- <div>
- <labelforlabelfor="user">Username:</label>
- <inputidinputid="user"class="lotusText"type="text"name="j_username"/>
- </rdiv><div>
- <labelforlabelfor="password">Password:</label><inputidinputid="password"
- class="lotusText"type="password"name="j_password"/>
- </div>
2.2 如果一個(gè)表單沒有標(biāo)簽，則為“title”、“aria_title”或“aria_labelledby”設(shè)置參數(shù)。
圖6.表單的數(shù)據(jù)輸入字段旁沒有標(biāo)簽
圖6顯示了一個(gè)表單，稱為“AddRelatedActivity”。數(shù)據(jù)輸入字段旁沒有標(biāo)簽，但有一段長描述，因此應(yīng)當(dāng)為此表單設(shè)置title屬性。
清單5.使用“title”屬性
- <selecttitleselecttitle="AddRelatedActivity"style="width:530px;"size="5"
- name="target"dojoattachpoint="targetSelect_AP"/>
此外，設(shè)置另外兩個(gè)屬性也可以達(dá)到同樣效果：aria_title和aria_labelledby?？梢酝ㄟ^WAI-ARIA技術(shù)來使用這兩個(gè)屬性，我們將在本文中稍后討論。
3.顏色
顏色是用戶界面中一個(gè)重要的元素。有時(shí)，你寧愿使用顏色而不是意思相同的文字來表示某些功能性含義。這就違反了WCAGSC1.4.1，它指出顏色只能用于裝飾；功能性含義不能只用顏色標(biāo)記。以下兩個(gè)例子就指出并解決了違反顏色相關(guān)規(guī)定的情況。
圖7和8顯示了一個(gè)此類違背的例子并提供了一個(gè)可行的解決方案。如果用顏色來表示特定的含義，視力受損的用戶或使用高對比模式系統(tǒng)的用戶就無法了解只通過顏色傳達(dá)的信息。圖7中的第一個(gè)例子顯示了一個(gè)高對比屏幕，所有條目的顏色都消失了。因此用戶無法看到條目間的區(qū)別。圖8顯示了一個(gè)解決方案，只需添加一些簡單的有意義的文字，如[RequiringApproval]或[Draft]，就可以區(qū)分不同類型的條目。
圖7.顏色的不合理使用
圖8.顏色的合理使用
圖9顯示的是另一個(gè)顏色可用性的問題。普通模式下，選項(xiàng)卡活動(dòng)時(shí)會(huì)高亮顯示，但如果系統(tǒng)設(shè)置為高對比模式，則無法確定哪個(gè)選項(xiàng)卡頁是活動(dòng)的。解決方法是在每個(gè)選項(xiàng)卡頁上加上選項(xiàng)卡名稱。這樣，當(dāng)用戶進(jìn)入某頁時(shí)，就能知道該頁是活動(dòng)的。
圖9.高對比模式下的顏色問題 #p#
4.鍵盤
鍵盤也是處理可訪問性問題時(shí)應(yīng)關(guān)注的另一領(lǐng)域。
4.1 所有功能都能用鍵盤訪問
WCAGSC2.1.1指出用戶應(yīng)當(dāng)能用鍵盤導(dǎo)航到所有內(nèi)容和功能，圖10顯示了一個(gè)關(guān)于鍵盤問題的例子。如果鼠標(biāo)移動(dòng)到用戶名處，下方將會(huì)彈出一張卡片。用戶單擊彈出信息將打開整個(gè)名片。這整個(gè)操作過程都應(yīng)當(dāng)有為鍵盤用戶設(shè)計(jì)的替代方法。這種情況下，快捷鍵就是一個(gè)不錯(cuò)的選擇。例如，按下Ctrl+Enter將打開用戶的名片。
圖10.打開彈出信息時(shí)的鍵盤問題
圖11顯示了另一項(xiàng)復(fù)雜的操作，即拖放功能，這是Web 2.0應(yīng)用程序中的常見特性，允許用戶在UI上動(dòng)態(tài)拖拽小部件。這項(xiàng)功能很難用鍵盤模擬，因此應(yīng)該用其他方法實(shí)現(xiàn)。UI中的另一個(gè)明顯的功能是向用戶展示向哪里移動(dòng)小部件。
圖11.關(guān)于拖放功能的鍵盤問題
4.2不應(yīng)有鍵盤陷阱：焦點(diǎn)可以進(jìn)入和退出當(dāng)前的UI
當(dāng)用戶在當(dāng)前窗口之上再打開一個(gè)新窗口時(shí)，可能會(huì)對焦點(diǎn)變化感到疑惑。WCAGSC2.1.1指出不應(yīng)有鍵盤陷阱。如果打開一個(gè)新窗口，焦點(diǎn)應(yīng)當(dāng)移到新打開窗口的第一個(gè)可編輯元素中，并且應(yīng)該能通過關(guān)閉或按下鍵盤ESC鍵的方法來退出新打開的窗口。
圖12顯示的是UI中彈出新窗口的例子。當(dāng)用戶展開MoreActions按鈕并單擊ImportBookmarks時(shí)，屏幕顯示焦點(diǎn)仍在MoreActions按鈕上而不是移到新窗口中。這就是一個(gè)鍵盤陷阱，因?yàn)橛脩魺o法只用鍵盤就將焦點(diǎn)移到新窗口中。鍵盤導(dǎo)航仍停留在原窗口中。這種情況下，應(yīng)當(dāng)添加一些代碼來專門將光標(biāo)移到新打開窗口的第一個(gè)可編輯對象上。
圖12.焦點(diǎn)的鍵盤問題
圖13顯示的是另一個(gè)鍵盤陷阱問題。單擊Prioritize按鈕后，彈出一個(gè)下拉列表。如果用戶不想選擇任何項(xiàng)，只是退出列表，那么他們不管按下什么鍵都無法做到。這是一個(gè)鍵盤陷阱。應(yīng)該有退出的方法，如按ESC鍵。
圖13.下拉列表的鍵盤陷阱
5.高對比模式
高對比（下文簡稱HC）模式是一種特別的顯示模式。在HC模式下，所有背景設(shè)置無效，包括圖片和顏色。因此，應(yīng)用程序中應(yīng)有專門的代碼處理HC模式。
圖14顯示的是關(guān)于該檢查點(diǎn)的例子。每條用戶記錄都有一個(gè)按鈕來讀出名字。但圖片是背景圖，在HC模式下不會(huì)顯示在UI中。在圖14中，我們用替代文字來表示圖標(biāo)。清單6顯示了如何通過第7行中的<span>指令來用span設(shè)置替代文字。
圖14.高對比模式下的背景圖
清單6.為HC用戶生成替代文字
- <atitleatitle="Playanaudiofilewiththepronunciationoftheperson'sname"
- id="pronunciation"
- href="/profiles/audio.do?key=4815d70b-680d-4bfb-ba05-f32ccedbbcb5
- &lastMod=1248147056328">
- <imgsrcimgsrc="/profiles/nav/common/styles/images/blank.gif"class="lconnSprite
- lconnSprite-iconAudio16"/>
- <spanclassspanclass="lotusAltText">Pronunciation</span>
- </a>
6.其它問題
還有其他一些影響使用性的情形，它們不包含在以上類別中。本節(jié)將介紹這些情形。
6.1定時(shí)調(diào)整
WCAGSC2.2.1指出應(yīng)用程序中不應(yīng)有無法禁用或調(diào)整的時(shí)間限制。圖15顯示的是該檢查點(diǎn)的例子。錯(cuò)誤消息將在約5秒鐘后消失，而用戶無法禁用這個(gè)有關(guān)時(shí)間限制的配置。這對于殘障人士是無法接受的，尤其是視力受損用戶。解決方法是禁用時(shí)間限制或僅彈出一個(gè)錯(cuò)誤消息即可。
圖15.具有定時(shí)調(diào)整的消息
6.2導(dǎo)航特性
WCAGSC2.4.1指出所有UI都應(yīng)有導(dǎo)航特性以幫助用戶將焦點(diǎn)移到合適的位置，例如在包含空白圖片的UI頂部使用“Skiptomaincontent”標(biāo)記。當(dāng)然，一個(gè)產(chǎn)品的所有用戶界面都應(yīng)有導(dǎo)航特性。清單7顯示了該檢查點(diǎn)。有三個(gè)標(biāo)識(shí)供用戶跳過他們不想聽到的內(nèi)容。
清單7.提供方法使用戶跳過不希望聽到的內(nèi)容
- <!--ThefollowinglinesarerequiredforAccessibilityandareusedbyscreenreaders.
- Pleasedonotremove-->
- <ahrefahref="#mainContent"id="lotusAccessLinkMainContent"accesskey="S"
- class="lotusAccess">
- <imgsrcimgsrc="/activities/nav/common/styles/images/blank.gif"
- alt="Skiptomaincontentlink.AccesskeyS"/>
- </a>
- <ahrefahref="#tabNavigation"id="lotusAccessLinkTabNavigation"accesskey="1"
- class="lotusAccess">
- <imgsrcimgsrc="/activities/nav/common/styles/images/blank.gif"
- alt="Skiptotabnavigationlink.Accesskey1"/>
- </a>
- <ahrefahref="#subNavigation"id="lotusAccessLinkSubNavigation"accesskey="2"
- class="lotusAccess">
- <imgsrcimgsrc="/activities/nav/common/styles/images/blank.gif"alt="Skipto
- subnavigation.Accesskey2"/>
#p#
可訪問性認(rèn)證測試
現(xiàn)在您已經(jīng)了解到Web應(yīng)用程序開發(fā)過程中會(huì)遇到的各種問題，那么現(xiàn)在來看一下如何對這些問題進(jìn)行測試，在可訪問性驗(yàn)證測試中使用的工具，按照以下步驟測試Web內(nèi)容的可訪問性，將會(huì)事半功倍：
步驟1：語法分析：WebKing
步驟2：鍵盤導(dǎo)航和可視焦點(diǎn)
步驟3：可視內(nèi)容的格式化和定時(shí)
步驟4：音頻和視頻
步驟5：高對比和大字體
步驟6：禁用樣式表
步驟7：屏幕閱讀器
每一步都有相關(guān)的輔助工具，本文描述的官方工具有：語法檢查器和屏幕閱讀器。
Web語法檢查器—WebKing
我們在第一步就提到了Web語法檢查器。這其實(shí)主要供開發(fā)人員而不是測試人員使用。它一般在開發(fā)結(jié)束、正式AVT開始之前使用。WebKing是常用的Web語法檢查工具，它可以直接檢查HTML代碼并幫助您在使用其他輔助技術(shù)之前修復(fù)可訪問性問題。
動(dòng)態(tài)內(nèi)容生成是Web 2.0應(yīng)用程序的一項(xiàng)特性。使用Ajax在Web上動(dòng)態(tài)生成對象使頁面在每次加載時(shí)都產(chǎn)生不同的HTML代碼。WebKing支持兩種不同的代碼掃描方法：靜態(tài)掃描和動(dòng)態(tài)掃描。靜態(tài)掃描可用于開發(fā)人員在開發(fā)環(huán)境中直接掃描源代碼。動(dòng)態(tài)掃描可用于測試人員在與程序交互并加載不同內(nèi)容時(shí)操作。WebKing掃描結(jié)果報(bào)告可用于分析不同違背現(xiàn)象的原因和解決方案，以下列舉了幾種常見的違背現(xiàn)象。
重復(fù)ID
HTML代碼中的所有元素都應(yīng)有一個(gè)ID。對于用來識(shí)別HTML頁面上的元素的輔助技術(shù)來說，ID應(yīng)該是惟一的，否則就會(huì)產(chǎn)生混亂，無法確定哪一個(gè)才是正確的元素。對于HTML之類的靜態(tài)代碼來說，很容易遵守這一點(diǎn)。但對用JavaScript生成的動(dòng)態(tài)代碼來說，則會(huì)很困難。在這種情況下，必須用某種方法保證每次都產(chǎn)生不同的ID。圖16顯示了一種關(guān)于重復(fù)ID的解決方案。每次頁面加載時(shí)，JavaScript都會(huì)生成“hidedetails”按鈕。每個(gè)按鈕都加個(gè)數(shù)字作后綴來實(shí)現(xiàn)惟一的ID。
圖16.重復(fù)ID示例
清單8.為動(dòng)態(tài)生成的代碼設(shè)置惟一ID的代碼
- <aidaid="showMore_1"class="lotusActionlotusNowrap"href="#"
- onclick="showDetails('1');returnfalse;"
- style="display:none;">showdetails</a>
- <aidaid="hideMore_1"class="lotusActionlotusNowrap"style=""
- href="#"onclick="hideDetails('1');returnfalse;">
- hidedetails</a>
ALT文字和標(biāo)簽—表單關(guān)系設(shè)置
這些問題經(jīng)常會(huì)發(fā)生，這就是第一步要執(zhí)行WebKing的原因。在這個(gè)階段，要檢查所有圖片的alt屬性是否設(shè)置、對象間的關(guān)系是否設(shè)置。如果還沒設(shè)置的話，您將收到警告，并且您應(yīng)該在進(jìn)入下一階段前修復(fù)這些問題。
并不是所有違背現(xiàn)象都會(huì)成為真正的問題。以重復(fù)ID為例，有些隱藏對象不會(huì)顯示給用戶，只是供分析腳本使用。這種類型的問題可在WebKing中設(shè)置為禁止報(bào)告或看作報(bào)告中的例外。
屏幕閱讀器—JAWS
屏幕閱讀器主要針對視力受損的用戶。它能幫助用戶使用耳朵而不是眼睛來導(dǎo)航整個(gè)頁面。它還能幫助識(shí)別用戶界面中的所有元素及其關(guān)系。當(dāng)使用JAWS聽取UI內(nèi)容時(shí)，有一些快捷鍵可用來打開“Linklist”、“headlinelist”等內(nèi)容。另外，還可以對JAWS設(shè)置閱讀配置，如是否讀出鏈接的上下文、標(biāo)題或alt內(nèi)容等。如果要進(jìn)行設(shè)置，打開JAWS主面板，選擇Utilities>ConfigurationManager>SetOptions>HTMLOptions。圖17顯示的是設(shè)置面板。
圖17.JAWS設(shè)置
JAWS10可用于FirefoxVersion3或Microsft®InternetExplorer8來讀取UI內(nèi)容，因?yàn)槎叨贾С諻AI-ARIA技術(shù)。用戶能聽到UI上的更多內(nèi)容，如頁面結(jié)構(gòu)或?qū)ο箨P(guān)系，JAWS有兩種模式可供用戶聽取UI內(nèi)容。一種是VirtualPC光標(biāo)模式，另一種是Forms模式。有時(shí)候這兩種模式被簡稱為打開VirtualPC光標(biāo)模式或關(guān)閉VirtualPC光標(biāo)模式。當(dāng)運(yùn)行JAWS聽取內(nèi)容時(shí)，這兩種模式的效果截然不同。VirtualPC光標(biāo)模式為用戶逐行讀取文檔或使用快捷方式讀取。Forms模式讓用戶與控件交互并在可編輯控件中輸入信息。這兩種模式可用Insert+Z組合鍵切換。在VirtualPC光標(biāo)模式下，用戶無法在可編輯字段中輸入任何信息，必須切換到另一模式才可以。
測試方法
對Web 2.0應(yīng)用程序的AVT測試并不經(jīng)常進(jìn)行。但對于使程序符合W3CWeb檢查列表卻十分重要。以下是AVT方法的最佳實(shí)踐。
◆AVT應(yīng)當(dāng)在所有的主要UI更改完成后進(jìn)行，因?yàn)榇蟮腢I變更會(huì)引入新的元素或更新已有元素的屬性。
◆AVT應(yīng)當(dāng)在UI凍結(jié)（freeze）前完成。在該階段發(fā)現(xiàn)的問題會(huì)導(dǎo)致UI更改，這將造成元素屬性改變，應(yīng)當(dāng)確保在不出意外的情況下修復(fù)問題。如果項(xiàng)目對UI更改的簽入有最后期限，應(yīng)該在最后期限之前完成AVT。
◆Webking被更多地作為單元測試工具使用，而不是在AVT階段使用的工具，特別是用于靜態(tài)掃描。應(yīng)當(dāng)在完成WebKing靜態(tài)掃描并修復(fù)問題后再進(jìn)行其他測試。
◆JAWS是個(gè)靈敏的工具。不同版本的JAWS對UI元素會(huì)讀出不同的內(nèi)容。這不僅出現(xiàn)在主要版本變更中，例如JAWS9和JAWS10，也出現(xiàn)在小的補(bǔ)丁包變化中，如JAWS10.0.512和JAWS10.0.1142。早期版本可能在讀取ARIA屬性方面存在bug，后期版本則沒有。因此，識(shí)別JAWS版本也是一項(xiàng)重要工作。
◆ARIA是用于Web 2.0應(yīng)用程序的一項(xiàng)很好的技術(shù)。該技術(shù)定義了很多屬性幫助用戶識(shí)別UI中元素的結(jié)構(gòu)和含義。該工具還可為您節(jié)省大量工作，例如，在aria-sort屬性中，您可以使用很長的一句話來設(shè)置排序鏈接的標(biāo)題，告訴用戶是降序還是升序排列。使用aria-sort屬性，用戶可以用一個(gè)常用單詞來設(shè)置標(biāo)題，或添加aria-sort=ascending/descending來確定排序的模式。
◆有時(shí)測試人員很難確定alt文本是否需要或能否設(shè)置為空。原則是如果有一種替代方法能讓用戶知道圖片傳達(dá)的信息，alt就可以設(shè)置為空。否則，應(yīng)填入有意義的文字。
結(jié)束語
AVT是產(chǎn)品生命周期中一個(gè)重要階段。每個(gè)產(chǎn)品都有其不同的實(shí)現(xiàn)方法并且都應(yīng)符合WCAG檢查列表。本文描述了一些基本而重要的檢查點(diǎn)以及測試工具。請現(xiàn)在就學(xué)會(huì)這些技巧并運(yùn)用到您的測試過程中吧。
【編輯推薦】
