Web開發的大爆炸:讓我們來談談可訪問性

Web可訪問性適用於需要屏幕閱讀器與基於Web的內容互動的用戶。瞭解如何確保您的應用符合網絡輔助功能標準。

Web開發的大爆炸:讓我們來談談可訪問性

在之前的文章中,我提到了“這不是最佳做法”或“不要在生產中這樣做”。我曾經認為最佳實踐主要是為後來繼承你的項目的開發人員(誰曾經繼承過一個由口香糖和魔法組合而成的項目),或者是因為某人需要獲得報酬來制定我們必須遵守的規則只是為了讓我們的生活變得悲慘。當我參加東北技術峰會女性設計無障礙網站研討會時,這一切都發生了變化。

康納斯特 NBCUniversal高級產品經理兼無障礙首席技術專家Adina Halter領導這次研討會,自從我開始開發網站和網絡應用程序以來,第一次開啟了我的視線。我想我使用的很多框架可能都遵守這些規則,但我從來沒有考慮過它作為開發人員。她幫助我們為非健全人類獲得了同情和觀點。我不得不說,我對自己很久沒有意識到這一點感到失望。

但回到最佳實踐搭配。其中很多都來自WCAG。通過Web內容可訪問性指南列表,告訴我,對於您被告知為Web編程的方式,有沒有聽起來很熟悉?

我們從成功標準1.1.1 - 非文本內容開始。有多少次被告知要為圖片添加替代文字?你做過多少次這樣對於閱讀文本並且看不到圖像的人有意義?或者更好的是,你們有多少人跳過了這個?替代文本在無法呈現的圖像的用例之外很重要。這是向正在使用屏幕閱讀器的用戶閱讀的文本。而且,如果不存在,則讀取圖像URL。那有多有用?

你知道屏幕閱讀器也閱讀HTML標籤嗎?這就是為什麼使用CSS進行樣式設計而非標籤很重要。你希望你的頁面像散文大綱一樣閱讀,而不是隨意分散標題標籤。

你的結構應該是這樣的:

About Us

Our History

Our Staff

Leadership Team

Projects

Who we've worked with

不是這個:

About Us

Our History

Our Staff

Leadership Team

Projects

Who we've worked with

雖然這可能看起來微不足道,但如果你在2級標題附近跳躍,哪一個更易於理解和理解?哪一個可以幫助您找出哪些部分有更多信息?

當談到JavaScript和動態組件時,這可能會稍微複雜一些。這就是ARIA的用武之地。ARIA提供了一個很好的資源庫來幫助動態網頁 - 它指出哪些JavaScript UI框架包含了ARIA,以及如何在HTML組件中使用ARIA。

在設計網頁時,對所有用戶表示同情是很重要的。它為所有人提供了更好的用戶體驗(也意味著不會因未能遵守WCAG而面臨財務分歧)。因此,花一點時間來回顧一下WCAG和您已經構建的Web應用程序,或許應該重新考慮一下 - 您是否為每個人設計了這個應用程序?


分享到:


相關文章: