Read more Links do not have descriptive text

Viewed 1496

I have a page which contains a list of items. Each item contains a 'Read more' link that points to a different page. But when I run the lighthouse tool on that page, it complains that links do not have a descriptive text. Now I cannot change the Read more text here.

<a href="link 1">Read more</a>
<a href="link 2">Read more</a>
<a href="link 3">Read more</a>

Is there any other way to resolve this?

1 Answers

Yes, you can use aria-label in order to provide more descriptive text to Assistive Tech such as a screen reader.

<a href="link 1" aria-label="some more descriptive text that explains the link">Read more</a>

Assistive tech will read the contents of the aria-label out instead of "Read More".

Bear in mind that the text you enter should be enough to know where the link will take you and not context dependent (the link text should make sense on its own) if possible.

Related