Лабораторна робота 1: Частина 1: html. Поняття про мову. Головні теги Теорія: Основи мови html

5

У
HTML-документ можна включати коментарі, дозволяють приховати частина тексту від браузера. Все, що укладена між послідовностями символів , при перегляді сторінки залишається невидимим. Коментарі не можуть бути вкладеними один в одного.
Назва документу
Включення в документ заголовної частини не є обов'язковим.
Завданням заголовка є подання необхідної інформації для браузера та сервера HTTP. Інформація, розміщена всередині заголовка документа, зазвичай не виводиться на екран (крім назви документа).
Назва документу відкривається тегом , який звичайно треба відразу ж за тегом . Закриваючий тег показує кінець цього розділу, між ними розташовуються інші теги заголовка документа.
Найчастіше в заголовок документа включають парний тег , що визначає назва документа.
Багато програм перегляду використовують його як заголовок вікна, в якому виводять документ. Програми, індексує документи в мережі Інтернет, використовують назву для ідентифікації сторінки. Гарне назва повинна бути досить довгим для того, щоб можна було коректно вказати відповідну сторінку, і в той же час воно має поміщатися в заголовку вікна. Назва документа вписується між відкриває і закриває тегами.
Тіло документа
На відміну від заголовка, тіло документа є обов'язковим елементом, тому що в ньому розташовується весь матеріал вашого документа (є тільки одне виняток, з яким ми познайомимося далі, - коли документ містить замість тіла групу фреймів). Тіло документа розміщується між тегами і

6
цими тегами, інтерпретується браузером відповідно до правил мови
HTML, що дозволяють коректно відображати сторінку на екрані монітора.
Тег не тільки позначає початок вмісту документа, але і задає його основні властивості: колір фону, тексту і багато інше. Ці властивості визначаються за допомогою атрибутів, які наведені в таблиці.
Атрибут
Призначення
ALINK
Визначає колір активного посилання
BACKGR
OUND
Вказує на
URL-адресу зображення, яке використовується в якості фонового
BGCOLO
R
Визначає колір фону документа
LINK
Визначає колір невідвідування посилання
ТЕХТ
Визначає колір тексту
VLINK
Визначає колір Відвідані посилання
Приклад
<НТML>
<НЕAD>
<ТIТLE>Моя сторінка

7
<ВОDY ТЕXT=rеd BGСОLOR=whitе>
Тело документа

8
Завдання
Структура HTML-документа
1. Розібратися в призначенні мови HTML, структурі HTML- документу, поняттях гіпертексту
2. Створити у програмі Блокнот текстовий документ
із структурою HTML-документа
3. Зберегти створений документ із розширенням *.txt та *.html
4. Закрити всі документи та відкрити іх знову. Звернути увагу, як розширення файлу впливає на спосіб відкриття документу.
Описати різницю.
5. Створити у програмі Блокнот HTML-документ із своєю автобіографією. Автобіографія повинна мати загальну назву та влючати декілька етапів Вашого життя (не менше трьох, наприклад: народження, дитинство, юність). Кожен етап Вашого життя повиннен містити підзаголовок, у саму тексті треба зазначити декілька видатних дат Вашої біографії.
6. Автобіографію зберегти у файлі biography.html

9
Частина 2: Форматування тексту, робота з кольором
Теорія:
Кольорове оформлення документа
Визначення кольору складових частин документа - один з перших кроків у його створення. Якщо цього не зробити, то будуть використовуватися кольору за замовчуванням, які визначаються установками браузера. Не існує будь-яких правил створення добре збалансованої кольорової палітри документа.
Потрібно лише піклуватися про те, щоб можна було прочитати текст, не відчуваючи при цьому незручностей. При виборі колірної палітри намагайтеся підтримувати високу контрастність тексту і фону та уникайте сусідства областей з близькими квітами.
Колір може бути заданий назвою (наприклад, green) або шістнадцятковий числом, що визначає колір в моделі RGB. Ця колірна модель базується на визначенні кольору як композиції трьох основних відтінків кольору: червоного (Red), зеленого (Green) і синього (Blue).
Кожна компонента задається двозначним шістнадцятковий числом
(тобто змінюється від 00 до FF). Потім ці значення об'єднуються в одне число, перед яким ставиться символ # (Більшість сучасних браузерів може розпізнати колір і без вказівки символу #).
Слід також відзначити, що в записі шістнадцяткового значення кольору можна використовувати як великі, так і маленькі латинські літери, наприклад, запис # 00FF00рівнозначна запису # 00ff00.
Нижче представлена таблиця 16 стандартних квітів разом з їх шістнадцятковий кодами.
Сучасні браузери розуміють
140 найменувань квітів, частина з яких наведена у розділі "Динамічний
HTML".

10
Колір
Код
Колір
Ко
д
black ( чорний)
# 000000 silver
( срібний)
#
C0C0C0 maroon ( темно-бордовий)
# 800000 red
( червоний)
#
FF0000 green ( зелений)
# 008000 lime
( вапно)
#
00FF00 olive ( оливковий)
# 808000 yellow
( жовтий)
#
FFFF00 navy ( темно-синій)
# 000080 blue
( синій)
#
0000FF purple ( фіолетовий)
# 800080 fuchsia
( фуксія)
#
FF00FF teal ( синьо-зелений)
# 008080 aqua
( аква)
#
00FFFF gray ( сірий)
# 808080 white
( білий)
#
FFFFFF
Приклад
Щоб встановити синій колір фону документа потрібно для синьої складової кольору вказати максимальне значення, а інші зробити рівними нулю: .
Той факт, що розробник Web-сторінки нічого не знає про комп'ютер, на якій документ буде проглядатися, накладає додаткові обмеження на використання RGB-моделі. На деяких моніторах неможливо відобразити все розмаїття відтінків. Браузери в цьому випадку скорочують використовуване кількість квітів, перепризначений
їх під власні палітри.
Використання розробниками

11
гіпердокументов Web-палітри є в деякому роді гарантією того, що документ буде виглядати однаково на різних дисплеях.
Web-палітра розпізнає за шість відтінків червоного, синього і зеленого кольору, що в результаті дає 216 можливих значень кольорів
(6x6x6=216). Тому її іноді називають "куб 6x6x6". У таблиці наведено числові значення кольорів з Web-палітри.
Шістнадцятк
ові
Деся
ткові
Проц
ентні
00
(самий темний)
0 0%
33 51 20%
66 102 40%
99 153 60%
CC
204 80%
FF
(самий світлий)
255 100%
Кольори,
RGB-компоненти яких входять в
Web-палітру, називають Web-надійними квітами. Серед всіх кольорів, що мають
імена, тільки 10 квітів входять в Web-палітру: aqua, black, blue, cyan, fuchsia, lime, magenta, red, white і yellow.
Поділ тексту на абзаци
Мова HTML припускає, що автор документа нічого не знає про комп'ютер свого читача. Читач має право встановити будь-який розмір вікна і користуватися будь-яким з наявних у нього шрифтів. Це означає, що місце перенесення в рядку визначається тільки

12
програмою перегляду й установками кінцевого користувача. Символи переведення рядка оригінального документа ігноруються, в результаті чого текст, відмінно виглядала у вікні вашого редактора, може перетворитися на суцільний нерозбірливі текст у вікні програми перегляду.
Уникнути цієї неприємності дозволяє поділ на абзаци за допомогою тега <Р>. Додайте його на початку кожного абзацу, і програма перегляду відділить абзаци один від одного символом нового рядка. Використання закриває тега необов'язково. Кілька стоять поспіль тегів <Р> не дають додаткового простору між абзацами.
Тег абзацу має один атрибут, підтримуваний більшістю браузерів.
Це атрибут ALIGN, що задає вирівнювання тексту в абзаці. Якщо цей атрибут не заданий, то текст вирівнюється по лівому краю вікна браузера. У таблиці представлені можливі значення цього атрибуту:
Знач
ення
Функція
LEF
T
Вирівнювання тексту по лівій межі вікна браузера
CEN
TER
Вирівнювання по центру вікна браузера
RIG
HT
Вирівнювання по правій межі вікна браузера
JUS
TIFY
Вирівнювання тексту по ширині вікна браузера
Приклад

13
Якщо ви хочете, щоб текст абзацу був вирівняний по центру, потрібно написати наступне:
ALIGN=CENTER>
Текст
Розрив рядка
Іноді потрібна "розірвати" текст, перенісши його залишок на новий рядок, при цьому не виділяючи нового абзацу. Для цього використовується тег розриву рядка
. Він змушує програму перегляду виводити стоять після нього символи з нового рядка. На відміну від тега абзацу, тег не додає порожній рядок. У цього тега немає парного закриваючого тега.
Приклад

Звідки до нас прийшла зима, не знаєш ти, ніхто не знає.
Замовкла все. Вона сама холодних вуст розтискає.

14
Деякі браузери інтерпретують кілька стоять поруч тегів як один тег, тому не варто використовувати його для вставки порожніх рядків.
Бувають випадки, коли виникає потреба в операції протилежного призначення - заборонити переклад рядка. Текст, укладений між тегами і , буде гарантовано розташовуватися в одному рядку без переносу на
іншу.
Горизонтальні лінії
Іншим методом розділення документа на частини є проведення горизонтальних ліній. Вони візуально підкреслюють завершеність тієї чи іншої області сторінки. Тег
дозволяє провести рельєфну горизонтальну лінію у вікні більшості програм перегляду. Цей тег не вимагає закриває тега. До і після лінії автоматично вставляється порожня рядок. Атрибути тега
представлені в таблиці.
Атри
бут
Призначення
ALI
GN
Вирівнює по краю або центру; має значення LEFT,
CENTER, RIGHT
WID
TH
Встановлює довжину лінії в пікселах або відсотках від ширини вікна браузера; в останньому випадку додається символ %
SIZ
E
Встановлює ширину лінії в пікселах
NOS
HADE
Відміняє рельєфність лінії

15
COL
OR
Вказує колір лінії; використовується найменування кольору або шістнадцятковий код
Форматування гіпертексту
Мова HTML підтримує як логічний (logical), так і фізичний (Physical) стилі форматування вмісту документа. Використання логічного форматування вказує на призначення даного фрагмента тексту, а при фізичному форматуванні досконально задається його зовнішній вигляд. По можливості варто використовувати логічні стилі, так як вони дозволяють браузеру вибрати найбільш підходящий документу вигляд.
Використання логічних стилів також допоможе читачеві розібратися в структурі документа. Фізичний стиль використовується в основному програмами, що конвертує текстові файли, що містять фізична форматування, в HTML, так як логічне форматування документа неможливо виконати автоматично.
Логічне форматування
Хоча мова HTML включає теги для досягнення різних шрифтових ефектів (Напівжирний шрифт, курсив, підкреслений шрифт), не всі браузери їх підтримують. Проте всі браузери підтримують той чи інший спосіб виділення тексту. Тому використання логічного форматування тексту в будь-якому випадку призведе до виділення програмою перегляду різних частин тексту і виявить структуру документа.
Говорячи про логічної розмітки тексту, можна виділити дві основні частини: виділення заголовків у документі; логічне виділення елементів тексту.
Назва документа, що задається за допомогою тега

Заголовок 1 рівня

Заголовок 2 рівня

Заголовок 3 рівня

Заголовок 4 рівня

Заголовок 5 рівня

Заголовок 6 рівня

17
Пам'ятайте, що якщо ви забудете поставити тег заголовка, вид сторінки буде викривлений: будь-який з тегів заголовка автоматично вставляє пустий рядок до і після себе.
Теги заголовків підтримують атрибут ALIGN, дія якого аналогічно дії такого ж атрибуту тега виділення абзацу.
Елементи логічного виділення фрагментів тексту, а також можливе оформлення кожного з них наведено в таблиці.
Теги
Застосування
Результат

Використовується для виділення цитат або назв книг
і статей

Використовується для
виділення цитат або назв
книг і статей

Застосовується для Застосовується для виведення

18 виведення невеликого шматка програмного коду
невеликого шматка програмного коду

Використовується для виділення важливих фрагментів тексту
Використовується для
виділення
важливих
фрагментів тексту

Виділяє текст, вводиться користувачем з клавіатури
Виділяє текст, що вводиться користувачем з клавіатури

Використовується для виділення тексту прикладу
Використовується для виділення тексту прикладу
G>

Використовується для виділення дуже важливих фрагментів тексту

Використовується
для
виділення дуже важливих
фрагментів тексту

Використовується для позначки імен змінних
Використовується для
позначки імен змінних
E>

~~Використовується для оцінки вилученого тексту~~
Використовується для позначки віддаленого тексту

19
Ви, напевно, звернули увагу на те, що деякі елементи логічної розмітки тексту дають однаковий результат. Навіщо ж тоді потрібна така їх розмаїтість? Відповідь на це питання міститься в назві цієї групи тегів. Вони призначені для розстановки логічних наголосів, виділення логічних частин та підкреслення суті висловлювань. Їх використання досить актуально, оскільки, ймовірно, в найближчому майбутньому стане можливий, наприклад, пошук цитат у Web- просторі, а, може бути, наступне покоління браузерів навчиться читати документи вголос. Програми, які вміють розпізнавати логічні наголосу, замінять монотонні мовні процесори сьогоднішнього дня.
Для виділення довгих цитат з основного тексту в HTML існує тег

. Цей елемент є контейнером і може містити будь- які форматуйте теги.
Сучасні браузери реагують на елемент
зміщенням тексту цитати праворуч. Деякі текстові програми перегляду позначають цитату символами >, що розташовуються в крайньому лівому стовпчику екрана. Так як сьогодні більшість браузерів є графічними програмами, елемент
дозволяє авторам внести в текст деякий візуальне різноманітність.
Фізичне форматування
Однією з відмінностей
HTML-документа від документа, підготовленого на друкованій машинці, є можливість форматування тексту. Мова HTML дозволяє автору документа вибрати вподобаний йому шрифт, відповідний розмір букв, їх колір і накреслення. За всі ці параметри відображення тексту відповідають теги фізичного форматування. Вони діють на всі символи, що стоять між відкриває і закриває тегами.

20
Теги
Застосування
Результат
Напівжирний
Напівжирний
Курсив
Курсив
Підкреслений
Підкреслений

Друкарська машинка
Друкарська машинка

~~Закреслений~~
Закреслений

Великий
Великий

МаленькийALL>
Маленький

Верхній
-- x^індекс
Верхній -- x
індекс

Нижній
-- x_індекс
Нижній -- x
індекс
Елементи фізичного форматування можуть бути вкладеними один в одного, хоча кінцевий результат залежить від браузера. При цьому потрібно уважно стежити, щоб один контейнер знаходився цілком в
іншому контейнері, наприклад,
Жирний і підкреслений текст
Крім перерахованих вище тегів у документі може використовуватися тег
,
Що дозволяє безпосередньо поставити розмір і колір шрифту. Елемент FONT представляє собою контейнер, тобто вимагає як відкриваючого, так і закриває тегів, і сам може використовуватися усередині будь-якого іншого текстового контейнера.
Після стартового тега обов'язкове зазначення атрибутів, без яких елемент не робить ніякого впливу на текст, поміщений в контейнер.

21
Атрибут FACE дозволяє вказати тип шрифту, яким програма перегляду виведе ваш текст (якщо таким має в своєму розпорядженні користувач). Якщо потрібного шрифту немає, програма проігнорує запит і буде використовувати шрифт, встановлений за замовчуванням.
Цей атрибут дозволяє вказати як один, так і декілька шрифтів
(Через кому). Весь список буде переглянутий зліва направо і перший з наявних на машині користувача буде використаний для виведення документа.
Атрибут SIZE служить для вказівки розміру шрифту в умовних одиницях від 1 до 7. Вважається, що розмір "нормального" шрифту відповідає числу 3. Розмір може бути як абсолютною величиною
( SIZE=5), так і відносної ( SIZE=+2). У другому прикладі поточний розмір шрифту збільшується на 2.
Атрибут COLOR встановлює колір шрифту, який може бути заданий як у форматі RGB, так і з іменем.
Приклад
Текст червоного кольору і великого розміру
Попередньо відформатований текст
Будь-який фрагмент тексту, розташований між тегами та
, розбивається на рядки і абзаци в точній відповідності з тим, як ви його вводили. Зазвичай при виведенні на екран предформатірованного (Preformatted) тексту використовується

22
моноширинний шрифт (так називається шрифт друкарської машинки).
Цей тег можна використовувати, наприклад, для друку віршів, в яких взаємне розташування рядків задав сам автор, або для зображення "Картинки", що складається з символів.
Іншим важливим застосуванням тега
є виведення на екран текстів комп'ютерних програм (На мовах Java, C + + та ін), в яких традиційно використовують відступи, додаткові пробіли та порожні рядки для виділення структури вихідного коду.
Текст всередині контейнера підпорядковується дій тегів
і
і підтримує теги заголовків.
До вмісту контейнера може застосовуватися будь-які елементи фізичного
і логічного форматування, але деякі моноширинних шрифти не містять наборів символів напівжирного та курсивного накреслення.
Приклад
Розглянемо фрагмент HTML-документа, що містить попередньо відформатований текст:
Тут можна ставити скільки завгодно
Пробілів,
і переносити рядки, там, де захочеться.
Html не зможе

нам

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

23
браузера шрифту Courier (Adobe), а для другого використовувався шрифт Fixed (Sony).

24
Завдання:
Форматування тексту, робота з кольором
1. Розібратись з основними тегами HTML, призначеними для форматування тексту та роботою зі стилями
2. Створити HTML-документ, у якому написати своє прізвище,
ім'я, побатькові, використовуючи заголовок першого рівня.
3. Розмістити в документі три прислів'я наступним чином: перше -- вирівняти по лівому краю та оформити курсивним шрифтом червоного кольору; друге -- по центру напівжирним шрифтом жовтого кольору; третє -- по правому краю підкресленим шрифтом зеленого кольору.
4. Включити до документу інщі зразки фізичного та логічного форматування
5. Додати до документу фрагмент попередньо відформатованого тексту.
6. Описати, яким чином веде себе попередньо відформатовиний фрагмент тексту при зменшенні ширини вікна браузера
7. Зберегти отриманий документ у форматі HTML
8. Скопіювати файл Вашої автобіографії із попередньої роботи
9. Відредагувати автобіографію наступним чином: сторінка повина мати заголовок, а текст оформлено із застосуванням різних стилів форматування. Описання кожного етапу життя у автобіографії повино мати свій заголовок та відокремлюватись горизонтальною лінією. Видатні дати Вашого життя виділити
іншим кольором.
10.
Автобіографію зберегти у файлі biography.html

25
Частина 3: Робота із зображеннями, навігація по
документу
Теорія:
Використання графіки в HTML-документах
Малюнки та анімація можуть зробити HTML-документ більш привабливим і цікавим. Вони не тільки прикрашають сторінку, але й допомагають краще передати зміст документа. Для правильного використання графіки в HTML-документі необхідно враховувати наступні фактори: багато браузери підтримують тільки графічні формати GIF і JPEG; файли, що містять графіку, передаються повільно; деякі користувачі не мають графічних браузерів, або має намір відключають завантаження зображень; кольорова графіка, яка добре виглядає на вашому комп'ютері, може погано виглядати на
іншому.
Тег вставляє зображення в документ, як якщо б воно було просто одним великим символом.
Синтаксис тега:

Атрибути тега та їх значення наведені в таблиці.
Атрибут
Призначення
SRC="фа йл"
Задає URL-адресу зображення (можна вказувати як абсолютний, так і відносний URL-адреса; якщо файл із зображенням знаходиться в тій же директорії, що і HTML- документ, то досить просто вказати ім'я файлу); цей атрибут є обов'язковим
ALT="те кст"
Задає альтернативний текст для браузерів, що не підтримують роботу з зображеннями
ALIGN="
Задає розташування картинки щодо

26
тип"
тексту, тип може приймати наступні значення: ТОР,
MIDDLE, BOTTON, LEFT, RIGHT
BORDER=
n
Встановлює товщину обрамлення навколо зображення у пікселях
HEIGHT=
n (%)
Встановлює висоту зображення в пікселах або у відсотках від висоти вікна браузера
WIDTH=n
(%)
Встановлює ширину зображення в пікселах або у відсотках
HSPACE=
n
Задає вільний простір зліва і праворуч від зображення (у пікселях)
VSPACE=
n
Здається вільний простір над і під зображенням (у пікселях)
Зверніть увагу, що ширина і висота зображення можуть бути задані НЕ тільки в пікселах, а й у відсотках від розмірів вікна браузера.
Багато компоненти, що включаються до складу Web-сторінок
(зображення, таблиці, аплети і т. д.), дозволяють задавати розмір у відносних одиницях (тобто в відсотках). Це дозволяє зменшити залежність зовнішнього вигляду документа від поточних установок конкретного браузера
і особливостей операційної системи.
Рекомендується задавати тільки один з атрибутів пари "ширина- висота" зображення, інакше малюнок може бути непропорційно деформований і змінить свій вигляд.
Приклад
Якщо розмір зображення, що зберігається у файлі exm2.gif складає 150 пікселів по ширині і 90 по висоті, то наступна команда призведе до включення в документ деформованого зображення:

27
Пам'ятайте, що графіка передається по мережі набагато повільніше, ніж текст, тому краще включати в документ зображення невеликого розміру. Якщо ви задаєте розмір зображення менше, ніж у вихідного, то це призводить лише до невиправданого збільшення обсягу передачі інформації по мережі. Раціональніше попередньо зменшити розмір зображення за допомогою графічного редактора.
Мова HTML дозволяє задати розташування зображення щодо навколишнього його тексту. Атрибут ALIGN може приймати наступні значення.
Знач
ення
Функція
ТОР
Вирівнює один рядок по верху зображення, решта поміщає після малюнка
MID
DLE
Вирівнює один рядок по середині зображення, решта поміщає після малюнка
BOT
TOM
Вирівнює один рядок по низу зображення, решта поміщає після малюнка
LEF
T
Тулить обтічне текстом зображення до лівій стороні вікна браузера
RIG
HT
Тулить обтічне текстом зображення до правій стороні вікна браузера
Приклад
Розглянемо можливі варіанти вирівнювання зображення щодо тексту.

28
Перший рядок тексту знаходиться зверху зображення і зазвичай використовується для опису малюнка.

Перший рядок тексту знаходиться по середині зображення і використовується для того ж.

Перший рядок тексту знаходиться внизу зображення і використовується також як і у двох перших випадках.

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

Зображення притискається до правого краю вікна перегляду, а текст обтікає зображення зліва.

29
Гіперпосилання
Незважаючи на те, що до складу HTML-документа входять самі різні компоненти, можна сказати, що гіпертекстові посилання - основа WWW. Якщо б Web-сторінки не посилалися один на одного, вміст Web перетворилося б на звичайний набір файлів, не пов'язаних між собою.
Для створення гіпертекстового посилання використовується пара тегів .... Фрагмент тексту, зображення або будь-який інший об'єкт, розташований між цими тегами, відображається у вікні браузера як гіпертекстова посилання. Активація такого об'єкта призводить до завантаженні у вікно браузера нового документа або до відображення іншої частини поточної Web-сторінки. Гіпертекстова посилання формується за допомогою виразу фрагмент документа
HREF
тут є обов'язковим атрибутом, значення якого і є URL-адреса запитуваної ресурсу. Лапки в завданні значення атрибуту HREF не обов'язкові.
Текстові покажчики, тобто фрагменти тексту, які є посиланнями, не відрізняються різноманітністю зовнішнього вигляду. Зазвичай такий покажчик являє собою слово або слова, підкреслені прямою лінією.
Колір покажчика може регулюватися автором і установками програми перегляду.
Приклад
Посилання
Графічні покажчики, тобто зображення-посилання, виділяються рамкою того ж кольору, що й текстові покажчики.
Приклад

30
Абсолютний і відносний URL
У розділі, присвяченому комп'ютерних мережах і принципам пошуку
інформації в
Інтернет, було введено поняття
URL
(універсального локатора ресурсу), однозначно визначає розташування об'єкта в глобальній мережі. У загальному випадку URL має такий вигляд (частини, укладені в квадратні дужки, не обов'язкові і можуть бути опущені): протокол: / / адрес_узла [: порт] / шлях / файл [# мітка]
У таблиці нижче наведені призначення компонент URL.
Компоне
нта
Призначення
проток ол
Позначення одного з протоколів, використовуваних для звернення до ресурсу, можливі значення: http, ftp, file та ін адрес_
узла
Доменне ім'я або IP-адреса комп'ютера в мережі
Інтернет порт
Порт за яким клієнт звертається до сервера для встановлення з'єднання; вказується тільки у разі звернення до нестандартного порту шлях
Шлях до потрібного ресурсу файл
Файл, що містить HTML-документ або інший ресурс мітка
Позиція в документі, починаючи з якої він відображається у вікні браузера
URL, заданий в такому вигляді, називається абсолютним
URL, так як він повністю описує розташування ресурсу в глобальній мережі.
Приклад

31
При зверненні до конкретного ресурсу порт і позиція в документі часто не вказуються: http://www.ctc.msiu.ru/education/book/index1.html
Приклад
Розглянемо посилання на так звану домашню сторінку (Home
Page) конкретного користувача.
Припустимо, що на сервері www.msiu.ru зареєстрований людина з користувальницьким
ім'ям
(login) ivanov. Домашньою сторінкою називають файл index.html, що знаходиться в директорії з
ім'ям public_html, яка, у свою чергу, повинна розташовуватися в домашньої директорії користувача. Тоді посилання на домашню сторінку цього людини може бути задана у вигляді
HREF="http://www.msiu.ru/ivanov">Текст посилання
Зверніть увагу, що ім'я самого файлу при такому записі не вказується. Якщо буде потрібно послатися на який-небудь інший документ даного користувача, розташований в директорії public_html, наприклад, photo.html, то посилання прийме вигляд:
HREF="http://www.msiu.ru/