HTML5 ссылки: Полное руководство

Типы ссылок

Существуют два основных типа ссылок: ссылки для перехода на другую страницу и ссылки для перехода внутри страницы.

Ссылки на другие страницы

Ссылки создаются с помощью тега <a>. Сам тег <a> не влияет на отображение, он лишь обозначает ссылку. Для работы необходим атрибут href, указывающий URL целевой страницы.

Пример ссылки на Google:

<a href="https://www.google.com">Google</a>

Дополнительные атрибуты

Атрибут target

Для открытия ссылки в новой вкладке используется target="_blank":

<a href="https://example.com" target="_blank">Ссылка на Example</a>

target принимает значения _blank, _self, _parent, _top. По умолчанию — _self (текущее окно). _parent и _top связаны с фреймами (устаревший элемент, не рекомендуется из-за негативного влияния на SEO).

Атрибут title

title добавляет подсказку при наведении курсора. Используется с любым HTML-тегом.

Пример:

<a href="https://www.google.com" title="Переход на Google">Google</a>
<p title="Проверка">Проверка</p>

Ссылки внутри страницы

Для ссылок внутри страницы используется символ # (решётка) в href, за которым следует идентификатор элемента (атрибут id) целевого блока.

Пример:

<h2 id="example">Заголовок</h2>
<a href="#example">Переход на заголовок</a>

Ссылка переводит на заголовок с id="example" без перезагрузки. Для фрагмента URL в href указывается # и имя фрагмента (например, href="#example"). Для перехода на другой сайт и его фрагмент в href указывается полный URL, а после # — идентификатор фрагмента. Страница перезагрузится.

Ссылки для email

Для создания ссылки, открывающей почтовый клиент с заполненными полями «Кому» и «Тема», используется mailto:

<a href="mailto:example@mail.ru">Написать письмо</a>

При клике откроется почтовый клиент с адресом получателя example@mail.ru. Можно добавить параметры для темы и тела сообщения.

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