無障礙訪問

2022-04-28 15:13 更新

aria-component

無障礙訪問

為了更好地滿足視障人士對于小程序的訪問需求,基礎(chǔ)庫自2.7.1起,支持部分ARIA標(biāo)簽。

無障礙特性在讀屏模式下可以訪問,iOS可通過設(shè)置->通用->輔助功能->旁白打開。

以 view 組件為例,開發(fā)者可以增加aria-role和aria-label屬性。 其中aria-role表示組件的角色,當(dāng)設(shè)置為'img'時,讀屏模式下聚焦后系統(tǒng)會朗讀出'圖像'。設(shè)置為'button'時,聚焦后后系統(tǒng)朗讀出'按鈕'。 aria-label表示組件附帶的額外信息,聚焦后系統(tǒng)會自動朗讀出來。

小程序已經(jīng)內(nèi)置了一些無障礙的特性,對于非原生組件,開發(fā)者可以添加以下無障礙標(biāo)簽。

aria-hiddenaria-rolearia-labelaria-checkedaria-disabled
aria-describedbyaria-expandedaria-haspopuparia-selectedaria-required
aria-orientationaria-valueminaria-valuemaxaria-valuenowaria-readonly
aria-multiselectablearia-controlstabindexaria-labelledbyria-orientation
aia-multiselectablearia-labelledby

示例代碼

<view aria-role="button"  aria-label="提交表單">提交</view>

提示:

  1. 安卓和iOS讀屏模式下設(shè)置aria-role后朗讀的內(nèi)容不同系統(tǒng)之間會有差異
  2. 可設(shè)置的aria-role可參看 Using Aria中的Widget Roles,部分role的設(shè)置在移動端可能無效。


以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號