Link Missing A Text Alternative

This issue can be flagged for a few reasons: The first is that no visible text is included within the anchor element, it can also be flagged if the link is part of an image that does not include an alt text or aria-label.

Page Report:

The Siteimprove page report for this issue will look similar to the one in the image below.

Example 1

The first example is of a link that is also an image as seen below. To resolve the flag, we need to add an aria-label to the link. Start by clicking on the edit button of the content block widget and then click to the html view. Here you can see we added an aria-label of "Policy Documents" to this link. The aria-label should provide a good explanation to a screen reader of what this link is.

Example 2

The second example that may occur can be seen in this screenshot below. It is being flagged because the anchor element only contains the full text link and no visible text. This can sometimes be confusing to some users or screen reader users when the full address is being read. Instead, clear and concise visible text should be added to the anchor.

This flag can be resolved by editing the widget and clicking the html button on the upper right. Visible text can then be added to the link as shown in this example below. Visible text should tell the user specifically the site or area they will go to.