Links do not have a discernible name

[kamauwanjoroge]

I am getting this accessibility error "Links do not have a discernible name" for all links created from headings (you can try testing a post from your test site using web.dev). Would you consider correcting it to address the issue? https://web.dev/link-name/?utm_source=lighthouse&utm_medium=lr

[allejo]

Accessibility is tough to solve in a generic fashion for a project such as this; there are a lot of things that can be opinionated or have different requirements. This is why this project doesn't force any practices onto its users.

That being said, making links accessible is already possible by using the anchorAttrs, anchorTitle, or anchorBody parameters for this project.

Take for example, this unit test which is using Bootstrap's .sr-only utility to create a span that has a message of what the link is linking to.

jekyll-anchor-headings/_tests/customAnchorBody.html

Lines 9 to 21 in 27ca069

	{% capture anchor %}
	<span class="sr-only">Permalink to "%heading%"</span>
	<i class="fa fa-link" aria-hidden="true"></i>
	{% endcapture %}
	{% include anchor_headings.html html=text anchorBody=anchor %}
	<!-- /// -->
	<h1 id="heading-1">Heading 1 <a href="#heading-1">
	<span class="sr-only">Permalink to "Heading 1"</span>
	<i class="fa fa-link" aria-hidden="true"></i>
	</a></h1>

But if you don't want to use a CSS class like that, you could also use anchorTitle to add a title attribute to the anchors themselves so screen readers can announce them correctly.

But wait, what if you want to use aria-label or aria-labeledby instead? For that, you can use the anchorAttrs parameter to inject any attributes you want. Maybe you want to inject aria-hidden instead so that links are completely ignored by screen readers (see #12).

So, the ability to make the links discernible already exists in this project. It just happens to be opt-in because there are so many different ways of handling this.

[allejo]

I could, however, create a page in this project's wiki describing the different ways of handling links in an accessible manner. How does that sound?

[kamauwanjoroge]

I could, however, create a page in this project's wiki describing the different ways of handling links in an accessible manner. How does that sound?

This sounds fantastic. I actually prefer to set the aria-hidden attribute to true. But I am no coder, so if you could kindly show how to include the attribute in the code, I would really appreciate it.

[allejo]

I could, however, create a page in this project's wiki describing the different ways of handling links in an accessible manner. How does that sound?

This sounds fantastic. I actually prefer to set the aria-hidden attribute to true. But I am no coder, so if you could kindly show how to include the attribute in the code, I would really appreciate it.

@askel45 here you go! https://github.com/allejo/jekyll-anchor-headings/wiki/Link-Accessibility#hiding-links-entirely-for-screen-readers