Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Links

In some situations, designers may choose to lessen the visual appearance of links on a page by using shorter, repeated link text such as "read more", "Learn more" "See details" etc. 

These types of non-descriptive links are not helpful to screen reader users. 

Describe the purpose of the link to screen reader users by using the aria-label element.

The aria-label will replace the non-descriptive link, only for screen reader users. 

Example:

<div class="mb-20">  <a href="https://sfelections.sfgov.org/ " class="btn btn-inverse" target="_blank" rel="noopener" aria-label="Read more about voting on November 8">Read more</a></div>

New Windows

From an accessibility perspective, the preference would be to always open links within the same window rather than opening them up in a new window. 

...