Визначення посилань в HTML виконується за допомогою елементу a. Перш ніж я покажу вам його використання, кілька загальних порад щодо гіперпосилань. Обов'язково обдумайте хороші текстові посилання. Звичайно, нікому не буде допомогти звичайний назад. (Оскільки коли відвідувач приходить з зовнішнього сайту, він, як правило, не знає, що означає назад). Спробуйте вибирати описові текстові посилання.
Гіперпосилання в HTML завжди слідують одному й тому ж принципу.
<a href="videos.html">Поточні відео</a>
Елементу a присвоюється атрибут href. Цей href, з свого боку, очікує значення відповідного посилання. У попередньому прикладі було створено посилання на файл videos.html. Він знаходиться у тій же папці, що і файл HTML, в якому було визначено гіперпосилання.
При визначенні гіперпосилань застосовуються ті ж правила, які були представлені у зв'язку з вставленням зображень.
До речі, ви можете визначати не лише внутрішні посилання проекту. Також можна встановлювати гіперпосилання на зовнішні файли та домени.
<a href="http://www.psd-tutorials.de">PSD-Tutorials.de</a>
Текст між відкриваючим <a> та закриваючим </a> є, кінець-кінцем, текстом посилання. За замовчуванням, цей текст відображається браузерами підкресленим.
Вказування цільового вікна
Коли ви натискаєте на гіперпосилання, цільове посилання відкривається в поточному вікні браузера. Зазвичай це абсолютно нормально. Але може трапитися так, що, наприклад, ви встановили посилання на зовнішній домен. Якщо відвідувач клікає на це посилання, цільове посилання має відкриватися в новому вікні браузера або у вкладці. Перевага цього варіанту полягає в тому, що ваш веб-сайт залишається відкритим у фоновому режимі.
Утім, вам не слід відкривати кожне гіперпосилання на вашому сайті у новому вікні, оскільки відвідувачі можуть дуже швидко подратувати від цього.
За допомогою атрибуту target елементу a можна визначити цільове вікно, в якому має відкриватися відповідне посилання. При цьому HTML спочатку пропонує три стандартні значення для target.
• _blank – Цільове посилання відображається в новому вікні браузера.
• _self – Відкриває цільове посилання в поточному вікні браузера.
• _parent – Тут можна вийти зі спеціального вікна. (Зверніть увагу, що в HTML5 фрейми не підтримуються. Взагалі краще не застосовувати цю техніку, оскільки існують кращі альтернативи. Хтось, хто хоче детальніше ознайомитися з методами використання фреймів, може знайти відповіді, наприклад, на сторінці http://de.wikipedia.org/wiki/Frame_(HTML)).
• _top – Це також використовується у зв'язку з фреймами. Ви можете з використанням цього відкрити цільове посилання поза набором фреймів.
Ось приклад того, як можна використовувати атрибут target:
<a href="http://www.psd-tutorials.de" target="_blank">PSD-Tutorials.de</a>
У цьому випадку цільове посилання http://www.psd-tutorials.de відкриється в новому вікні/вкладці. Той же ефект можна досягнути, використовуючи не зарезервоване ім'я, але призводити використати _blank. Але, якщо ви використовуєте target, раджу використовувати одне з зарезервованих імен.
Визначення базового посилання
Ви можете визначити в HTML-документі в області head так звану базу посилань. Така база посилань забезпечить відображення всіх цільових посилань у певному вікні браузера. Це, звичайно ж, знову ж таки в першу чергу цікаво в поєднанні з фреймами.
Проте практичним це виявиться і в тому випадку, коли, наприклад, ви хочете відображати усі посилання у новому вікні браузера за допомогою _blank. Припустимо, ви уявляєте собі список посилань. Якщо їх цільові посилання завжди мають відкриватися у новому вікні, це виглядатиме наступним чином:
<a href="http://www.facebook.com/psdtutorials" target="_blank">http://www.facebook.com/psdtutorials</a> <br /> <a href="http://www.facebook.com/psdDarkArt" target="_blank">http://www.facebook.com/psdDarkArt</a> <br /> <a href="http://www.facebook.com/HowToNetzwerk" target="_blank">http://www.facebook.com/HowToNetzwerk</a>
Отже, вам доведеться призначити атрибут target кожній визначеності a.
Як бачите, це не дуже ефективно. І це стає ще менш ефективним, коли через кілька місяців ви вирішите, що цільові посилання необхідно відкрити не в новому вікні, а вже в поточному. Тоді вам доведеться виправляти атрибути target всіх посилань. Проте цього можна уникнути за допомогою вищезгаданої бази цільових вікон. Це визначається за допомогою елементу base всередині області head. Елементу base привласнюється атрибут target з бажаним значенням. Ось приклад того, як це може виглядати:
<!DOCTYPE html> <html lang="ua"> <head> <title>PSD-Tutorials.de</title> <meta charset="UTF-8" /> <base target="_blank"> </head> <body> <a href="http://www.facebook.com/psdtutorials">http://www.facebook.com/psdtutorials</a> <br /> <a href="http://www.facebook.com/psdDarkArt">http://www.facebook.com/psdDarkArt</a> <br /> <a href="http://www.facebook.com/HowToNetzwerk">http://www.facebook.com/HowToNetzwerk</a> </body> </html>
Це заощаджує вам чимало часу при письмі.
Визначення якорів
Ви вже бачили, як ви можете створити посилання на інші файли. У HTML-файлі також можна визначити так звані якорі. Після цього ви можете створювати посилання на ці самі якорі. Це дуже зручно, наприклад, на обширних сторінках. Таким чином, на початку документа можна визначити зміст, за допомогою якого відвідувачі можуть швидко переходити до релевантних для них місць, не прокручуючи вікно браузера.
Якорі створюються за допомогою елемента a. Однак визначення якорів не отримує атрибута href, а отримує атрибут з ім'ям name.
<a name="seitenanfang">Зміст</a> <a name="kapitel1">Зміст Розділу 1</a> <p>Тут іде багато тексту.</p> <a name="kapitel2">Зміст Розділу 2</a> <p>Тут іде багато тексту.</p>
Імена якорів можна обирати на свій розсуд. Та я рекомендую вибирати їх якнайкоротше, використовуючи лише малі літери і уникайте спеціальних символів.
Для посилання на якорі слід визначити звичайне гіперпосилання, так як це було показано в початку цього посібника.
<a href="#seitenanfang">До початку сторінки</a>
В атрибуті href значенням є ім'я якоря. Тут важливо, що до імені якоря передує хештег.
До якорів можна встановлювати посилання навіть між файлами. У наступному прикладі я розглядаю, що існує файл news.htm, який знаходиться в тій же текі, що і основний HTML-файл. У news.htm було визначено якір seitenanfang. Щоб посилатися на нього, після назви цільового файлу (news.htm) записується хештег. Після цього слідує ім'я якоря.
<a href="news.htm#seitenanfang">До початку сторінки</a>
Отже, ви легко можете встановлювати посилання на якорі в будь-якому файлі.
