盲人視覺障礙人士使用網頁時,主要是通過聲音判斷操作,該功能通過開啟手機旁白模式開啟
默認情況下頁面的所有元素標簽都能識別到,包括圖片和文字
為了更好的盲人體驗,此網頁就需要前端開發代碼進行一些處理,在一些不能識別的字段里添加額外的標簽,常用的標簽有以下內容
1.想讓某標簽內容讀成指定的文字,就加標簽 aria-label=“XXX” 有的時候必須添加對應的role才能起效
2.想讓某icon圖標不要識別,那么就加 aria-hidden="true"
3.如果想讓某標簽識別成一張圖片 role="img"
4.將某內容識別成菜單 role="menuitem" 如果讓他識別讀成標簽,則是button
做一些簡單的測試
比較好的參考學習資料:
https://mp.weixin.qq.com/s/s3cdY3sIE0FUCzst-QhDFg
https://www.w3cplus.com/wai-aria/wai-aria.html
https://www.jianshu.com/p/2424e4119bc6