Discovering URL Scroll-To-Text Fragment

I thought my finger was on the pulse of significant browser developments, but this one I missed completely: URL Scroll-To-Text Fragment.

Here’s the URL for a post on Lisa’s blog, for example:

https://lisachandler.is/pressure-summer/

Down in the text there is the sentence:

To cherish every memory.

It turns out that I can link directly to that sentence, and have it highlighted to boot, like this:

https://lisachandler.is/pressure-summer/#:~:text=To%20cherish%20every%20memory.

Pulling this apart—it’s all documented here—I add these to the URL:

• #:~:text=
• the text I want to highlight on that page, with special characters, like spaces, %-encoded.

There’s more in the documentation about linking to, and highlighting, a range of text, with a start and end string; for example:

https://ruk.ca/content/asking-questions#:~:text=And%20what,something%20sticks.

will link to and highlight the paragraph that starts with “And what” and ends with “something sticks.”

This is a browser feature I wish had existed from off the top—and that I wish I’d learned about earlier—as referencing sentences or paragraphs in my blog posts is something I do all the time.

There’s a browser extension that helps with making these links easier; right now it doesn’t appear to work for the latest Safari, but there’s a bookmarklet that does.

(Note that this isn’t a universally-supported feature, and Firefox specifically doesn’t support it).