Links
Several situations where links might be an issue. Remember: descriptive and unique are the requirements.
What to do with multiple links?
Your tools are aria-label, aria-labeledby, aria-describedby and class="sr-only".
| Widget | Price | Actions |
|---|---|---|
| Smeck | $12 | Edit | Delete | Add to wishlist |
| Stodge | $32 | Edit | Delete | Add to wishlist |
| Flaf | $1 | Edit | Delete | Add to wishlist |
| Squitch | $67 | Edit | Delete | Add to wishlist |
| Speck | $32 | Edit | Delete | Add to wishlist |
| Sproing | $12 | Edit | Delete | Add to wishlist |
Fixed (several techniques)
| Widget | Price | Actions |
|---|---|---|
| Smeck | $12 | Edit Smeck | Delete Smeck | Add to wishlist Smeck |
| Stodge | $12 | Edit | Delete | Add to wishlist |
| Sproing | $12 | Edit | Delete | Add to wishlist |
| Squitch | $67 | Edit | Delete | Add to wishlist |
Inspect the last row. It has not changed, and yet you could argue that it is ok, even if it is not optimal. How so?
What to do with icon links?
Your tools are aria-label, aria-labeledby, aria-describedby and class="sr-only".
Fixed (several techniques):
E MailWhat happens when the link has a lot of text? Let's assume that is how it came to you as a requirement.
Your tools are aria-label, aria-labeledby and aria-hidden.
List group item heading
3 days agoDonec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.
Donec id elit non mi porta.List group item heading
3 days agoDonec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.
Donec id elit non mi porta.List group item heading
3 days agoDonec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.
Donec id elit non mi porta.Some posibilities?
List group item heading
3 days agoDonec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.
Donec id elit non mi porta.List group item heading
3 days agoDonec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.
Donec id elit non mi porta.