Гіперпосилання

Посилання на файл

Посилання зазвичай виглядає як підкреслений фрагмент тексту, клацаючи на який здійснюється перехід на іншу сторінку, відкривається зображення або завантажується файл. Якщо уявити, що інтернет це величезна мережа з безлічі вузлів, то посилання будуть нитками, що з'єднують всі вузли цієї мережі.

Посилання створюються за допомогою дуже простого і короткого тега <a>. Наприклад, ось так:

Тег <a> без адреси непотрібний, оскільки він описує посилання, яка нікуди не веде. Тому в попередньому завданні текст ніяк не змінювався, навіть після більшу кількість позначок.

Адреса посилання задається за допомогою атрибута href:

<a href="http://vmpdu.blogspot.com"> Блог  ВМПДЮ </a>

Значенням атрибута є URL, який зазвичай називають простою адресою. Адреси бувають різні: абсолютні, відносні, що вказують на сторінку, на файл, зображення, що містять якір і так далі. А значить і посилання може вказувати на будь-який об'єкт в інтернеті.
При переході по посиланню документ за замовчуванням відкривається в поточній вкладці браузера. При необхідності ця умова може бути змінено атрибутом target. Синтаксис наступний:

 <a href="http://vmpdu.blogspot.com" target="_blanc"> Блог  ВМПДЮ </a>

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

Будь-яке посилання на веб-сторінці може знаходитися в одному з наступних станів:

• звичайне посилання

Такий стан характеризується для посилань, які ще не відкривали. За замовчуванням звичайні текстові посилання зображуються синім кольором і з підкресленням.

• відвідане посилання

Як тільки користувач відкриває документ, на який веде посилання, воно позначається як відвідане і змінює свій колір на фіолетовий, встановлений за замовчуванням.

• активне посилання

Посилання позначається як активне при натисканні на нього. Оскільки клацання відбувається досить швидко, подібний стан посилання короткочасний. Колір такого посилання за замовчуванням червоний.

Абсолютні адреси містять в собі протокол, ім'я сервера і шлях. Наприклад, в адресі https://vmpdu.blogspot.com/p/kontakty.html:

Абсолютна адреса однозначно вказує розташування документа. Браузер просто запрошує за вказаним протоколом з зазначеного сервера документ із зазначеним шляхом.

Посилання може вказувати на будь-яку веб-сторінку, на будь-який файл. Якщо клацнути по посиланню, що веде на файл, то браузер запропонує його завантажити.

Однак, якщо браузер вміє цим типом файлів, то вміст файлу відкриється прямо в браузері. Найчастіше так відбувається з зображеннями. Останнім часом браузери навчилися відкривати .pdf файли і багато інших.

Посилання щодо поточного документа

При створенні відносних посилань треба розуміти, яке значення для атрибута href слід вказувати, оскільки воно залежить від вихідного розташування файлів. 
Типові варіанти:

1.         Файли розміщуються в одній папці (рис. 1)

Рис. 1

<a href="target.html">Посилання на файл target.html</a>

2. Файли розміщуються в різніх папках (рис. 2).

Рис. 2

<a href="../target.html"> Посилання на файл target.html </a>

Дві крапки означають вийти з поточної папки на рівень вище.

3. Файли розміщуються в різних папках (рис. 3).

Рис. 3

Якщо вихідний файл знаходиться в двох вкладених папках, то щоб послатися на документ в корені сайту, потрібно повторити написання попереднього прикладу два рази.

<a href="../../target.html"> Посилання на файл target.html </a>

4. Файли розміщуються в різних папках (рис. 4).

Рис. 4

Вихідний файл розташовується в корені сайту, а файл, на який необхідно зробити посилання - в папці. В цьому випадку шлях до файлу буде наступний.

<a href="folder/target.html"> Посилання на файл target.html </a>

5. Файли розміщуются в різних папках (рис. 5)

Рис.5

Кожен файл розташовується в своїй папці і щоб перейти з однієї папки в іншу посилання буде наступним:

<a href="../folder2/target.html"> Посилання на файл target.html </a>

Посилання з якорем

Посилання з якорем зазвичай використовуються для створення навігації усередині сторінки. Наприклад, змісту на початку сторінки з великою статтею.

Посилання з якорем містить символ #, після якого йде ідентифікатор. Ідентифікатор створюється за допомогою атрибута id, який може бути заданий у будь-якого тега.

Можна задати адресу, що складається з одного якоря, наприклад:

<a href="#glava1">Глава 1</a>

При натисканні на таке посилання браузер знайде на сторінці елемент з атрибутом id з значенням glava1 і прокрутить вікно сторінки до нього. Тобто перезавантаження сторінки не відбудеться.

Якір можна використовувати і в абсолютних адресах, тоді після переходу на потрібну сторінку відбудеться прокрутка до заданої частини цієї сторінки.
Приклад:

Завантаження файлу

Браузер самостійно визначає тип документа і відкриває його, якщо може прочитати. Наприклад, при переході по посиланню до текстового документу він відкриється в браузері, а ось zip-архів браузер відкрити не може, тому запропонує користувачеві завантажити його на свій комп'ютер. Для HTML, PDF, текстових документів, зображень, відеофайлів і т. Д. Така поведінка браузера можна змінити і змусити його не відкривати файл за посиланням, а завантажувати його. Для цього до посиланням досить додати атрибут download, як показано в прикладі 4.

Посилання на адресу електронної пошти

Створення посилання на адресу електронної пошти робиться майже також, як і посилання на веб-сторінку. Тільки замість протоколу http вказується mailto, після якого через двокрапку йде сам адреса пошти (приклад 5).

Завдання для самостійного виконання

Завдання №1

1. Відкрити редактор коду HTML.

2. Створти новий документ HTML. Для цього викликати меню, що випадає Файл і вибрати команду Новий (Файл => Новий).

3. Після того, як створиться новий документ зберегти його за допомогою меню Файл і команди Зберегти як (Файл => Зберегти як). При збереженні оберати зі списку Тип файлу - мова гіпертекстової розмітки файл і назвати файл «Anchor_link». Збережіть файл в папку Webdesign.

4. Ввести наступний код в створений документ:

Текст для файлу:

Зміст

Історія
Структура URL
Кодування URL
Історія

URL був винайдений Тімом Бернерс-Лі в 1990 році в стінах Європейської ради з ядерних досліджень в Женеві, Швейцарія. URL став фундаментальною інновацією в Інтернеті.

Спочатку URL призначався для позначення місць розташування ресурсів (найчастіше файлів) у Всесвітній павутині. Зараз URL застосовується для позначення адрес майже всіх ресурсів Інтернету. Стандарт URL закріплений в документі RFC +1738, колишня версія була визначена в RFC 1630.

Зараз URL позиціонується як частина більш загальної системи ідентифікації ресурсів URI, сам термін URL поступово поступається місцем більш широкому терміну URI. Стандарт URL регулюється організацією IETF і її підрозділами.

До змісту
Структура URL

Спочатку локатор URL був розроблений як система для максимально природного вказівки на місцезнаходження ресурсів в мережі. Локатор повинен був бути легко розширюваним і використовувати лише обмежений набір ASCII-символів (наприклад, пробіл ніколи не застосовується в URL). У зв'язку з цим, виникла наступна традиційна форма запису URL:

<схема>://<логін>:<пароль>@<хост>:<порт>/<URL-шлях>?<параметри>#<якір>

До змісту
Кодування URL

Поява адрес URL стало істотним нововведенням в Інтернеті. Однак з моменту його винаходу і донині стандарт URL володіє серйозним недоліком - в ньому можна використовувати тільки обмежений набір символів, навіть менший, ніж в ASCII: латинські букви, цифри і лише деякі знаки пунктуації. Якщо ми захочемо використовувати в URL символи кирилиці, або ієрогліфи, або, скажімо, специфічні символи французької мови, то потрібні нам символи повинні бути перекодовані особливим чином.

До змісту