1
00:00:00,000 --> 00:00:02,843
Ви вже вивчили багато
тегів HTML.

2
00:00:03,000 --> 00:00:04,800
Але чи знаєте ви,
що насправді означає HTML?

3
00:00:04,850 --> 00:00:08,470
HTML — це мова гіпертекстової розмітки.

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

5
00:00:11,470 --> 00:00:14,177
Це спосіб структурувати сторінку,
використовуючи теги.

6
00:00:14,181 --> 00:00:16,860
Але що означає гіпертекст?

7
00:00:16,869 --> 00:00:20,494
Насправді, це слово було 
винайдене ще до існування Інтернету,

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

9
00:00:23,823 --> 00:00:26,263
до якого читач може зразу ж перейти".

10
00:00:26,273 --> 00:00:29,720
Тім Бернерс-Лі розробив HTML

11
00:00:29,720 --> 00:00:32,756
та інші складові Інтернету,
наприклад, HTTP,

12
00:00:32,787 --> 00:00:34,912
як спосіб з'єднати один текст
з іншим,

13
00:00:34,912 --> 00:00:36,722
що існує будь-де у світі.

14
00:00:36,751 --> 00:00:39,191
Як ми з'єднуємо веб сторінки 
з іншими веб-сторінками

15
00:00:39,191 --> 00:00:41,280
в мові гіпертекстової розмітки?

16
00:00:41,282 --> 00:00:43,451
Звичайно ж, за допомогою 
гіперпосилання,

17
00:00:43,451 --> 00:00:46,280
яке ми зараз зазвичай називаємо
просто "посилання".

18
00:00:46,280 --> 00:00:48,599
Як ми створюємо посилання в HTML?

19
00:00:48,636 --> 00:00:50,304
Саме зараз буде трохи дивно.

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

21
00:00:52,770 --> 00:00:57,633
Але насправді цей тег використовується 
для іншого виду посилань в HTML.

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

23
00:01:03,172 --> 00:01:06,453
Він кидає якір на посилання на 
сторінці в певному місці

24
00:01:06,453 --> 00:01:09,420
і з'єднує цей якір з
іншою веб-сторінкою.

25
00:01:09,443 --> 00:01:11,989
Щоб створити посилання, ви знаєте,
що ми маємо створити тег,

26
00:01:11,989 --> 00:01:14,621
але також ми маємо вибрати
текст посилання

27
00:01:14,621 --> 00:01:17,219
і адресу, на яку переходитиме
це посилання.

28
00:01:17,233 --> 00:01:24,068
Зробімо посилання на сторінку
з детальнішою інформацію про створення веб.

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

30
00:01:29,599 --> 00:01:31,900
Тому я поставлю курсор тут і напишу:

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

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

33
00:01:41,061 --> 00:01:44,317
Але поки що він нікуди не переходить.
Ми маємо додати адресу.

34
00:01:44,347 --> 00:01:47,480
Ми насправді не хочемо, щоб адресу
було видно на сторінці,

35
00:01:47,480 --> 00:01:49,937
але нам потрібно, щоб браузер знав, що це.

36
00:01:49,990 --> 00:01:53,040
Тому ми вставимо адресу всередині
атрибута тега <а>.

37
00:01:53,088 --> 00:01:56,942
Це атрибут "href".

38
00:01:56,985 --> 00:01:59,749
Що означає "href"?

39
00:01:59,769 --> 00:02:03,264
Я дам вам підказку:
ви часто бачили цю "h".

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

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

42
00:02:12,036 --> 00:02:15,940
Ви помітили, що URL починається
з "http"?

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

44
00:02:19,084 --> 00:02:21,483
HTML — це суцільні "гіпер".

45
00:02:21,553 --> 00:02:25,664
URL визначає все, що потрібно знати
браузеру, щоб знайти сторінку:

46
00:02:25,724 --> 00:02:27,965
Це протокол,

47
00:02:28,035 --> 00:02:30,357
далі йде домен

48
00:02:30,457 --> 00:02:34,265
і шлях, де розміщена сторінка
на сервері.

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

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

51
00:02:43,562 --> 00:02:46,179
Це говорить браузеру залишатись
на поточному домені

52
00:02:46,179 --> 00:02:48,634
і всього лиш знайти інший шлях
на цьому домені.

53
00:02:48,645 --> 00:02:50,631
Це називається "відносна URL".

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

55
00:02:54,136 --> 00:02:57,623
Ви маєте використовувати абсолютні URL
на сторінках, які робите тут,

56
00:02:57,623 --> 00:02:59,288
щоб уникнути небажаних наслідків.

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

58
00:03:02,146 --> 00:03:04,728
в цьому ж вікні, 
чи в новому.

59
00:03:04,769 --> 00:03:07,061
Щоб сказати браузеру відкрити
вікно в новому вікні,

60
00:03:07,061 --> 00:03:10,748
ми додамо ще один атрибут,
"ціль" ("target").

61
00:03:10,796 --> 00:03:15,258
target ="_blank"

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

63
00:03:19,444 --> 00:03:23,373
Вперед, я почекаю.
Клік-клік!

64
00:03:23,393 --> 00:03:24,372
Що трапилось?

65
00:03:24,432 --> 00:03:25,802
Ви, напевно, побачили попередження,

66
00:03:25,802 --> 00:03:28,244
що це посилання надіслано
з користувацької сторінки.

67
00:03:28,244 --> 00:03:30,625
І потім, якщо ви натиснули "ок",
посилання відкрилось.

68
00:03:30,676 --> 00:03:33,122
Це тому що ми додали до посилань
на цих сторінках


69
00:03:33,122 --> 00:03:34,395
дещо особливе.

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

71
00:03:37,797 --> 00:03:41,054
Khan Academy, потім попадали на 
страшні несподівані сайти.

72
00:03:41,066 --> 00:03:43,992
Тому кожне посилання, яке ви тут зробите,
буде мати таке попередження,

73
00:03:43,992 --> 00:03:46,163
і кожне посилання з'являтиметься
у новому вікні.

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

75
00:03:50,223 --> 00:03:53,048
оскільки він встановлений
за замовчуванням.

76
00:03:53,088 --> 00:03:54,420
Або я можу його залишити на випадок,

77
00:03:54,420 --> 00:03:57,764
якщо я захочу одного дня
перенести цей код HTML з сайту Khan Academy

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

79
00:04:00,870 --> 00:04:02,723
Коли ви маєте використовувати атрибут "target"?

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

81
00:04:06,302 --> 00:04:08,023
воно має відкритись в тому ж самому вікні.

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

83
00:04:12,239 --> 00:04:13,641
Гаразд, досить цих розмов,

84
00:04:13,641 --> 00:04:16,649
краще я вам покажу щось важливіше
щодо посилань.

85
00:04:16,689 --> 00:04:18,653
Ми можемо приєднувати не лише текст.

86
00:04:18,653 --> 00:04:21,627
Ми можемо з'єднувати зображення
або текст із зображеннями.

87
00:04:21,656 --> 00:04:26,815
Тут ми маємо фотографію Тіма Бернерса-Лі.

88
00:04:26,867 --> 00:04:30,454
Я збираюсь її вирізати...

89
00:04:30,464 --> 00:04:34,067
і вставити її всередину посилання.

90
00:04:34,094 --> 00:04:36,068
Оу! Як мило.

91
00:04:36,068 --> 00:04:38,958
Якщо я наведу мишкою на зображення,

92
00:04:38,958 --> 00:04:41,309
Я побачу, що мій курсор перетворився
на стрілку,

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

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

95
00:04:46,948 --> 00:04:49,867
і вона стане великою, блакитною, 
підкресленою кляксою.

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

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