Як правильно призначати і використовувати якір HTML?

Сьогоднішньої темою для обговорення буде якір HTML. Даний елемент дозволяє виробляти швидкі переходи як усередині сторінки, так і в зовнішні документи. Якоря досить часто використовуються веб-розробниками. Так як вони допомагають організувати зручний для читачів сайт. У статті буде надано докладний опис цього елемента і приклади ефективного використання.

Опис

Якір HTML - це свого роду унікальна закладка веб-сторінки. Він завжди має своє індивідуальне ім`я, яке не повинно повторюватися на одній сторінці. Основне призначення якоря - швидкий перехід з однієї частини документа до іншої, до певного розташування. Особливу ефективність даний елемент приносить, коли веб-сторінка має великі розміри. Через це користувачам незручно читати вміст сайту. А якір на сторінці HTML дозволяє забезпечити швидкий перехід.

Присвоєння

Щоб створити таку закладку на сторінці можна використовувати два різних методи. Перший полягає у застосуванні атрибута Name, а в другому випадку необхідно вживати атрибут ID. Далі ми розглянемо кожен метод окремо. Перехід в обох випадках відбувається за допомогою тега «a», атрибут якого містить ім`я або ідентифікатор. Наприклад: «a href =" # footer "». Символ # повідомляє браузеру, що посилання введе на якір.

Name

Атрибут Name створений спеціально для створення якоря на сторінці. Його значенням може стати будь-який текст. Даний якір HTML може використовуватися тільки спільно з тегом «a».

Наприклад ви хочете створити закладку в самому кінці вашої сторінки. Вам необхідно помістити тег «a name =" footer "» «/ a» в потрібну вам частину веб-документа. В іншій області сторінки вам доведеться створити посилання на якір, для цього додайте запис «a href =" # footer "» посилання «/ a». При натисканні на цей елемент браузер автоматично переведе вас до тієї частини документа, де стоїть закладка Footer.

ID

Для початку варто сказати, що ID - це ідентифікатор, який не має прямого призначення для створення якорів. Але він дозволяє створювати закладки на всій області документа без створення додаткових посилань. Тобто, ви може застосувати атрибут ID до будь-якого елементу HTML. А потім з використанням тега «a» послатися на нього. Наведемо приклад: елемент «p» знаходиться в середині документа. Щоб перейти до нього з початку сторінки без використання смуг прокрутки, додамо атрибут ID: «p id =" centr "» «/ p». Далі створюємо посилання: «a href =" # centr "» Текст «/ a». Таким чином, ми отримуємо швидкий доступ до будь-якої частини документа. Значенням атрибута ID може бути довільний текст.

Ефективне використання

В HTML посилання-якір дуже часто застосовується для побудови навігації документа. Наприклад, сторінка має величезну кількість текстової інформації, яка в свою чергу поділена на окремі параграфи або глави. Щоб відвідувачам було зручно користуватися сайтом, для швидкого переходу до окремої частини документа необхідно призначити закладки. Для цього в кожному розділі створюємо посилання-якір, або використовуємо ID ідентифікатори. А зверху зробимо навігаційну панель з вмістом всіх посилань. Цікавий той факт, що на якорі можна посилатися з інших веб-сторінок. Досить додати в кінець посилання значення атрибутів Name або ID. Не забувайте додавати символ #. Схема в такому випадку повинна виглядати так: основна посилання # name (id).

Висновок

Якір HTML - це дуже корисний і в деяких випадках навіть необхідний елемент. У статті я представив лише один приклад його ефективного використання. Але насправді такого роду закладки можна застосовувати в багатьох ситуаціях. Головне - зрозуміти їх основну ідею.