Що таке файл HTM?
Файли з розширенням .htm представляють мову гіпертекстової розмітки для створення веб-сторінок для відображення у веб-браузерах, таких як Google Chrome, Internet Explorer, Firefox та ряді інших. Він визначає розмітку для створення статичних сторінок для публікації у Всесвітній павутині (WWW) для доступу інших. Ці розмітки повідомляють браузерам, як відображати вміст веб-сторінки. Такі сторінки можуть містити звичайний текст, зображення, гіперпосилання на інші сторінки, відео та іншу медіаінформацію. Коли веб-сторінка опублікована, ви можете переглянути код розмітки за нею, переглянувши вихідний код сторінки. Сучасні браузери дозволяють перевіряти кожен розділ веб-сторінки, де розроблено кожен підрозділ або елемент розмітки в джерелі HTM.
Коротка історія HTM
Специфікації HTML підтримувалися Консорціумом Всесвітньої павутини (W3C) з 1996 року. У 2000 році вони також стали міжнародним стандартом (ISO/IEC 15445:2000). У 1999 році був опублікований HTML 4.01. У 2004 році робоча група Web Hypertext Application Technology (WHATWG) почала працювати над версією HTML5, яка стала спільною поставкою з W3C у 2008 році. Її було завершено та стандартизовано 28 жовтня 2014 року.
Формат файлу HTML
Документ HTML 4 складається з трьох частин:
- рядок, що містить інформацію про версію HTML
- декларативний розділ заголовка
- тіло, яке містить фактичний зміст документа. Тіло може бути реалізоване елементом BODY або елементом FRAMESET, щоб містити тіло в кадрах
Кожний розділ може починатися або слідувати за пробілами, новими рядками, вкладками та коментарями. Нижче наведено приклад простого документа HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>Understanding HTML File Format</TITLE>
</HEAD>
<BODY>
<P>Hello World!
</BODY>
</HTML>
Інформація про версію
Перший рядок коду, , називається декларацією doctype і повідомляє браузеру, у якій версії HTML написана сторінка. Залежно від версії HTML існує кілька різних декларацій doctype, які визначають визначення типу документа (DTD), що використовується для документа. Кожен DTD відрізняється від інших елементами, які він підтримує, і відрізняються наступним чином:
- HTML 4.01 Strict – включає всі елементи й атрибути, які не застаріли або не відображаються в документах фреймів
- HTML 4.01 Transitional – включає все, що містить суворий DTD, а також застарілі елементи й атрибути (більшість із яких стосується візуального представлення
- Набір фреймів HTML 4.01 — включає все, що є в перехідному DTD, а також фрейми
Для HTML5 інформація про версію така, як зазначено нижче.
<!DOCTYPE html>
Інформація заголовка
Заголовок документа HTML може містити ряд елементів HTML, які не відтворюються браузером. Такі елементи є або метаданими, які описують інформацію про сторінку, або містять розділи, які використовуються для отримання інформації із зовнішніх ресурсів, таких як таблиці стилів CSS або файли JavaScript. Заголовок сторінки позначається символом <head> тег і закінчується на </head> тег.
Інформація про тіло
Це головний розділ у файлі, який містить увесь вміст файлу, який відображається браузерами. Тіло HTML може містити розмітки, які можуть посилатися на різні будівельні блоки у формі тегів. Він може містити кілька різних типів інформації, як-от текст, зображення, кольори, графіку тощо. Крім того, аудіо- та відеоелементи також можуть бути вбудовані в тіло html для відтворення браузерами. За наявності сучасних таблиць стилів для візуального представлення атрибути представлення BODY, такі як колір фону, колір посилання, колір тексту тощо, застаріли. Таким чином, тих самих ефектів можна досягти за допомогою таблиць стилів, як показано нижче:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>Inline Style Sheets referencing</TITLE>
<STYLE type#"text/css">
BODY { background: white; color: black}
A:link { color: red }
A:visited { color: maroon }
A:active { color: fuchsia }
</STYLE>
</HEAD>
<BODY>
... document body...
</BODY>
</HTML>
Вбудовані таблиці стилів легко вбудовувати, а для швидкого застосування візуальних ефектів зовнішні таблиці стилів роблять зручнішим одноразове розгортання та доступ у багатьох місцях.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>Linking to External style sheets</TITLE>
<LINK rel#"stylesheet" type#"text/css" href#"smartstyle.css">
</HEAD>
<BODY>
... document body...
</BODY>
</HTML>
Елементи HTML
Як згадувалося раніше, вміст усередині HTML Body представлено тегами, також відомими як елементи Html. Кожен тег може мати додаткову інформацію у вигляді атрибутів, які записуються як
<tag attribute1#"value1" attribute2#"value2">
хоча не обов’язково мати атрибути з кожним тегом. Якщо атрибути не згадані, у кожному випадку використовуються значення за замовчуванням. Нижче наведено деякі приклади елементів:
Заголовок
<head>
<title>The Title</title>
</head>
Заголовки
<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>
<h5>Heading level 5</h5>
<h6>Heading level 6</h6>
Абзаци
<p>Paragraph 1</p> <p>Paragraph 2</p>