Как поставить якорь HTML
Как создать якорь на сайте для удобной навигации
Якорь на сайте очень полезен, если вы хотите, чтобы в статьях на вашем сайте был удобный переход между пунктами списка. Они перелистывают страницу до нужной точки или открывают нужную страницу, помогая пользователю быстро найти нужную ему информацию.
Теория создания якоря
Если вы пишете свой сайт, то должны были задуматься о том, как сделать навигацию по сайту удобнее. Чтобы пользователю не пришлось искать нужную ему информацию среди всех страниц вашего сайта, лучше всего применить технику "якорь". Она создаст ссылку на какую-либо информацию или документ в любой части вашего сайта.
Для создания якоря нужно два элемента: Часть кода, в которой указывается ссылка на наш якорь, оставленный в другой части сайта. Любая часть кода, в которой можно указать идентификатор - наш якорь.
Сначала нужно создать первую часть якоря - ссылку на него. Ссылка якоря состоит из двух частей: ссылки на страницу и ссылки на якорь. Для этого нужно:
1. Создать тег "a" или любой другой тег, поддерживающий атрибут "href".
2. В этом теге создать атрибут "href".
3. В значении атрибута указать ссылку на страницу сайта.
4. После ссылки указать ссылку на якорь, используя символ "#" и любое имя для якоря (пишутся слитно, пример: "#якорь").
5. Если пропустить 3 пункт и не указать ссылку на страницу сайта - поиск якоря будет произведен по текущей странице. То есть если вы хотите создать ссылку на якорь, находящийся на той же странице - можно не указывать ссылку на саму страницу.
Осталось создать вторую часть якоря - идентификатор. Он указывается к любому тегу в коде сайта, который поддерживает атрибут id. Чтобы создать якорь, нужно:
1. Создать в нужном теге атрибут "id".
2. В атрибуте "id" указать значение имени якоря, которое было указано в предыдущем шаге. (пример: id="якорь")
После этих двух шагов на сайте появляется ссылка, которая перенесет к указанному якорю.
Практическое применение якоря
Рассмотрим, как сделать якорь на конкретном примере.
Имеем простую страницу такого вида: (описание страницы)
У нас есть текст в верхней и в нижней части страницы, множество тегов "br", которые создают дистанцию между текстами. Нам нужно создать якорь, чтобы можно было быстро посмотреть на текст в нижней части.
Для этого создаем после надписи "текст в верхней части" новый тег - "a". В ней создаем атрибут "href". Для того чтобы якорь был удобнее, напишем в ссылке "вниз". Теперь указываем в атрибуте значение "#yakor" - это будет ссылкой на имя якоря.
Первая часть якоря - ссылка на него - готова. Теперь осталось только создать сам якорь. Переходим к нужной части страницы. В данном случае это "текст в нижней части". Так как это простой текст без тега - нам нужно создать его. Для этого заключаем текст в "абзац" - тег "p". В этом теге создаем атрибут "id" и вписываем ему значение "yakor". Значение "yakor" соответствует имени якоря, которое было указано в ссылке.
Теперь наш якорь работает как должен. Пользователи могут быстро перемещаться между верхней и нижней частью страницы, не тратя время на прокрутку. Кроме того, такая навигация делает сайт более удобным и информативным.
