Walden Pond is full of content that was intended to go on the web. So there’s all sorts of problems with how to make it usable in print. One of the most obvious is hyperlinks.

There are some really nice tricks that make what the link links to visible in print.

a:after {
    content: " [" attr(href) "] ";
}

From CSS tricks

Which is cool if your links are nice looking, but sometimes the text has a tonne of links in it and you can end up with more link than content.

In Walden Pond I’ve put the links in as footnotes. So a superscript number in the text, and a numbered list of links at the end of the article. I’m using a slightly edited version of Aaron Gustafson’s footnote code (from 2005!).

This is great, but sometimes you’ll get an article that uses a lot of long links. A prime offender is when the article recommends a lot of things with amazon referrer links, but it could be almost anything. For example, in the Wait But Why post From Muhammad to ISIS: Iraq’s Full Story there are 54 links, and a lot of them look like this:

https://www.ft.com/content/69e70954-f639-11e3-a038-00144feabdc0?%E2%80%94ftcamp=crm/email/2014617/nbe/AsiaMorningHeadlines/product#axzz3A20GKJTZ

In this case, the bit after the ? is just tracking (?%E2%80%94ftcamp=crm/email/2014617/nbe/AsiaMorningHeadlines/product#axzz3A20GKJTZ) to tell the FT where the reader found the link. But in some cases, the URL params actually have useful information in them, so I can’t just cut them off.

What I’ve ended up doing is using Firebase Dynamic links to shorten these links, so the FT link above becomes: Hi1e

That’s sort of cheating because it’s actually https://pond.page.link/Hi1e but the first part is the same for all the shortened links.

This means that people can either remember the https://pond.page.link/ part and build their own links, or they can go to the Walden Pond website and type it into the link-expander.

some links in a list, some shortened, some not

This figure is half-width and floated right

One problem with shortened links is that they’re an extra layer of abstraction away. So you have no idea if Hi1e is taking you to the FT or to PornHub, or to Best Number One Phishing Bank. I’ve tried to get around that by only shortening links over 90 chars long, and then for the links I do shorten leaving the first part of the domain intact. Giving: ft.com | Hi1e.

Sometimes the link has an ID attached to it, so I’ve added that in too. Hopefully it’s not too confusing, because without it, you can’t see what the link points to because Firebase seems to strip off the #part of the url.