次のように、順序付けられていないリスト内にリンクがあります。
<li class="savelink">
<a href="/save"><span>Save</span></a>
</li>
通常、スクリーン リーダーは「保存」と読み上げます。実際のリンクテキストを変更せずにそれを変更することは可能ですか、またどの属性を使用しますか?
ビジネス ニーズは、アイコンでスタイル設定されたリンクを持つことです。アイコンはリンク テキストを補完します。例えば：
aria-label を試しましたが、成功しませんでした。
アイコンには意味があるため、 を使用して含める必要がありますimg。次に、altそれに応じて属性を使用します。たとえば、「追加」を表すアイコンで「メニュー項目の追加」を表現する必要がある場合は、リンクに (「メニュー」ではなく) 「メニュー項目」を使用する必要があります。
<a href="/add"><img src="add-icon.png" alt="Add"> menu item</a>
を使用する代わりに、imgCSS を使用してアイコンを表示し、リンク テキスト全体を視覚的に非表示にして、スクリーン リーダー ユーザー (または CSS を非アクティブ化するユーザー) にのみ読み取られるようにすることもできます。clipここでは、メソッドを使用できます。
<a href="/add"><span class="visually-hide">Add</span> menu item</a>