Следующее понятие, с которым мы познакомимся в HTML - это ссылки якоря. Давайте будем разбираться, что это такое и зачем это нужно.

Предположим, что у нас есть большая страница с боковой полосой прокрутки (см. видео). На этой странице находится большое количество контента. 

С этим часто можно встретить на одностраничных сайтах (лэндингах).

Не всегда удобно перемещаться по такому документу с помощью полосы прокрутки. Хорошо было бы дать пользователю возможность кликнув по специальному элементу в меню, по специальной ссылке сразу дать пользователю возможность переместиться в нужное место документа.

Как можно реализовать такой эффект работая только с HTML?

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

Давайте поучимся их создавать.

Перед созданием ссылок якорей, нужно произвести разметку документа. 

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

Для этого нам нужно добавить к каждому из таких разделов атрибут id. Т.е. уникальный идентификатор. 

Добавим этот атрибут каждому подзаголовку, куда мы хотели бы перемещаться:

<h2 id="sub_header1">Подзаголовок 1</h2>

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

Аналогично делаем для остальных элементов h2 на странице.

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

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

Для того, чтобы создать ссылку на элемент, куда мы хотим переместить окно браузера, нам нужно просто указать его значение атрибута id. 

<a href="#sub_header1">Подзаголовок 1</a>

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

Вот таким образом создается ссылка якорь на HTML-странице. Посмотрите видео, чтобы увидеть, как это будет работать.