HTML-ссылка

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

Из чего собрана ссылка

Минимальная рабочая конструкция состоит из тега, адреса и видимого текста:

<a href="/uslugi/audit/">Аудит сайта</a>

Здесь три смысловые части, и каждая решает свою задачу:

• тег a — сама сущность перехода. Именно его ищет поисковый робот, когда собирает карту связей внутри сайта;
• атрибут href — адрес назначения. Без него тег превращается в обычный кусок текста: браузер не сделает его кликабельным, робот не пойдёт дальше;
• анкор — то, что человек видит и на что нажимает. Текст между открывающим и закрывающим тегом.

Дополнительно к этому добавляются атрибуты: title, rel, target. Они не обязательны, но каждый меняет поведение — либо для пользователя, либо для поисковой системы, либо для безопасности.

href: адрес, от которого зависит всё остальное

Атрибут href принимает не только адреса страниц. Практически востребованных вариантов несколько:

• страница сайта: href="/kontakty/";
• внешний ресурс: href="https://example.ru/page/";
• якорь внутри текущей страницы: href="#tseny" — переход к блоку с id="tseny";
• телефон: href="tel:+79001234567";
• почта: href="mailto:info@example.ru";
• файл на скачивание: href="/files/price.pdf".

Отдельно стоит запомнить конструкцию href="#" — это ссылка в никуда. Её ставят, когда нужен кликабельный элемент, а адрес придумывать лень: дальше обработчик на скрипте делает всю работу. Для робота такая запись означает «переход на ту же самую страницу», то есть не означает ничего. Если так собрано меню или пагинация — раздел не обходится.

Анкор: видимый текст, который передаёт смысл

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

Поэтому «здесь», «тут», «подробнее», «читать далее» внутри сайта работают вхолостую. Они не сообщают ни роботу, ни читателю, куда ведут. Формулировка «подробнее о настройке контекстной рекламы» сообщает и то и другое, при этом занимает столько же места в макете.

Важная деталь: анкор — это весь текст внутри тега, включая вложенные элементы. Если внутрь a попал заголовок, картинка и абзац описания, всё это станет анкором целиком. В карточках товара и в блоках «Читайте также» это частая ситуация — оборачивают всю карточку, и анкор получается длинным и мусорным. Лучше оборачивать заголовок карточки, а не весь блок.

Атрибут title: когда он нужен, а когда мешает

Атрибут title показывает всплывающую подсказку при наведении курсора:

<a href="/uslugi/audit/" title="Что входит в аудит и сколько он занимает">Аудит сайта</a>

Это подсказка для человека, а не инструмент продвижения. На смартфонах наведения нет вовсе, значит на мобильном трафике атрибут не показывается никому. Дублировать в нём анкор бессмысленно: подсказка повторит то, что и так написано. Ставить его имеет смысл там, где анкор короткий и требует пояснения — например, ссылка на документ, где полезно указать формат и объём файла.

Отдельно: title не заменяет alt у картинки и не является заменой понятного текста ссылки.

Абсолютные и относительные адреса

Относительный адрес указывает путь от корня сайта или от текущей папки: /blog/html-ssylka/. Абсолютный содержит протокол и домен целиком: https://example.ru/blog/html-ssylka/.

Место	Какой адрес	Почему
Ссылки в тексте страниц	Относительный	Не ломается при смене домена и при работе на тестовом поддомене
Меню, каталог, карточки	Относительный	Одна и та же вёрстка работает и на боевом, и на копии
Тег canonical	Абсолютный	Указание на единственный правильный адрес должно быть однозначным
Карта сайта XML	Абсолютный	Формат не допускает других вариантов
Микроразметка	Абсолютный	Данные читаются вне контекста страницы
Правила переадресации	Абсолютный	Правило срабатывает на уровне сервера, где текущей страницы нет
Открытые графы для соцсетей	Абсолютный	Внешний сервис не знает, откуда достраивать путь

Логика простая: внутри HTML-документа браузер и робот знают, на каком домене находятся, и достроят путь сами. Всё, что уезжает за пределы страницы — переадресации, карта сайта, разметка, передача в соцсети — должно нести полный адрес, потому что достраивать его будет некому.

Ещё одна ловушка — протокольно-относительный адрес вида //example.ru/page/. Он подставляет текущий протокол. На сайте, который уже переехал на защищённое соединение, такая запись безопасна, но в переадресациях и в разметке её лучше не использовать: слишком много мест, где протокол определяется непредсказуемо.

Тему разбирал отдельно: «Сквозная ссылка».

Атрибут rel: что вы сообщаете поисковой системе

Через rel вы помечаете характер ссылки. Это способ сказать: «ссылка стоит, но я за неё не ручаюсь» или «это оплаченное размещение».

Значение	Что означает	Где ставить
nofollow	Не подтверждаю этот ресурс, не считайте ссылку моей рекомендацией	Ссылки на сомнительные источники, служебные разделы, внешние сервисы
sponsored	Размещение оплачено или является частью партнёрского соглашения	Реклама, партнёрские программы, платные обзоры
ugc	Содержимое создано пользователями	Комментарии, отзывы, форум, профили
noopener	Открытая вкладка не получает доступ к странице-источнику	Обязательно при target="_blank"
noreferrer	Целевой сайт не узнает, откуда пришёл переход	Вместе с noopener, когда источник скрывать не жалко

Значения комбинируются через пробел: rel="nofollow sponsored noopener".

Практический смысл для владельца сайта такой. Реклама и оплаченные размещения должны помечаться — это не рекомендация, а требование поисковых систем, и неисполнение рано или поздно оборачивается санкциями за продажу ссылок. Пользовательский контент помечается автоматически большинством движков; если у вас открытые комментарии без такой пометки, вы бесплатно раздаёте вес спамерам. Внутренние ссылки на служебные страницы вроде корзины или личного кабинета проще закрывать не через nofollow, а не выводить их роботу вовсе.

Важно понимать ограничение: nofollow не запрещает роботу перейти по адресу. Это подсказка о доверии, а не блокировка обхода. Если страницу нельзя показывать в поиске — закрывайте её мета-тегом, а не атрибутом ссылки.

noopener и noreferrer: почему это не мелочь

Когда ссылка открывается в новой вкладке, у открытой страницы появляется программный доступ к вкладке-источнику. Через этот доступ чужой сайт может подменить адрес исходной страницы — человек вернётся на вкладку и увидит вместо вашего сайта копию с формой входа. Атрибут noopener обрывает эту связь.

Современные браузеры добавляют такое поведение по умолчанию для target="_blank", но полагаться на это не стоит: часть аудитории сидит на старых версиях, а часть ссылок открывается через скрипты, где умолчание не работает. Правильный вид внешней ссылки:

<a href="https://example.ru/" target="_blank" rel="noopener noreferrer">Название ресурса</a>

Разница между двумя значениями: noopener закрывает доступ к вкладке, noreferrer дополнительно скрывает источник перехода. Второе стоит ставить не всегда — если вы ссылаетесь на партнёра, ему полезно видеть, что трафик идёт от вас, и в своей аналитике он этот переход зачтёт. При noreferrer переход упадёт в прямые заходы.

Открывать в новой вкладке или нет

Правило, которое работает почти всегда: внешние ссылки — в новой вкладке, внутренние — в текущей.

Логика за этим такая. Уводя человека на чужой сайт, вы теряете сессию: кнопка «назад» уже не спасает, потому что за время на чужом ресурсе человек мог уйти дальше по цепочке. Новая вкладка сохраняет ваш сайт открытым.

Внутри сайта всё наоборот. Открытие каждой карточки в отдельной вкладке ломает привычный сценарий: у человека через пять минут двенадцать вкладок, а кнопка «назад» не возвращает к списку, потому что списка в истории нет. На смартфоне это ещё заметнее — переключение между вкладками там неудобное.

Исключение из внутреннего правила — документы и файлы. Прайс в формате PDF, договор, инструкция: их логично открывать отдельно, чтобы человек не терял место, откуда пришёл.

Почему ссылка обязана быть тегом a с адресом

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

Конструкция вида <div class="card" onclick="location.href='/tovar/123/'"> для человека — ссылка. Для поисковой системы — просто блок с текстом. В нём нет тега a и нет атрибута href, значит связи между страницами не существует. Робот адрес не увидит и по нему не пойдёт.

Последствия предсказуемые:

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

Отдельная разновидность той же проблемы — ссылка-заглушка с адресом # и обработчиком, который подставляет настоящий адрес при клике. Тег правильный, но href пустой, и результат тот же самый.

Смежный материал по теме — «Безанкорная ссылка».

Меню и фильтры на скриптах: откуда берутся сироты

Чаще всего дефект встречается в трёх местах.

Выпадающее меню. Верхний уровень сделан ссылками, а второй и третий подставляются скриптом при наведении. В коде страницы этих адресов нет — они появляются только после действия пользователя. Категории третьего уровня оказываются отрезанными.

Фильтры каталога. Нажатие на «Цвет: синий» меняет выдачу через запрос к серверу без перезагрузки, адрес в браузере переписывается скриптом. Если полезная комбинация фильтров должна попадать в поиск, для неё нужна нормальная ссылка с адресом, а не только обработчик.

Пагинация. Кнопка «Показать ещё» подгружает следующую порцию товаров. Страниц два, три, четыре в коде нет вообще — робот видит только первый экран каталога. Решение — оставить рядом обычную постраничную навигацию тегами a, даже если визуально она уступает кнопке.

Проверить это можно без разработчика: откройте исходный код страницы через сочетание клавиш и поищите в нём адрес нужного раздела. Если адреса в коде нет — робот его тоже не найдёт.

Какие анкоры работают, а какие нет

Плохой анкор	Рабочий вариант	В чём разница
Подробнее	Как мы делаем технический аудит	Второй сообщает содержание целевой страницы
Здесь	Прайс на продвижение интернет-магазина	Понятно до нажатия, что откроется
Читать	Разбор ошибок в карточках товара	Работает и для человека, и для робота
https://example.ru/uslugi/seo/	Услуги SEO-продвижения	Голый адрес не читается и рвёт вёрстку на мобильном
Продвижение сайта Москва недорого заказать цена	Продвижение сайта в Москве	Перечисление ключей выглядит спамно и портит текст
Кликните по этой ссылке	Скачать чек-лист проверки ссылок	Описан результат действия, а не само действие

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

Обратное тоже верно: если на одну и ту же страницу со всех разделов ведёт ссылка с идентичным переспамленным анкором, это выглядит искусственно. Формулировки стоит варьировать естественно — так, как их произнёс бы человек в контексте конкретного абзаца.

Ссылки с картинок: анкором служит alt

Когда внутрь тега a помещена картинка, видимого текста нет. Роль анкора берёт на себя атрибут alt:

<a href="/uslugi/audit/"><img src="/img/audit.jpg" alt="Технический аудит сайта"></a>

Если нужна помощь по теме — мой курс по SEO.

Пустой alt в такой конструкции означает ссылку вообще без анкора. Это типовая ситуация в баннерах на главной, в блоках рекомендаций и в плитке категорий: картинки красивые, атрибуты не заполнены, и все эти переходы не несут никакого смысла.

Заполнять alt надо по описанию того, куда ведёт ссылка, а не по описанию картинки. Для баннера «Скидка 20% на аудит» с ссылкой на страницу услуги подпись «баннер акции» бесполезна, а «Аудит сайта со скидкой» работает.

Внутренние ссылки как бесплатный ресурс

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

Три задачи, которые они решают одновременно:

Если нужны детали, смотрите «Чистый html код — влияние на SEO продвижение».

• распределение веса. Главная и популярные статьи накапливают авторитет, а через ссылки он перетекает на страницы услуг и товаров. Раздел, на который ведут две ссылки, и раздел с тридцатью входящими — для поисковой системы разные по значимости;
• доступность для робота. Обход идёт по ссылкам. Страница, до которой нельзя дойти переходами от главной, обходится редко и обновляется в индексе с большой задержкой;
• удержание людей. Ссылка по теме в середине текста продлевает визит и ведёт человека к странице, где он может оставить заявку.

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

Типичные ошибки со ссылками

Битые ссылки. Адрес отвечает кодом 404. Человек упирается в тупик, робот тратит на это ресурс обхода. Появляются они обычно после смены адресов разделов и после удаления товаров.

Цепочки переадресаций. Ссылка ведёт на адрес, который переадресует на второй, тот на третий. Каждое звено — задержка и потеря части веса. В коде ссылок надо ставить конечный адрес, а не первый в цепочке. Особенно часто это тянется с переезда на защищённое соединение: старые ссылки указывают на незащищённый вариант с www, а оттуда идёт двойная переадресация.

Ссылки на страницы с запретом индексации. Вы направляете вес на страницу, которая в поиске участвовать не будет. Это не нарушение, но трата ресурса впустую.

Ссылка страницы на саму себя. Классика — активный пункт в хлебных крошках или в меню, который остаётся кликабельным. Смысла в переходе нет, а вес размывается.

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

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

Ссылки в JavaScript-объектах. Адреса лежат в массиве данных, откуда их подставляет скрипт. Для робота это текст, а не связь между страницами.

Как проверить ссылки на сайте краулером

Ручная проверка бессмысленна уже на сотне страниц. Нужен обход всего сайта программой-краулером — она проходит по ссылкам так же, как робот, и собирает отчёт.

Что смотрим	Норма	Что делать при отклонении
Коды ответа целевых адресов	200	404 — исправить или убрать ссылку; 5xx — разбираться с сервером
Переадресации в ссылках	Нет	Заменить адрес на конечный, куда ведёт цепочка
Длина цепочки переадресаций	Не больше одного шага	Переписать правила на сервере напрямую
Страницы без входящих ссылок	Нет	Найти, откуда на них должны вести переходы, и поставить ссылки
Глубина вложенности	До 3-4 кликов от главной	Добавить ссылки из меню, категорий, статей блога
Анкоры-дубли	Одинаковых мало	Переписать «подробнее» и «читать далее» на осмысленные
Пустые alt у ссылок-картинок	Нет	Заполнить по смыслу целевой страницы
Ссылки на закрытые от индексации страницы	Единичные	Проверить обоснованность, лишние убрать
Внешние ссылки без rel	Проверены вручную	Рекламные пометить sponsored, сомнительные — nofollow

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

Порядок работы, если разбираете ссылки впервые

Последовательность, которая даёт результат быстрее всего:

1. Обойти сайт краулером и выгрузить все ссылки с кодами ответов.
2. Починить битые — начиная с тех, что стоят в меню и шаблонных блоках: они повторяются на каждой странице.
3. Убрать переадресации из кода ссылок, поставив конечные адреса.
4. Сверить список страниц из карты сайта со списком найденных обходом. Разница — это сироты.
5. Для каждой сироты найти логичное место, откуда на неё поставить ссылку.
6. Проверить внешние ссылки и расставить rel там, где это рекламные или пользовательские размещения.
7. Пройтись по анкорам «подробнее» и «здесь» и переписать их.

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

Частые вопросы

Закрывать ли внешние ссылки через nofollow, чтобы не терять вес?
Массово — нет. Ссылки на авторитетные тематические источники в поисковых системах не считаются потерей и работают на доверие к материалу. Помечать нужно рекламу, партнёрские размещения и пользовательский контент.

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

Ссылка на PDF-документ передаёт вес?
Да, документы индексируются и участвуют в передаче веса. Но целевой страницей в поиске будет сам файл, а не сайт, поэтому важное содержание лучше дублировать обычной HTML-страницей.

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

Влияет ли открытие в новой вкладке на позиции?
Напрямую нет. Косвенно да: если внутренние переходы открываются новыми вкладками, поведение ухудшается — люди путаются и уходят быстрее, а поведенческие сигналы поисковые системы учитывают.

Коротко

• Рабочая ссылка — это тег a с заполненным href. Блок с обработчиком клика поисковая система переходом не считает.
• Внутри страниц ставьте относительные адреса, в переадресациях, разметке и карте сайта — только абсолютные.
• Помечайте рекламу через sponsored, пользовательский контент через ugc, а к target="_blank" всегда добавляйте noopener.
• Внешние ссылки открывайте в новой вкладке, внутренние — в текущей; исключение только для файлов и документов.
• Анкор должен описывать целевую страницу: «подробнее» и «здесь» не работают, а у ссылок-картинок анкором служит alt.

Проверить внутренние ссылки и найти страницы-сироты можно через бесплатный аудит.

9:44

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