+++
date    = "2023-10-11T00:10:11+00:00"
lastmod = "2023-10-11T00:10:11+00:00"
tags    = [ "webdev", "gists" ]
author  = "tdro"
+++

[Text fragments](https://web.dev/text-fragments/#:~:text=Text%20Fragments%20let%20you%20specify%20a%20text%20snippet%20in%20the%20URL%20fragment%2E)
are a Chromium feature from a couple years ago. They (#:~:text=) emulate
{{< kbd "CTRL" >}} + {{< kbd F >}} or
[window.find()](https://developer.mozilla.org/en-US/docs/Web/API/Window/find)
from a {{< abbr URL "Uniform Resource Locator" >}}. I experimented in times past
with a snippet--like approach using
[`<mark>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/mark) with
URL encoded terms on
[id](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id) +
`:target` logic, such that
[clicking this link](/tdro/messages/fragments/#mark:the-article-says-boldly)
highlights the paragraph below.

```text
https://web.dev/text-fragments/#:~:text=Text%20Fragments%20let%20you
```

{{< mark id=true >}}
The article says 'boldly link', but personally fragments (any) work best on
infrequently changing content. Long URLs do text fragments make. Annoying? Who
knows/cares? They are not
[everywhere yet](https://caniuse.com/url-scroll-to-text-fragment) (Firefox). On
another tangent; I discovered that
[hugo did have the urlquery function](https://schnerring.net/blog/percent-encoding-with-the-hugo-urlquery-function/)
available (that nice blog saved me code surfing).
{{</ mark >}}