Ссылки — это то, что сделало интернет интернетом. Без ссылок страницы были бы изолированными документами. Тег <a> (от англ. anchor — якорь) создаёт гиперссылки для перехода на другие страницы, сайты или фрагменты текущей страницы.

1. Простая ссылка — атрибут href

Атрибут href (hypertext reference) указывает адрес, куда ведёт ссылка.

<a href="https://example.com">Перейти на example.com</a>

Как это выглядит в браузере:

2. Абсолютные ссылки

Абсолютные ссылки содержат полный адрес (с https:// или http://). Они ведут на другие сайты.

<a href="https://google.com">Google</a>
<a href="https://yandex.ru">Яндекс</a>

Как это выглядит в браузере:

3. Относительные ссылки

Относительные ссылки указывают путь внутри вашего сайта. Они не содержат протокола и домена.

<a href="/index.html">Главная</a>
<a href="/lectures/web/html/lecture-html-1.html">Первая лекция по HTML</a>

Как это выглядит в браузере:

4. Открытие ссылки — атрибут target

Атрибут target указывает браузеру, где открыть ссылку. Это подсказка, а не жёсткая команда: пользователь может переопределить поведение (например, кликнуть с Ctrl или изменить настройки браузера).

Возможные значения:

• _self — открыть в той же вкладке (это значение по умолчанию, его можно не писать)
• _blank — открыть в новой вкладке
• _parent — открыть в родительском фрейме (используется редко)
• _top — открыть во всё окно, игнорируя фреймы

<a href="/index.html">Откроется в этой же вкладке (target="_self" по умолчанию)</a>
<a href="/index.html" target="_blank">Откроется в новой вкладке (если браузер разрешает)</a>

Как это выглядит в браузере:

5. Ссылка на фрагмент страницы (якорь)

Можно ссылаться на конкретное место внутри страницы. Для этого у целевого элемента должен быть атрибут id.

<h2 id="chapter1">Глава 1</h2>
...
<a href="#chapter1">Перейти к главе 1</a>

Как это выглядит в браузере:

6. Ссылка на email — mailto:

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

<a href="mailto:info@example.com">Написать нам</a>

Как это выглядит в браузере:

7. Ссылка-кнопка (стилизация через CSS позже)

Сейчас ссылка выглядит как обычный текст. Когда выучите CSS, сможете превращать ссылки в кнопки, менять цвета, убирать подчёркивания.

8. Что нельзя делать со ссылками

• Вкладывать одну ссылку в другую — <a><a>...</a></a> запрещено.
• Ссылаться на пустой href="" — это не ссылка, а просто текст.
• Забывать закрывающий тег </a> — тогда ссылка «съест» весь следующий контент.