Технология текстовых фрагментов в вебе

Text Fragment Directive - это часть стандарта Scroll-to-Text Fragment, разработанного WICG (Web Incubator Community Group). Текстовые фрагменты - это мощное расширение для точного цитирования контента в вебе. Она позволяет создавать ссылки, которые не просто ведут на страницу, а направляют пользователя к конкретному фрагменту текста и визуально его выделяют. Эта функциональность реализована через специальный синтаксис в URL, где указывается целевой текст или диапазон текста.

Текстовые фрагменты впервые появились в октябре 2020 года как экспериментальная функция, изначально поддерживавшаяся преимущественно браузерами на основе Chromium - Chrome, Edge и Opera. Их появление вызвало неоднозначную реакцию со стороны стандартизирующих организаций, включая W3C: предложенное расширение формата URL породило вопросы как в плане безопасности, так и с точки зрения соответствия принципам устойчивой веб-архитектуры. Тем не менее, Google уже тогда начал активно внедрять технологию на практике - начиная с 2020 года поисковая система автоматически добавляла текстовые фрагменты в сниппеты, если запрос пользователя содержал точную цитату или фразу, найденную на целевой странице. С тех пор поддержка постепенно расширилась. К октябрю 2025 года текстовые фрагменты стабильно работают во всех основных браузерах на Chromium, а в Firefox доступны в экспериментальном режиме. В то же время экосистема Apple - включая Safari на macOS и iOS - по-прежнему не реализует эту функциональность.

Текстовые фрагменты представляют собой современное расширение традиционного механизма якорных ссылок, позволяющее не просто перемещать пользователя к определенному элементу на странице, но и выделять произвольный фрагмент текстового содержимого без необходимости наличия у этого фрагмента уникального идентификатора. В отличие от классических якорей, требующих явного присвоения атрибута id HTML-элементу, текстовые фрагменты работают на уровне отображаемого текста.


Браузер, поддерживающий эту функцию, после загрузки страницы сканирует DOM в поисках совпадения с заданной строкой (или диапазоном строк) и, при обнаружении, автоматически прокручивает viewport к нужному месту и визуально выделяет найденный фрагмент. Возможность указания префикса и суффикса (prefix-, target, -suffix) позволяет уточнить контекст поиска, что особенно полезно при наличии нескольких одинаковых фраз на одной странице.HTML-ссылка работает примерно так:Базовый формат выглядит с обязательными и необязательными частями.

#:~:text=[prefix-,]textStart[,textEnd][,-suffix]
Обязательно нужно начало выделяемого текста - textStart, не обязателен конец выделяемого текста (включительно) - textEnd, дополнительные части prefix- - слово или фраза непосредственно перед textStart, -suffix - слово или фраза непосредственно после textEnd. Все части должны быть URL-encoded (например, пробел "%20", кавычки "%22" и т.д.).

#:~:text=текстовые%20фрагменты
Указанный пример найдет и выделит первое вхождение фразы "текстовые фрагменты".

#:~:text=первый%20фрагмент,последний%20фрагмент
Выделит все от "первый фрагмент" до "последний фрагмент", даже если между ними несколько абзацев.

#:~:text=начало-,искомый%20текст,-окончание
Текст найдет "искомый текст", который находится между словами "начало" и "окончание". Это решает проблему неоднозначности. Поиск не требует точного совпадения регистра, но требует последовательности слов. Например, #:~:text=Hello найдет "hello", "HELLO", но не "h e l l o" с пробелами.

#:~:text=первый%20фрагмент&text=второй%20фрагмент
Для выделения нескольких фрагментов в одной ссылке используется символ & между фрагментами.

Браузер обрабатывает Text Fragment, после загрузки DOM браузер проверяет URL на наличие #:~:text=.... Выполняет поиск по текстовому содержимому (только визуально отображаемому). Игнорирует скрытые элементы (display: none, visibility: hidden), содержимое <script>, <style>, <template>, псевдоконтент (::before, ::after).

Браузеры могут по умолчанию выделять совпадающий текст так, как сочтут нужным. Однако для кастомизации этого выделения в CSS предусмотрено правило с псевдоэлементом ::target-text, позволяющее задать собственное оформление найденных текстовых фрагментов.Для большей красоты можно дополнить функциональность, реализовать JavaScript-скрипт. Вот пример, который перехватывает текущее выделение текста и формирует URL с текстовым фрагментом.Система гарантирует, что Text Fragment не отправляется на сервер, обрабатывается только в браузере. Однако злоумышленник может подделать ссылку, чтобы выделить вводящий в заблуждение фрагмент (например, вне контекста). Поэтому некоторые сайты блокируют эту функцию, например можно отключить Text Fragments:или через HTTP-заголовок:

Document-Policy: force-load-at-top
Текстовые фрагменты обрабатываются браузером только после полной загрузки страницы и никогда не передаются на сервер, что минимизирует риски, связанные с утечками данных или инъекциями через URL. Тем не менее, для обеспечения безопасности введены дополнительные ограничения. Например, фрагмент игнорируется, если страница загружена во фрейм (<iframe>) с другого origin - это предотвращает возможные атаки подмены контента (спуфинг). Некоторые браузеры также отключают поддержку текстовых фрагментов на сайтах, работающих по HTTP (в отличие от HTTPS), особенно при наличии редиректов, в ходе которых фрагмент может быть утерян. Сам формат фрагмента имеет ряд технических ограничений: он не поддерживает регулярные выражения или сложные шаблоны поиска, а максимальная длина URL-параметра ограничена - обычно около 4096 символов, в зависимости от браузера. Если указанный текст не найден на странице, браузер просто ничего не делает: выделение не происходит, ошибки не возникает, и пользователь не получает уведомления, реализован "тихий отказ".

Несмотря на отсутствие полной кросс-браузерной поддержки, технология уже зарекомендовала свою практическую ценность. Она широко применяется в тех областях, где критична точность ссылок: в академических цитированиях, технической документации, журналистике и других сферах, требующих прямой привязки к конкретному высказыванию. Следует помнить, что текстовые фрагменты обрабатываются исключительно на стороне клиента: они не передаются на сервер, не влияют на SEO и применяются только к видимому пользователю тексту, игнорируя скрытые или невизуальные элементы DOM-дерева.

Текстовые фрагменты - это изящное и эффективное решение давней проблемы точного цитирования в вебе. Несмотря на оставшиеся ограничения, они уже прочно вошли в современную веб-экосистему, особенно в сценариях поиска и распространения информации.

Комментарии

Добавить комментарий

Для вставки цитаты выделите текст и нажмите сюда

Имя*:

Текст комментария (не более 2000 символов)*:

*Все поля обязательны для заполнения.

Комментарии, содержащие рекламу, ненормативную лексику, оскорбления и т.п., а также флуд и сообщения не по теме, будут удаляться. Нарушителям может быть заблокирован доступ к сайту.