鏈接中的圖標可訪問性（隱藏詠歎調）

假設在旋轉木馬的兩端都有兩個箭頭，點擊時旋轉旋轉木馬。我可能有標記，如：鏈接中的圖標可訪問性（隱藏詠歎調）

<a class="carousel-prev" alt="Previous Item"><i class="icon-angle-left" aria-hidden="true"></i></a> 
<a class="carousel-next" alt="Next Item"><i class="icon-angle-right" aria-hidden="true"></i></a>

在這種情況下，不aria-hidden="true"屬性打破交通方便，或者是好的，因爲外<a>標籤tabbable和使用替代文字？

來源

2016-11-04 DiscoInfiltrator

alt屬性不是鏈接的有效屬性，所以它不僅是可訪問性問題，而且它也是無效的html。 Is it correct to use alt tag for an anchor link?

我會建議從鏈路去除中高音，而是包括「屏幕閱讀器，只有」類，將允許讀取文本但從屏幕隱藏：如果您想了解更多看到這個計算器職位。請參閱從a11yproject.com就如何落實這個鏈接：

http://a11yproject.com/posts/how-to-hide-content/

我會建議改變代碼看起來像這樣：

.sr-only { 
 
    position: absolute !important; 
 
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ 
 
    clip: rect(1px, 1px, 1px, 1px); 
 
    padding:0 !important; 
 
    border:0 !important; 
 
    height: 1px !important; 
 
    width: 1px !important; 
 
    overflow: hidden; 
 
}

<a class="carousel-prev"><span class="sr-only">Previous Item</span><i class="icon-angle-left" aria-hidden="true"></i></a> 
 
<a class="carousel-next"><span class="sr-only">Next Item</span><i class="icon-angle-right" aria-hidden="true"></i></a>

來源

2016-11-04 18:09:41 Skerrvy

爲什麼不只是有錨標籤上的詠歎調標籤？應該將你的alt =改爲aria-label =。不需要有屏幕閱讀器類的嵌套範圍。

<a class="carousel-prev" aria-label="Previous Item"><i class="icon-angle-left" aria-hidden="true"></i></a> 
<a class="carousel-next" aria-label="Next Item"><i class="icon-angle-right" aria-hidden="true"></i></a>

這是有效的html。查看https://www.w3.org/TR/html51/textlevel-semantics.html#the-a-element的「允許的ARIA狀態和屬性屬性」部分。所有詠歎調標籤都是允許的。

來源

2016-11-04 20:57:11 slugolicious

首先，WAI提供了工作轉盤的一個完整的例子：https://www.w3.org/WAI/tutorials/carousels/

一些個人意見：

你要問自己關於盲人用戶旋轉轉盤的興趣。爲盲人用戶處理用戶體驗的一種方式是讓他們忽略他們正在瀏覽的內容是輪播（當鍵盤焦點移動時自動切換項目）。
aria-hidden不會破壞可訪問性，因爲i標記內沒有任何內容，標記不是用作portmanteau標記（如span）。
正如@DiscoInfiltrator alt指出不是鏈接
由於視力不佳的用戶使用屏幕閱讀器的一小部分有效的屬性，你應該爲了使這種使用title屬性上a標籤信息可供所有人使用，而不是aria-label，這也是一個很好的選擇。

來源

2016-11-05 07:21:08 Adam

鏈接中的圖標可訪問性（隱藏詠歎調）

回答

相關問題