stnd.buildSTANDARD MANUAL2026-07-15

5.5 Deep Linking Reference

Specifications and protocols for deep linking and text fragments in standard.garden.

5.5 Deep Linking Reference

Deep linking allows you to share a link that points to a specific passage within a note, not just the note itself. When someone opens your link, their browser automatically:

  1. Scrolls to the exact text you selected
  2. Highlights that text with a colored background
  3. Provides visual context for what you wanted to share

Method 1: Keyboard Shortcut (Fastest)

  1. Select the text you want to link to
  2. Press Cmd + Shift + L (Mac) or Ctrl + Shift + L (Windows/Linux)
  3. The link is automatically copied to your clipboard
  4. Paste and share!

Method 2: Command Palette

  1. Select the text you want to link to
  2. Open the Gate (press :: or Cmd/Ctrl + K)
  3. Type ::highlight
  4. Press Enter
  5. The link is copied to your clipboard

Method 3: Share Button

If your note has a share button with text selection support:

  1. Select the text
  2. Click “Copy Link to Highlight”
  3. Done!

Example Usage

Before

"Check out my note about typography:"
https://standard.garden/@alice/typography-basics

→ Reader has to find the relevant section

After

"Check out this key insight about kerning:"
https://standard.garden/@alice/typography-basics#:~:text=Kerning%20is%20the%20space

→ Browser scrolls directly to the sentence and highlights it

What URLs Look Like

https://standard.garden/@username/note-slug
https://standard.garden/@username/note-slug#:~:text=selected%20text
https://standard.garden/@username/note-slug#:~:text=beginning%20text,ending%20text

✅ Great for:

  • Academic citations
  • Referencing specific arguments
  • Sharing key insights
  • Directing readers to important passages
  • Code snippets or examples
  • Definitions or explanations

❌ Not ideal for:

  • Very long selections (use a summary instead)
  • Text that might change frequently
  • When you want readers to see full context first

Browser Support

Browser Support Notes
Chrome ✅ Full Version 89+
Edge ✅ Full Version 89+
Safari ✅ Full Version 16.1+
Firefox ⚠️ Limited Requires flag in about:config
Mobile Safari ✅ Full iOS 16.1+
Mobile Chrome ✅ Full Android Chrome 89+

Note: On unsupported browsers, the link still works—it just won’t highlight the text.

Tips & Tricks

1. Keep Selections Moderate

Select complete sentences or short paragraphs for best results. Very short selections (1-2 words) might match multiple places in the document.

2. Include Context

If your selection is part of a larger argument, consider selecting a slightly longer passage that provides context.

Before sharing important deep links, test them in a different browser or incognito window to ensure they work as expected.

4. Use Descriptive Text

When sharing, provide context about what the link points to:

Good: “Here’s the section on color theory: [link]”
Better: “Check out the explanation of OKLCH color space: [link]”

Privacy & Security

✅ Safe to use:

  • Text fragments are read-only
  • They cannot modify page content
  • They cannot execute code
  • URLs are properly encoded

✅ Privacy-friendly:

  • The fragment is removed from the URL bar after highlighting
  • No tracking or analytics on fragment usage
  • Works without server-side processing

Technical Details

How It Works

  1. Client-side only: Your browser handles everything
  2. Native API: Uses the Text Fragments API
  3. No overhead: Zero impact on page load performance
  4. Future-proof: W3C standard, supported by major browsers

URL Structure

https://example.com/page#:~:text=[prefix-,]start[,end][,-suffix]
  • #:~:text= – Fragment directive (signals this is a text fragment)
  • start – Required: beginning of text to find
  • end – Optional: ending of text (for longer selections)
  • prefix – Optional: text before the selection (for disambiguation)
  • suffix – Optional: text after the selection (for disambiguation)

Accessibility

✅ Keyboard accessible: Full keyboard support via shortcuts
✅ Screen reader friendly: Toast notifications are announced
✅ High contrast: Highlights adapt to theme colors
✅ Reduced motion: Respects user preferences for animations

Troubleshooting

  • Browser might not support Text Fragments (check browser version)
  • Text might have changed since the link was created
  • Try selecting more specific text
  • Browser might not support Clipboard API
  • Check browser permissions for clipboard access
  • Try using the Gate command instead of keyboard shortcut

“Selection is gone after pressing shortcut”

  • This is normal—the link is still copied correctly
  • The selection is cleared as part of the copy process

See Also


Last Updated: 2025-01-15
Feature Status: ✅ Stable
Keyboard ShortcutCmd/Ctrl + Shift + L
Gate Command::highlight