Блог →
Правильные якорные ссылки в Tilda
1. Создайте отдельную якорную ссылку
В Tilda есть специальный блок в категории «Другое» — Т173 «Якорная ссылка»
2. Дайте ссылке название
Название придумывайте осмысленное, чтобы было понятно о чём блок. Например, для блока с услугами назовите ссылку «services» или «uslugi». Скопируйте.
3. Установите ссылку, куда нужно
Скопированное название ссылки установите в элемент, к которому она должна вести: в тексте, элементе в zero-блоке или кнопке. Ссылка должна иметь вид «#services» — с решёткой #.
В тексте
В zero-блоке
В кнопке
4. Проследите, чтобы между ссылкой и блоком был отступ
Я ставлю отступ не менее 30 px, зависит от дизайна.
4. Как поставить отступ
Есть два варианта:
- Добавить отдельный блок
- У вашего блока установить параметры отступов
Отдельны блок — DV05
В настройках блока
5. Готово!
- Понятная и красивая ссылка.
- Блок на комфортном расстоянии от верхнего края браузера.
А что если поставить в качестве якорной ссылки ID блока?
ID всегда уникален. На сайте не может существовать несколько блоков с одинаковым ID. Его нельзя изменить.
Теперь представьте, вы решили переделать блок с услугами на вашем сайте. Старый скрыли, новый добавили. Но у нового блока уже другой ID. Соответственно, все ссылки на услуги перестали работать — и в меню, и расшаренные. Придётся везде менять ссылки и настраивать переадресации.
Давайте усугубим ситуацию. Теперь вы копируете шаблон статьи, где настроены якорные ссылки. И вновь у всех блоков будут новые ID. Значит, вам придётся снова настраивать все якорные ссылки. И так каждый раз, когда создаёте новую статью.
Теперь представьте, вы решили переделать блок с услугами на вашем сайте. Старый скрыли, новый добавили. Но у нового блока уже другой ID. Соответственно, все ссылки на услуги перестали работать — и в меню, и расшаренные. Придётся везде менять ссылки и настраивать переадресации.
Давайте усугубим ситуацию. Теперь вы копируете шаблон статьи, где настроены якорные ссылки. И вновь у всех блоков будут новые ID. Значит, вам придётся снова настраивать все якорные ссылки. И так каждый раз, когда создаёте новую статью.
Отдельная якорная ссылка таких проблем не доставит.
И ещё момент.
Ссылка с ID блока выглядит так — «edemchenko.com/#rec578398835». Цифры не говорят, о чём идёт речь в блоке, а ссылка выглядит не по-человечески.
Ссылка с названием выглядит так — «edemchenko.com/#landing». Понятно, что в блоке говорится о лэндинге.
Поэтому всегда ставьте название ссылки.
И ещё момент.
Ссылка с ID блока выглядит так — «edemchenko.com/#rec578398835». Цифры не говорят, о чём идёт речь в блоке, а ссылка выглядит не по-человечески.
Ссылка с названием выглядит так — «edemchenko.com/#landing». Понятно, что в блоке говорится о лэндинге.
Поэтому всегда ставьте название ссылки.
Примеры
Если меджу ссылкой и блоком не будет отступа, то блок «подъедет» слишком близко к верхнему краю браузера и часть скроется под меню, если оно есть.
Неправильное размещение якорной ссылки
Блок прилип к краю браузера
Ссылка непонятная
Ссылка непонятная
Если между ссылкой и блоком добавить отступ, то блок остановится на комфортном для чтения расстоянии от верхнего края браузера и не скроется под зависающее меню, если оно есть.
Правильное размещение якорной ссылки
Комфортное расстояние от края
Понятная ссылка
Понятная ссылка
Поделиться или сохранить
