Как сделать ссылку на сайт

Ссылку на сайт можно сделать множеством способов. Самые распространенные из них:

  • при помощи внутреннего функционала текстового редактора;
  • html-тегом;
  • скриптом.

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

Ниже рассмотрим каждый из вариантов более детально. Вопросы задавайте в комментариях.

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

В большинстве современных текстовых редакторов, таких как MS Word, Libre Writer и аналогах, для создания активной гиперссылки, ведущей на сайт в Интернете, существует специальная иконка.

Пиктограмма «Ссылка» в MS Word.

Справка. Аналогичную пиктограмму можно найти в административных панелях CMS сайтов (Битрикс, WordPress, Amiro и т.д.) при форматировании текста в Визуальном редакторе.

Порядок действий:

  1. Открываем установленный на компьютере текстовый редактор.
  2. Выделяем в тексте слово или фразу, которую хотим сделать ссылкой.
  3. Щелкаем по пиктограмме «Ссылка» и в появившемся окне вводим адрес сайта или файла в Интернете, на который ссылаемся.
  4. Нажимаем кнопку ОК, чтобы сохранить результат.

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

Это можно использовать в rtf и pdf-файлах (прайсах, каталогах, отчетах и т.д.), работа с которыми идет в электронном виде.

Справка. При печати эффект активности у ссылки пропадёт и останется лишь выделенный другим цветом текст.

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

Пиктограмма «Вставить/изменить ссылку» в CMS WordPress.

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

Справка. Ссылкой можно делать не только слова или фразы, но и картинки.

Сокращение ссылок

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

Полезно это по ряду причин:

  • Адрес получается сильно короче. Его проще ввести вручную, не налепив в процессе ошибок.
  • В некоторых случаях это позволит оценить число переходов (есть сервисы сокращения со специальным встроенным трекером).

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

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

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

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

Вот несколько сервисов для сокращения:

  • https://bitly.com/ (после регистрации доступна статистика переходов);
  • https://clck.ru/ (автоматически генерирует еще и QR-код в добавок к укороченному адресу, сервис Яндекса);
  • https://vk.cc/ (не откроется без авторизации во Вконтакте).

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

Скриншот «сокращалки» Вконтакте.

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

HTML-разметка и создание ссылок на сайтах

В рамках сайта вариантов становится больше и тут помимо описанного выше варианта с Визуальным редактором CMS можно использовать тег html-разметки <a>, добавляя нашей ссылке различные свойства и параметры. Можно менять цвет, реакцию курсора, то, как именно откроется указанный адрес и ряд других вещей. Сильно в техническую сторону уходить не будем. Кому интересны все параметры html-тегов и работа с ними, рекомендую почитать специализированную литературу: учебник или справочник.

Здесь же мы рассмотрим лишь пару моментов и общий вид ссылки в виде тега <a>:

<a href="https://yandex.ru/" target="_blank">Анкор</a>

В кавычках после слова href вместо адреса главной страницы Яндекса (https://yandex.ru/) вставляется нужный путь сайта или документа, который будет открываться по нашей ссылке.

Указав параметр target="_blank" (с нижним подчеркиванием), ссылка будет открываться в отдельной вкладке или окне браузера. Это используется для перехода на чужие сайты, чтобы посетитель не потерял то место, откуда он перешел. Для внутренних переходов внутри своего сайта эту штуку убираем.

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

Всё, что находится рядом с тегом <a>, но за его пределами, называют «околоссылочный текст». В нашем случае его нет и при публикации на сайт описанная выше ссылка выглядит так:

Скриншот активной ссылки на сайте.

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

Скриншот активной ссылки с проработанным анкором и околоссылочным текстом.

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

Через тег <a> можно создать активную ссылку на:

  • страницу своего или чужого сайта;
  • документ в интернете;
  • автоматический набор номера телефона (полезно для магазинов и сайтов услуг);
  • вход в чат WhatsApp, Telegram и т.д.

Переходы между страницами одного сайта

В качестве адресов ссылок для переходов в рамках одного сайта иногда используют укороченный URL-путь, в котором не фигурирует домен, вида:

/index.html

Важно! Сокращенные ссылки - это другое. Там полный путь. Это может быть сложно по началу, их надо научиться отличать друг от друга. За пределами конкретного сайта внутренние ссылки с него никуда не ведут. Перейдя по такой из сохраненной на локальный диск странички сайта браузер не сможет ничего открыть и выдаст ошибку.

В остальном без изменений. Та же последовательность действий в текстовом редакторе и аналогичное содержание тега <a> (target="_blank" удаляем, т.к. страницы одного сайта должны открываться в одном и том же окне браузера).

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

JS-ссылки: зачем и кому они нужны

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

На момент осени 2021 ссылки, встраиваемые скриптами, можно встретить в рекламных блоках и виджетах сторонних сервисов, интегрированных в страницы сайта.

Яркий тому пример - блоки Рекламной Сети Яндекса (РСЯ). У себя на сайте владелец размещает специальный javascript и этот скрипт генерирует на странице блок, куда автоматически подгружаются рекламные объявления с активными ссылками на чужие сайты с рекламируемыми кем-то товарами и услугами. Ссылок в этих блоках тьма, при этом они никак не влияют на внутренний вес страниц, куда был поставлен скрипт.

Скриншот рекламного блока РСЯ. Такие ставят для дополнительной монетизации сайта.

Так по аналогии можно распределять внутренний ссылочный вес внутри сайта по своим «секретным» методикам. Только желательно понимать, что это даёт, чем рискуем и стоит ли на это тратить время. Спойлер: норм и без этого.

Сохраните себе статью, чтобы не потерять!

Оцените, насколько понравился материал статьи:

Автор публикации Станислав Заворотнов. Станислав Заворотнов
Вебмастер. Интернет-предприниматель. Первый сайт создал в конце 90-х, еще в школе. Сертифицированный специалист. Участник ежегодных конференций по продажам, SEO, маркетингу, разработке сайтов, арбитражу трафика.
Публикаций: 53

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

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

Политика конфиденциальности