Якорные ссылки в Дзене и обновление расширения ПРОДЗЕН

В Дзене есть одна любопытная, но официально никак не документированная возможность, — можно указать ссылку на статью так, что при переходе на неё откроется конкретная часть публикации.

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

Что такое якорные ссылки

В HTML есть возможность сослаться на любой элемент на статье, если у него указан идентификатор. Ссылки при этом называются «якорными» (Anchor Link), и отличаются от обычных ссылок тем, что в конце ссылки после символа «#» указывается идентификатор.

Вот пример такой ссылки, по которой откроется одна из моих предыдущих публикаций в Дзене, при этом сразу отобразится раздел, озаглавленный «Обновление расширения ПРОДЗЕН 1.17.22»:

https://zen.yandex.ru/media/prodzn/605ef4683d911e18a58a5b00#obnovlenie_rasshireniya_prodzen_11722

И для того, чтобы получить такую ссылку, не нужно особенно мудрить или хитрить

Как найти якорную ссылку в Дзене

Как и в случае с тегами, нужно заглянуть в исходный код страницы.

Вот как выглядит в нашем случае исходный код заголовка:

Обратите внимание на атрибут «id» — именно его значение я прибавил к ссылке на статью после символа «#».

Таким образом, можно получить ссылку на любой заголовок.

Зачем нужны якорные ссылки

Якорные ссылки — это способ навигации внутри страницы. Первое, что приходит в голову — это возможность в перекрёстной ссылке указать какую-то конкретную часть статьи.

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

Кроме того, некоторые авторы любят в начале статьи сделать своебразный навигатор по статье, где перечисляют все разделы.

Так выглядит меню в дзеновской версии этой этой статьи.

В Дзене это можно сделать именно с помощью таких ссылок (правда, это не совсем удобно — каждая ссылка открывается в новом окне).

Якорные ссылки в расширении ПРОДЗЕН

О существовании такой возможности я знаю уже довольно давно, и даже думал добавить их в расширение. Но всё никак не мог придумать, как это сделать ненавязчиво.

В итоге придумал вот такое решение.

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

Такое решение нельзя называть ненавязчивым (меня смущает, что эта ссылка будет видна на всех статьях Дзена), и поэтому я предусмотрел возможность отключения этих ссылок.

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

При таком положении выключателей расширение продолжит работать, но значки ссылок исчезнут из заголовках в статьях

Особенности якорных ссылок

Ну и в завершение, хочу обратить внимание на моменты, о которых нужно знать, если вы решите активно использовать якорные ссылки.

  • Если вы отредактируете заголовок, то якорная ссылка изменится — идентификатор формируется на основе заголовка, потому придётся заново скопировать якорную ссылку.
  • Если сослаться на статью с неправильной якорной ссылкой, то ничего страшного не произойдёт. Просто статья откроется сначала.

Также хочу отметить, что это недокументированная возможность.

Нет никакой гарантии, что в какой-то момент идентификаторы заголовков не исчезнут со страницы публикаций.

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

👉 Подпишитесь на @prodzen в телеграме.

Оставить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Что будем искать? Например,расширение продзен

Мы в социальных сетях