I really enjoyed this Medium post titled "Links Are Broken" by Sebastian Kersten of De Correspondent, a publication in the Netherlands. It was smart, and showed some of the interesting things they're doing at that publication. I was thinking about their solutions (which are all really neat), and I had an idea for a simple link mechanism. I totally agree that links can be very distracting mid-text. But is there a simple way around this without adding too much more UI?
I had a very very simple idea. Probably too simple, it's almost embarrassing. I almost didn't put this out there, but it was fun to make and design (there are more lines of CSS than anything).
The idea is to just scrape a body of text for the links, and add them to a module at the end (or somewhere) to collect them all.
I just wrote a few lines of JS to look at .main-text and find all the links. It stores them in an array, and then pops them into the .links div below. You can see the blob of the JS here.
Also, did you notice that all the links have very descriptive text? It makes for more pleasing footnotes when they're all gathered, instead of a bunch of "here" and "click here." It's a good habit, adding more descriptive text to links improves accessibility.
That's it! I'm sure you could do all kinds of interesting stuff with something like this, but this is a start. If you're interested in seeing more, check out the Links repo on GitHub.