And one more thing: many web browsers, but in particular Safari both on iOS/iPadOS and macOS, provide a contextual menu for creating text fragments from selected text, but it is worth knowing about the standard if you need to personalize, shorten, or fix the provided text fragment URL.

#Safari #TextFragments #WebTextFragments

Today I Learned about text fragments, which allows the author of a link to a web page, regardless of annotations or anchors present on a particular web page, to indicate exactly on the web page where to link to. For instance, highlight a quote in a page like this: (add http:// or https:// at the start to convert into a working link):

example.com#:~:text=for%20use

I learned this on the Mozilla Development Network, but thanks to links from @drdrang and @lapcatsoftware for the tips in the right direction!

https://developer.mozilla.org/en-US/docs/Web/URI/Reference/Fragment/Text_fragments

#TIL #TodayILearned #WebTextFragments #TextFragments #WebLinks

Text fragments - URIs | MDN

Text fragments link directly to specific text in a web page, without requiring the page author to add an ID. They use a special syntax in the URL fragment. This feature lets you create deep links to content that you don't control and may not have IDs associated. It also makes sharing links more useful by directly pointing others to specific words. Browsers may differ in how they draw attention to the linked text—usually, the text is scrolled into view and highlighted with color.

MDN Web Docs

Alex Chan: Linking to text fragments with a bookmarklet. “Text fragments allow you to link directly to specific text on a web page, and some browsers will highlight the linked text – for example, by scrolling to it, or adding a coloured highlight. … But I don’t find the syntax especially intuitive – I can never remember exactly what mix of colons and tildes to add to a URL. To help me […]

https://rbfirehose.com/2025/09/15/alex-chan-linking-to-text-fragments-with-a-bookmarklet/

Alex Chan: Linking to text fragments with a bookmarklet | ResearchBuzz: Firehose

ResearchBuzz: Firehose | Individual posts from ResearchBuzz
Text fragments in Firefox

Enabling Copy Link to Highlight contextual menu in #Firefox for #TextFragments

Linux Attorney
Toward Enduring Web Citations

An attempt to solve the twin problems of impermanence and imprecision.

Owls & Daemons
Cool People Link to Text Fragments – Frontend Masters Boost

Just in case you didn’t know, you don’t need a page to have ID’s on elements anymore in order to jump down to a particular place. We’ve reached support across all major browsers to link to Text Fragments, like: https://frontendmasters.com/courses/#:~:text=Web%20Performance%20Fundamentals%2C%20v2 The #:~: syntax is kinda funky, but here we are, and it’s not too hard […]

I don't know which genius came up with Text Fragments, but it's an excellent way to share links to web pages and highlight the content you want the recipient to see.

Like this:

https://developer.mozilla.org/en-US/docs/Web/URI/Fragment/Text_fragments#:~:text=Supporting%20browsers%20will%20scroll%20to%20and%20highlight%20the%20first%20text%20fragment%20in%20the%20linked%20document%20that%20matches%20the%20specified%20directive.

I always wondered what the "Copy Link to Highlight" option did in @Vivaldi - but now I know.  

#Internet #WebBrowsers #DeepLink #TextFragments #WebDev

Text fragments - URIs | MDN

Text fragments allow linking directly to a specific portion of text in a web document, without requiring the author to annotate it with an ID, using particular syntax in the URL fragment. Supporting browsers are free to choose how to draw attention to the linked text, e.g. with a color highlight and/or scrolling to the content on the page. This is useful because it allows web content authors to deep-link to other content they don't control, without relying on the presence of IDs to make that possible. Building on top of that, it could be used to generate more effective content-sharing links for users to pass to one another.

MDN Web Docs

🔗 Smarter than 'Ctrl+F': Linking Directly to Web Page Content

by Ahmad El-Alfy @ahmadalfy

#TextFragments #webdev #html

https://alfy.blog/2024/10/19/linking-directly-to-web-page-content.html

Smarter than 'Ctrl+F': Linking Directly to Web Page Content

Discover how text fragments revolutionize web navigation. Learn to link directly to specific text on any web page, surpassing traditional 'Ctrl+F' searches. Explore this powerful, user-friendly feature for precise content sharing and improved web experiences.

Ahmad Alfy's Blog
I can imagine this being quite useful in some contexts for some of the longform-friendly editors I work with. I'd be fascinated how tools like #CraftCMS / #CKEditor could support it (and old-fashioned anchor links to #ids too if I'm totally honest): https://alfy.blog/2024/10/19/linking-directly-to-web-page-content.html #HTML #textfragments
Smarter than 'Ctrl+F': Linking Directly to Web Page Content

Discover how text fragments revolutionize web navigation. Learn to link directly to specific text on any web page, surpassing traditional 'Ctrl+F' searches. Explore this powerful, user-friendly feature for precise content sharing and improved web experiences.

Ahmad Alfy's Blog

@ireddick

#TextFragments sounds great! I could have used that earlier today. And many other days... Now added to my list of handy tools, I'm sure I'll use it a lot.