craftcms / anchors

Add anchor links to headings in your Craft CMS website content.
MIT License
48 stars 7 forks source link

Enhancement: option to place the anchor link outside the heading element #36

Closed JezDriver closed 8 months ago

JezDriver commented 9 months ago

As explained in this article, having the anchor link within the heading element can cause accessibility issues, as the text content of the heading becomes something like "Heading example Direct link to heading example".

It would be great to have a config option like anchorLinkInHeading (boolean, defaults to true) to control this. This could also work with the existing anchorLinkPosition option, to render it before or after the heading element.

For reference, this is the recommended markup from Amber (author of the article) for best accessibility:

<h2 id="introduction">Introduction</h2>
<a href="#introduction">
  <span aria-hidden="true">#</span>
  <span class="hidden">Section titled introduction</span>
</a>