ウェブページ上の特定のテキストにリンクできれば、リンクをたどってページ全体をざっと読みながら伝えたい情報を探す手間が省けて、とても便利だと思いませんか？昨年末、主要ブラウザメーカーによる全面的なサポートが発表されたことで、ウェブはついに前世紀のハイパーテキスト理論に追いついたと言えるでしょう。
テキストフラグメントリンクの長く曲がりくねった歴史
1960年代のある時期、ハイパーテキストの先駆者テッド・ネルソンは、彼が提唱するプロジェクト・ザナドゥ・システムの中核機能として、特定のテキスト部分へのディープリンクを構想しました。（私が初めてザナドゥに触れたのは、1974年にコーネル大学でハイパーテキスト・フィクションの学位取得を目指していた頃、ネルソンが書いた『Computer Lib/Dream Machines 』の1987年版でした。インターネット・アーカイブから、読みやすい形式でダウンロードできます。）
1990年代初頭から最近まで、ウェブページの特定の部分にリンクする唯一の方法は、名前付きアンカーを使うことでした。ページ作成者がname="subhead1"HTMLにアンカーリンクを挿入した場合、URLはhttps://example.com/#subhead1ブラウザをその場所に直接スクロールさせます。ユーザーである私たちは、これらのリンクをコピーしたり、ドキュメントのHTMLソースを調べて名前付きアンカーを探し、独自のリンクを作成する際に使用したりできましたが、ほとんどのリンクはリンク先ページの先頭を指していました。
2020年、Google Chromeはページ内でのディープリンクを可能にするため、Scroll To Text Fragment（STTF）機能を導入しました。これにより、パラメータ付きのURLから#:~:text=ページ上の任意の表示テキストに直接リンクできるようになりました。例えば、「」のようなURLをhttps://example.com#:~:text=specific%20phrase入力すると、ページ上の「特定のフレーズ」というテキストがハイライト表示され、スクロールしてその部分まで移動します。この機能の主な利点は、ページ作成者の協力を必要としないことです。Googleは、Google検索結果におけるユーザーエクスペリエンスの向上にこの機能を活用し始めました。
Google は、オープンソースの Chromium コードにもこの機能を組み込みました。これにより、その後数年間で、Arc、Edge、Opera、Vivaldi など、ほとんどの Chromium ブラウザーがこの機能を採用しました。ごく最近まで、Brave は上級プライバシー研究者が STTF にはプライバシー リスクが伴うと考えていたため、抵抗していましたが、現在では開発ビルドでこの機能をサポートしています。Arc の開発者は、長いテキスト フラグメント リンクを、arc.net のサーバーによってリダイレクトされるカスタム ショートリンクにカプセル化するという、私が誤った判断だと考える決定を下しました。おそらく、リンクを読みやすくするため、またはプライバシーを強化するためです。テキスト フラグメント URL は長い場合がありますが、ユーザーはリンク先のホスト名をプレビューすることができ、arc.net のリダイレクト サービスが消滅しても機能しなくなります。
MozillaとAppleは、プライバシーに関する懸念と、GoogleがChromiumとGoogle検索に対する支配権を行使し、合意形成ではなく実装を通じてWeb標準を事実上決定することへの不満から、2024年後半までSTTFをサポートしないことを選択しました。しかし、最終的にはMozillaとAppleは市場の圧力に屈し、2024年10月にFirefox 131で部分的なサポートが、2024年12月にSafari 18.2で完全なサポートが提供される予定です。Firefoxはテキストフラグメントリンクを認識し、スクロールしてハイライト表示しますが、リンクを作成するにはアドオンが必要です。Safariはリンクの認識と作成の両方が可能です。
テキストフラグメントリンクの追跡
前述の通り、Braveの現在のバージョンを除き、私が知る限りすべてのWebブラウザがテキストフラグメントリンクの追跡をサポートしています。テキストフラグメントリンクをクリックすると（おそらく事前に気づいていないでしょうが）、指定されたページが読み込まれ、適切な場所までスクロールし、リンクに含まれるテキストがハイライト表示されます。（Braveの現在のバージョンでは、ページは読み込まれますが、スクロールしたりテキストをハイライトしたりすることはありません。リンクは通常のリンクと同じように動作します。）
ページ作成者は擬似要素を使ってハイライトされたテキストのスタイルを設定できるため、ハイライトの見た目は様々です::target-text。擬似要素では、色、背景色、テキスト装飾、テキストシャドウ、ストローク色、塗りつぶし色、ストローク幅を変更できます。ただし、ほとんどの場合、markHTML要素に使用されているスタイル、つまりテキストの背後に紫色（Chromiumブラウザ）、黄色（Safari）、またはオレンジ色（Firefox）のハイライトが表示されます。
リンクされたテキストが変更されると、強調表示は失敗しますが、ページは引き続き読み込まれます。
テキストフラグメントリンクの作成
テキストフラグメントリンクの作成は簡単です。一番難しいのは、コンテキストメニューで適切なコマンドを見つけることです。編集メニューには関連するコマンドが見つからないからです。まず、目的のテキストを選択し、Controlキーを押しながらクリックして、以下の操作を行います。
- Safariでは、「ハイライト付きリンクをコピー」を選択します。このコマンドは、iPhoneとiPadのSafari、およびこれらのデバイスでWebKitを使用する他のブラウザでも利用できます。
- Brave 以外の Chromium ブラウザでは、「ハイライトにリンクをコピー」を選択します。
- Brave では、Google の Link to Text Fragment 拡張機能をインストールした後、「選択したテキストへのリンクをコピー」を選択します。
- Firefox または Orion で、Thomas Steiner の Link to Text Fragment 拡張機能をインストールした後、「選択したテキストへのリンクをコピー」を選択します。(Firefox には、ネイティブのテキストフラグメント リンクの作成を有効にする隠し設定調整もあります。)
選択した単語が文書内に複数回出現した場合はどうでしょうか？ブラウザはどの単語を強調表示するかをどのように判断するのでしょうか？STTF仕様では、URLに接頭辞と接尾辞の要素が含まれています。つまり、選択したテキストの前後に、そのテキストの曖昧性を排除する単語をいくつか追加するということです。上のスクリーンショットの記事では、「sidebar」という単語にリンクすると、自動的に次のURLが生成されます。このURLには、対象の単語の両側に3つの曖昧性排除単語が含まれています。
https://tidbits.com/2025/04/10/new-organizational-features-in-photos-in-macos-15-sequoia/#:~:text=The%20next%20two-,sidebar,-sections%20in%20Photos
曖昧なリンクが作成される可能性は否定できませんが、最悪の場合、ブラウザがページ上の間違ったテキストをハイライト表示してしまう可能性があります。それを実現するには、かなりの労力が必要です。数語以上のリンクであれば、独自性は確保されるはずです。
最後にもう1つヒントがあります。テキストフラグメントURLを編集し、追加text=要素を で区切って追加することで、ドキュメントの複数の部分を強調表示できます&。あるURLから要素をコピーして別のURLに貼り付けるという作業は正確さが求められますtext=が、その効果は十分に期待できます。下のリンクで試してみてください。
https://tidbits.com/2025/04/18/staying-the-course-after-35-years-of-tidbits/#:~:text=I%20believe%20we%20can%20best%20contribute%20by%20modeling%20the%20behavior%20we%20want%20to%20see%20in%20the%20world.&text=It%20means%20practicing%20kindness%2C%20decency%2C%20and%20respect%20whenever%20possible.
PDF 内でリンクできますか?
テキストフラグメントリンクは確かに歓迎すべきものですが、比較的短いWebページの場合、ほとんど必要ありません。しかし、PDFの場合は話が別です。「サイバー保険で詐欺からの保護を追加」（2025年4月11日）の中で、グレン・フライシュマン氏は、2024年にアメリカ人が詐欺で120億ドルの損失を被るという主張を裏付けるために、連邦取引委員会の報告書へのリンクを貼っています。しかし、これは92ページにも及ぶPDFで、編集作業中にその数字を確認するのにかなりの時間を要しました。
理想的には、グレン氏はテキストフラグメントリンクを使って、参照しているテキストを正確にハイライト表示できたはずです。しかし残念ながら、テキストフラグメントリンクはPDFでは機能しません。
幸いなことに、調査の結果、例えば#page=6URLに「」を追加することで、文書の6ページ目に直接リンクできることがわかりました。Glennの記事のリンクを以下のURLに更新しました。これで、データを含むページまでスクロールするようになりました。何もハイライトされませんが、目的のページにたどり着けるのは、長いPDFを検索したりスクロールしたりするよりもはるかに便利です。
https://www.ftc.gov/system/files/ftc_gov/pdf/csn-annual-data-book-2024.pdf#page=6
ディープリンクを試してみよう
テキストフラグメントリンクは、Webの進化における小さいながらも重要な一歩であり、テッド・ネルソンのハイパーテキスト構想の一部をついに実現し、特定のコンテンツへの正確なナビゲーションを可能にしました。ディープリンクは、情報共有の効率を高め、長文ドキュメントのユーザビリティを向上させ、読者が最も関連性の高いコンテンツに集中できるようにします。Webから情報を共有する際には、テキストフラグメントリンクの使用をおすすめします。ユーザーは、その利便性の高さに気づかないかもしれませんが、参照している情報を探す手間が省けることを喜ぶでしょう。