Знайомство з HTML

1. HTML-документ

Як ви вже, мабуть, знаєте, всі сайти в інтернеті складаються з веб-сторінок. Їх ще називають HTML-сторінками. То що ж це за штука така?

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

Тег — це ключове (службове) слово, найчастіше англійською мовою, яке обрамляється в кутові дужки (символи 'більше' і 'менше'), щоб програми не плутали теги та звичайні слова.

Приклад:

<img>

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

2. Приклад HTML-документа

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

Допустимо, браузер відображає вам таку сторінку:

Манул Ману́л — хижий ссавець родини котових. Зовні і розмірами схожий на домашнього кота, але відрізняється більш коротким масивним тулубом і лапами, круглими зіницями, низькими вухами, а також довгим густим хутром.

Ось як буде виглядати її HTML-документ:

      
<h1>Манул</h1>
<p> Ману́л — хижий ссавець родини котових. Зовні і розмірами схожий на 
<a href="#">домашнього кота</a>, але відрізняється більш коротким масивним тулубом і 
лапами, круглими зіницями, низькими вухами, а також довгим густим хутром. </p>
<img src="manul.jpg">
      
    

У цьому прикладі ми бачимо текст і теги: h1, p, a та img. Браузер розпізнав теги, і перетворив текст у тегах на заголовок, посилання, а також додав картинку внизу тексту. Це справжня магія!