Новости и заметки

Как создать ссылку

Что такое ссылка и зачем она нужна

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

Как создать ссылку в HTML

Основной способ сделать ссылку на сайте — использовать тег <a> (anchor). Его синтаксис выглядит так:

<a href="https://example.com">Текст ссылки</a>
Расшифровка:
  • href — это адрес, на который ведёт ссылка (URL);
  • между открывающим и закрывающим тегом <a> размещается кликабельный текст.
Пример:

<a href="https://iwebcat.ru">Создание сайтов Иваново</a>
Результат: Создание сайтов Иваново

Как сделать ссылку, которая открывается в новом окне

Если вы хотите, чтобы ссылка открывалась в новой вкладке браузера, добавьте атрибут target="_blank":

<a href="https://example.com" target="_blank">Открыть сайт в новом окне</a>
Для безопасности добавляют атрибут rel="noopener noreferrer" — он предотвращает передачу данных о предыдущей странице:

<a href="https://example.com" target="_blank" rel="noopener noreferrer">Открыть сайт</a>

Как создать ссылку на e-mail или телефон

Иногда нужно сделать не обычную ссылку на сайт, а кнопку для связи — например, написать письмо или позвонить.
Ссылка на e-mail:

<a href="mailto:info@example.com">Написать письмо</a>
Ссылка на телефон:

<a href="tel:+79109810012">Позвонить</a>
Такие ссылки особенно полезны на мобильных версиях сайтов: при клике сразу открывается почтовое приложение или набор номера.

Как создать ссылку внутри страницы (якорь)

Иногда нужно перейти не на другую страницу, а на определённый участок этой же. Для этого используется якорная ссылка.
Шаг 1. Создайте элемент с id:

<h2 id="kontakt">Контакты</h2>
Шаг 2. Добавьте ссылку на него:

<a href="#kontakt">Перейти к контактам</a>
При нажатии страница автоматически прокрутится к разделу с указанным идентификатором.

Как сделать ссылку в тексте без HTML (например, в Word или CMS)

Если вы работаете не с кодом, а в визуальном редакторе (Word, Tilda, OpenCart, Bitrix и т.д.), алгоритм обычно одинаков:
  1. Выделите нужный текст.
  2. Нажмите кнопку «Вставить ссылку» (обычно значок цепочки).
  3. Введите адрес страницы — например, https://iwebcat.ru.
  4. Нажмите ОК.
Готово! Текст станет кликабельным.

Как создать ссылку на документ или файл

Чтобы сделать ссылку на скачивание файла (например, PDF или архив), достаточно указать путь к нему:

<a href="/files/price.pdf" download>Скачать прайс-лист</a>
Атрибут download позволяет браузеру не открывать файл, а сразу скачать его.

Как оформить ссылку красиво

Обычная ссылка отображается синим цветом и подчёркиванием. Чтобы изменить оформление, используют CSS-стили:

<a href="https://iwebcat.ru" class="btn">Создать сайт</a>

a.btn {
background-color: #2e7dff;
color: white;
padding: 10px 20px;
border-radius: 8px;
text-decoration: none;
}
a.btn:hover {
background-color: #0053cc;
}
Теперь ссылка будет выглядеть как аккуратная кнопка.

Как создать ссылку для SEO

С точки зрения SEO, ссылки играют огромную роль — они помогают поисковикам понять структуру сайта и влияют на ранжирование.

Рекомендации:

  1. Используйте релевантный анкор — текст ссылки должен описывать, куда она ведёт.
  2. ❌ «Подробнее»
  3. ✅ «Подробнее о постельном белье из бязи»
  4. Не злоупотребляйте внешними ссылками.
  5. Чем больше исходящих ссылок, тем меньше вес у каждой из них.
  6. Добавляйте внутренние ссылки.
  7. Это помогает удерживать пользователя и усиливает SEO-вес важных страниц.
  8. Закрывайте служебные ссылки от индексации.
  9. Пример:

<a href="/cart" rel="nofollow">Корзина</a>

Как сделать короткую ссылку

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

Как проверить, работает ли ссылка

Чтобы убедиться, что ссылка корректна:
  • кликните по ней и проверьте, открывается ли нужная страница;
  • наведите курсор — в левом нижнем углу браузера появится адрес назначения;
  • используйте онлайн-проверку ссылок, например https://validator.w3.org/.

Заключение

Теперь вы знаете, как создать ссылку — будь то переход на другой сайт, документ, e-mail или телефон. Главное — указывать корректный адрес, понятный анкор и при необходимости добавлять SEO-атрибуты. Правильно оформленные ссылки делают сайт удобным для пользователей и помогают продвигать его в поиске.
2025-10-27 07:52