Гіперпосилання на веб-сторінці
Гіперпосилання — це основа HTML. За допомогою гіперпосилань користувачі можуть переходити з однієї сторінки до іншої.
Існує три основних типи гіперпосилань: внутрішні, зовнішні та відносні.
Внутрішні гіперпосилання — це посилання на об’єкти в межах одного документа. З їх допомогою користувач може переміщатись всередині однієї Web-сторінки. Такі посилання доцільно використовувати на довгих сторінках, щоб мати можливість швидко переміщуватись між їх розділами.
Зовнішні гіперпосилання — це посилання на сторінки, розміщені на іншому Web-сервері.
Відносні або локальні посилання — це посилання на Web-сторінки, розміщені на тому ж сервері. Адреси цих посилань задаються відносно адреси Web-сторінки, на якій вони поміщені.
У HTML для зовнішніх гіперпосилань використовується синтаксис:
<А HREF=»URL»>TeKCT посилання </А>
де URL — повна адреса документа, на який здійснюється посилання. Текст, поміщений у контейнер <А HREF=»URL»> </A>, зображається в роузера з підкресленням та іншим кольором (найчастіше синім). Клацнувши на ньому лівою кнопкою миші, даємо вказівку броузеру завантажити сторінку, розміщену за адресою URL.
Наприклад, вказівкою:
<А HREF=»http://www.firma.com/ibm/computers.html»> Комп’ютери компанії IBM </A>
створюється гіперпосилання на Web-сторінку, розміщену за адресою http://www.ibm.com/ibm/computers.html.
Зв’язуючи гіперпосиланнями сторінки одного сервера, немає необхідності включати в URL доменне ім’я. Наприклад, вказівкою:
<А HREF=”computers.htm”>Koмn’ютери виробництва ІВМ</А>
створюється гіперпосилання на файл computers.htm, який повинен знаходитися на тому самому сервері і в тому самому підкаталозі, що і файл, в якому знаходиться це гіперпосилання.
Якщо файл знаходиться в іншому підкаталозі, то необхідно вказати шлях до нього, наприклад:
<А HREF=”ibm/computers.htm”>Kомn’ютери виробництва ІВМ</А>
Є й інші можливості для спрощення записів довгих адрес URL. Так, наприклад, HTML-код:
<НТМL>
<HEAD>
<TITLE> Основні розділи Web-сайта НПУ ро.М.П.Драгоманова</TITLE>
</HEAD>
<BODY>
<А HREF=”http://www.npu.kiev.ua/REKT0RAT/in-rek.htm”>Peктоpaт</A>
<А HREF=”http://www.npu.kiev.ua/FAKULT/in-fak.Іііт”>Факультети</А>
<A HREF=”http://www.npu.kiev.ua/ASPIRANT/index.htm”>Acnipaнтypa</A>
<A HREF=”http://www.npu.kiev.ua/ABITUR/abit-beg.htm”>Aбітурієнту</A>
</BODY>
</HTML>
можна записати компактніше:
<HTML>
<HEAD>
<TITLE> Основні розділи Web-сайта НПУ імені М.П. Драгоманова</ТIТLE>
<BASE HREF=”http://www.npu.kiev.ua/”>
</HEAD>
<BODY>
<A HREF=”REKTORAT/in-rek.htm”>Peкторат</A>
<A HREF=”FAKULT/in-fak.htm”>Факультети</А>
<A HREF=”ASPIRANT/index.htm”>Acnipaнтypa</A>
<A HREF=”ABITUR/abit-beg.htm”>Aбітурієнту</A>
</BODY>
</HTML>
Тут використовується дескриптор <BASE>, в якому вказано базову адресу URL, відносно якої подаються всі інші відносні адреси Web-сторінок. Зазначимо, що цей дескриптор використовується всередині контейнера <HEAD> </HEAD>, областю дії його є вся сторінка.
Створюючи великі Web-сторінки, необхідно також забезпечити можливість для користувача легко переміщуватись з одного їх розділу до іншого. Це досягається завдяки внутрішнім гіперпосиланням. Для реалізації такого посилання необхідні два елементи: посилання, яке вказує, куди треба перейти, і мітка, яка фіксує місце переходу.
Посилання задається кодом:
<А HREF=»#Haзвa мітки”>Текст посилання</А>
Мітка також використовує контейнер <А></А> і задається так:
<А NAME =”#назва мітки”>текст</А>
Назва мітки — це довільний текст, який не появляється на екрані й однозначно визначає місце переходу. Якщо на сторінці є кілька міток, то всі вони повинні мати різні назви. Символ «#» при описі посилання вказує, що за ним записана назва мітки, а не назва файла.
Приклад використання внутрішніх гіперпосилань:
<HTML>
<HEAD>
<ТITLЕ>Колекція програм мовою VisualBasic</TITLE>
</HEAD>
<BODY>
Нижче наводяться програми мовою VisualBasic:
<BR>
<!—далі створюємо внутрішні гіперпосилання à
<А HREF=”#графік”>Побудова графіків функцій</А><BR>
<А HREF=”#масив”>Сортування масиву</А><BR>
<А HREF=”#рівняння”>Розв’язування квадратних рівнянь</А>
<BR>
<Р>
<!—далі описуємо місця, на які здійснюються посиланняà
<А NAME=»графік”> Побудова графіків функцій – приклад програми</А>
<BR>
(текст програми)
<BR><BR>
<А NАМЕ=”масив”> Впорядкування масиву - приклад програми</А>
<BR>
(текст програми)
<BR><BR>
<А NАМЕ=”рівняння”> Розв’язування квадратних рівнянь – приклад програми</А>
<BR>
(текст програми)
</BODY>
</HTML>
Можна зробити так, щоб після натискування на деякому посиланні звучала музика або відтворювався відеофільм. Посилання на мультимедійні файли .avi, .wav створюються так само, як посилання на HTML-документи. В атрибуті HREF контейнера <А></А> необхідно вказати ім’я файла, в якому міститься потрібна мелодія або відеофільм. Наприклад:
<Р>Натисніть<А HREF=”my_music.wav”>TyT</A>, щоб почути мою улюблену композицію
Файл my_music.wav повинен знаходитись на тому самому сервері, у тому самому каталозі, що і HTML-файл, з якого він викликається. Для створення гіперпосилань на файли мультимедіа, розміщені на інших серверах Internet, використовуються повні URL-адреси.
Часто виникає необхідність включити у Web-сторінку посилання на адресу електронної пошти. Для цього в атрибуті HREF необхідно задати адресу електронної пошти у вигляді «mailto: адреса». Наприклад, щоб створити посилання на адресу moi@npu. Kiev. Ua, необхідно у код сторінки помістити такий дескриптор:
<А HREF=”mailto: moi@npu.kiev.ua”>moi@npu.kiev.ua</A>
згідно з яким роузера відображає текст «moi@npu.kiev.ua» як гіперпосилання. Якщо клацнути на ньому лівою кнопкою миші, броузер відкриє поштову програму в режимі створення листа, і в полі «Адреса:» помістить адресу moi@npu.kiev.ua. Текст, що поміщається в контейнер <А></А>, може бути будь-яким, проте доцільно використовувати адресу E-mail, оскільки не всі користувачі сторінки можуть користуватися поштовими програмами, налагодженими на комп’ютері, з якого переглядається сторінка. Їм необхідно прочитати реальну адресу електронної пошти.