WEBVTT

00:00:00.000 --> 00:00:02.843
Ви вже вивчили багато
тегів HTML.

00:00:03.000 --> 00:00:04.800
Але чи знаєте ви,
що насправді означає HTML?

00:00:04.850 --> 00:00:08.470
HTML — це мова гіпертекстової розмітки.

00:00:08.470 --> 00:00:11.470
Ми вже знаємо, що означає "мова розмітки".

00:00:11.470 --> 00:00:14.177
Це спосіб структурувати сторінку,
використовуючи теги.

00:00:14.181 --> 00:00:16.860
Але що означає гіпертекст?

00:00:16.869 --> 00:00:20.494
Насправді, це слово було 
винайдене ще до існування Інтернету,

00:00:20.494 --> 00:00:23.823
у 1960-х роках, і означало "текст,
з'єднаний з іншим текстом,

00:00:23.823 --> 00:00:26.263
до якого читач може зразу ж перейти".

00:00:26.273 --> 00:00:29.720
Тім Бернерс-Лі розробив HTML

00:00:29.720 --> 00:00:32.756
та інші складові Інтернету,
наприклад, HTTP,

00:00:32.787 --> 00:00:34.912
як спосіб з'єднати один текст
з іншим,

00:00:34.912 --> 00:00:36.722
що існує будь-де у світі.

00:00:36.751 --> 00:00:39.191
Як ми з'єднуємо веб сторінки 
з іншими веб-сторінками

00:00:39.191 --> 00:00:41.280
в мові гіпертекстової розмітки?

00:00:41.282 --> 00:00:43.451
Звичайно ж, за допомогою 
гіперпосилання,

00:00:43.451 --> 00:00:46.280
яке ми зараз зазвичай називаємо
просто "посилання".

00:00:46.280 --> 00:00:48.599
Як ми створюємо посилання в HTML?

00:00:48.636 --> 00:00:50.304
Саме зараз буде трохи дивно.

00:00:50.304 --> 00:00:52.770
Ви, мабуть, думаєте, що ми
використаємо тег  ("посилання")...

00:00:52.770 --> 00:00:57.633
Але насправді цей тег використовується 
для іншого виду посилань в HTML.

00:00:57.633 --> 00:01:03.106
Замість нього, ми використаємо тег <а>,
де літера "а" означає "anchor" (укр. "якір").

00:01:03.172 --> 00:01:06.453
Він кидає якір на посилання на 
сторінці в певному місці

00:01:06.453 --> 00:01:09.420
і з'єднує цей якір з
іншою веб-сторінкою.

00:01:09.443 --> 00:01:11.989
Щоб створити посилання, ви знаєте,
що ми маємо створити тег,

00:01:11.989 --> 00:01:14.621
але також ми маємо вибрати
текст посилання

00:01:14.621 --> 00:01:17.219
і адресу, на яку переходитиме
це посилання.

00:01:17.233 --> 00:01:24.068
Зробімо посилання на сторінку
з детальнішою інформацію про створення веб.

00:01:24.068 --> 00:01:29.506
Текст посилання розміщується 
між початковим та кінцевим тегами.

00:01:29.599 --> 00:01:31.900
Тому я поставлю курсор тут і напишу:

00:01:31.900 --> 00:01:36.610
"Прочитайте більше про історію створення HTML".

00:01:36.610 --> 00:01:41.017
Тепер ми бачимо, що текст
має вигляд посилання.

00:01:41.061 --> 00:01:44.317
Але поки що він нікуди не переходить.
Ми маємо додати адресу.

00:01:44.347 --> 00:01:47.480
Ми насправді не хочемо, щоб адресу
було видно на сторінці,

00:01:47.480 --> 00:01:49.937
але нам потрібно, щоб браузер знав, що це.

00:01:49.990 --> 00:01:53.040
Тому ми вставимо адресу всередині
атрибута тега <а>.

00:01:53.088 --> 00:01:56.942
Це атрибут "href".

00:01:56.985 --> 00:01:59.749
Що означає "href"?

00:01:59.769 --> 00:02:03.264
Я дам вам підказку:
ви часто бачили цю "h".

00:02:03.283 --> 00:02:06.124
Вона означає "гіпер", "гіперпосилання"
("hyper-reference").

00:02:06.124 --> 00:02:11.966
Тепер я вставлю тут адресу, яку 
ми також називаємо URL.

00:02:12.036 --> 00:02:15.940
Ви помітили, що URL починається
з "http"?

00:02:16.051 --> 00:02:19.044
Вгадайте, що тут означає "h"?
Гіпер!

00:02:19.084 --> 00:02:21.483
HTML — це суцільні "гіпер".

00:02:21.553 --> 00:02:25.664
URL визначає все, що потрібно знати
браузеру, щоб знайти сторінку:

00:02:25.724 --> 00:02:27.965
Це протокол,

00:02:28.035 --> 00:02:30.357
далі йде домен

00:02:30.457 --> 00:02:34.265
і шлях, де розміщена сторінка
на сервері.

00:02:34.294 --> 00:02:38.579
Оскільки в цьому випадку URL визначає 
все, ми називаємо її "абсолютною URL".

00:02:38.622 --> 00:02:43.499
На деяких сайтах, ви можете побачити URL,
які починаються зі слеша і шляху.

00:02:43.562 --> 00:02:46.179
Це говорить браузеру залишатись
на поточному домені

00:02:46.179 --> 00:02:48.634
і всього лиш знайти інший шлях
на цьому домені.

00:02:48.645 --> 00:02:50.631
Це називається "відносна URL".

00:02:50.682 --> 00:02:54.054
Ми використовуємо їх постійно на сайті Khan Academy,
коли з'єднуємо певну інформацію.

00:02:54.136 --> 00:02:57.623
Ви маєте використовувати абсолютні URL
на сторінках, які робите тут,

00:02:57.623 --> 00:02:59.288
щоб уникнути небажаних наслідків.

00:02:59.321 --> 00:03:02.146
Ми також можемо сказати браузеру,
де відкривати сторінку:

00:03:02.146 --> 00:03:04.728
в цьому ж вікні, 
чи в новому.

00:03:04.769 --> 00:03:07.061
Щоб сказати браузеру відкрити
вікно в новому вікні,

00:03:07.061 --> 00:03:10.748
ми додамо ще один атрибут,
"ціль" ("target").

00:03:10.796 --> 00:03:15.258
target ="_blank"

00:03:15.288 --> 00:03:19.406
Я хочу, щоб ви зараз зупинили відео
і спробували натиснути на посилання.

00:03:19.444 --> 00:03:23.373
Вперед, я почекаю.
Клік-клік!

00:03:23.393 --> 00:03:24.372
Що трапилось?

00:03:24.432 --> 00:03:25.802
Ви, напевно, побачили попередження,

00:03:25.802 --> 00:03:28.244
що це посилання надіслано
з користувацької сторінки.

00:03:28.244 --> 00:03:30.625
І потім, якщо ви натиснули "ок",
посилання відкрилось.

00:03:30.676 --> 00:03:33.122
Це тому що ми додали до посилань
на цих сторінках


00:03:33.122 --> 00:03:34.395
дещо особливе.

00:03:34.423 --> 00:03:37.797
Тому що ми не хочемо, щоб користувачі, 
які думають, що всі посилання затверджені

00:03:37.797 --> 00:03:41.054
Khan Academy, потім попадали на 
страшні несподівані сайти.

00:03:41.066 --> 00:03:43.992
Тому кожне посилання, яке ви тут зробите,
буде мати таке попередження,

00:03:43.992 --> 00:03:46.163
і кожне посилання з'являтиметься
у новому вікні.

00:03:46.300 --> 00:03:50.223
Це означає, що насправді я можу 
видалити атрибут "ціль",

00:03:50.223 --> 00:03:53.048
оскільки він встановлений
за замовчуванням.

00:03:53.088 --> 00:03:54.420
Або я можу його залишити на випадок,

00:03:54.420 --> 00:03:57.764
якщо я захочу одного дня
перенести цей код HTML з сайту Khan Academy

00:03:57.764 --> 00:04:00.840
і бути впевненою, що посилання все одно
відкриватиметься в новому вікні.

00:04:00.870 --> 00:04:02.723
Коли ви маєте використовувати атрибут "target"?

00:04:02.783 --> 00:04:06.302
Загалом, якщо посилання переходить на
іншу сторінку на одному домені,

00:04:06.302 --> 00:04:08.023
воно має відкритись в тому ж самому вікні.

00:04:08.023 --> 00:04:12.179
А якщо воно переходить на сторінку на іншому 
домені, воно має відкритись в новому вікні.

00:04:12.239 --> 00:04:13.641
Гаразд, досить цих розмов,

00:04:13.641 --> 00:04:16.649
краще я вам покажу щось важливіше
щодо посилань.

00:04:16.689 --> 00:04:18.653
Ми можемо приєднувати не лише текст.

00:04:18.653 --> 00:04:21.627
Ми можемо з'єднувати зображення
або текст із зображеннями.

00:04:21.656 --> 00:04:26.815
Тут ми маємо фотографію Тіма Бернерса-Лі.

00:04:26.867 --> 00:04:30.454
Я збираюсь її вирізати...

00:04:30.464 --> 00:04:34.067
і вставити її всередину посилання.

00:04:34.094 --> 00:04:36.068
Оу! Як мило.

00:04:36.068 --> 00:04:38.958
Якщо я наведу мишкою на зображення,

00:04:38.958 --> 00:04:41.309
Я побачу, що мій курсор перетворився
на стрілку,

00:04:41.309 --> 00:04:44.379
і натиснувши на неї, я перейду на сторінку CERN (Європейська організація з ядерних досліджень).

00:04:44.379 --> 00:04:46.948
Насправді ви можете зробити посиланням
всю вашу сторінку,

00:04:46.948 --> 00:04:49.867
і вона стане великою, блакитною, 
підкресленою кляксою.

00:04:49.867 --> 00:04:56.357
Але, будь ласка, не робіть цього!
Робіть посилання з любов'ю, друзі.

00:04:56.357 --> 00:04:56.807
Переклад на українську мову: Зоряна Гаврилюк, рев'юер: Юлія Білаш, Благодійний фонд "MagneticOne.org"