<!DOCTYPE html>
<html>
<head>
<title>Наслов прозора</title>
<meta charset='UTF-8'/>
</head>
<body>
<h1>Основни појмови</h1>
<h2>Структура и стил</h2>
<p>Прва верзија HTML-а је омогућила да се приликом креирања документа опише и његова структура и његов изглед (стил, форматирање). Структурирање документа је процес идентификације и означавања структурних јединица у документу попут наслова и поднаслова, пасуса, цитата, листи, слика, табела, формулара и елемената формулара, итд. Опис стила документа се односи на то приказ структурних јединица: да ли структурне јединице (на пример, наслови) центриране или са поравнатом само левом маргином, коју фамилију, тежину, стил, величину фонта користе, које боје је текст, а које боје је позадина структурне јединице‚ да ли постоји неки оквир око структурне јединице, колико је растојање садржине структурне јединице од тог оквира (унутрашње маргине), односно колико је растојање структурне јединице од суседних структурних јединица (маргине), на којој позицији у документу се приказује одређена структурна јединица, како се нумеришу листе и слично.</p>
<p>Испоставило се да је за потребе ажурирања и одржавања документа, поготово када се структура документа не мења,
већ само његов изглед, боље решење да се физички раздвоје опис структуре документа и опис стила, односно форматирања документа.
Из наведених разлога се препоручује да се актуелна верзија HTML5 користи искључиво за опис структуре документа.</p>
<h2>Терминологија</h2>
<h3>Етикете (увод)</h3>
<p>За опис структуре у језику HTML користе се етикете (енгл. tag).
Етикете се препознају по знацима 'мање' и 'веће' који ограничавају почетак и крај етикете.
Поменути карактери имају специјално значење, тј. не представљају сами себе и зато се не могу видети у читачу веба.
Ако постоји потреба да се симболи 'мање' и 'веће' прикажу као део документа, морају се употребити тзв. карактерски ентитети.</p>
<h3>Карактерски ентитети</h3>
<p>Сваки карактерски ентитет почиње симболом који означава везник 'и' (енгл. ampersand, изговара се као фраза 'and per se and', али брзо и као једна реч),
а завршава се симболом тачка запета (';').
Пошто и симбол 'ampersand', као и 'мање' и 'веће' има специјално значење у HTML-у (тј. не представља сам себе, већ почетак карактерског ентитета),
и он се, као обичан карактер, представља у тексту помоћу карактерског ентитета:</p>
<ul>
<li>знак 'мање' (<) се представља карактерским ентитетом &lt;</li>
<li>знак 'веће' (>) се представља карактерским ентитетом &lt;</li>
<li>знак 'ampersand' (&) се представља карактерским ентитетом &amp;</li>
</ul>
<p>Постоји још карактерских ентитета о којима ће бити речи касније.</p>
<h3>Етикете (наставак)</h3>
<p>HTML разликује две врсте етикета: отворене и затворене. Једина разлика између њих у погледу означавања је што
се у оквиру затворене етикете наводи коса црта ('/') после знака 'мање'. У досадашњем делу докумета коришћене су
следеће етикете:</p>
<ol>
<li><html> као ознака за почетак HTML-документа;</li>
<li></html> као ознака за крај HTML-документа;</li>
<li><head> као ознака за почетак заглавља HTML-документа;</li>
<li></head> као ознака за крај заглавља HTML-документа;</li>
<li><body> као ознака за почетак тела (садржине) HTML-документа;</li>
<li></body> као ознака за крај тела (садржине) HTML-документа;</li>
<li><h1>, <h2>, <h3> (постоје и <h4>, <h5>, <h6>) као ознаке за почетак наслова и поднаслова HTML-документа; (мање број означава општији наслов);</li>
<li></h1>, </h2>, </h3> (постоје и </h4>, </h5>, </h6>) као ознаке за крај наслова и поднаслова HTML-документа; (мање број означава општији наслов);</li>
<li><p> као ознака за почетак пасуса;</li>
<li></p> као ознака за крај пасуса;</li>
<li><ul> као ознака за почетак неуређене (ненумерисане) листе;</li>
<li></ul> као ознака за крај неуређене (ненумерисане) листе;</li>
<li><ol> као ознака за почетак уређене (нумерисане) листе;</li>
<li></ol> као ознака за крај уређене (нумерисане) листе;</li>
<li><li> као ознака за почетак елемента листе (било да је нумерисана или не);</li>
<li></li> као ознака за крај елемента листе (било да је нумерисана или не);</li>
<li><title> као ознака за почетак наслова прозора (не мешати са насловом документа!);</li>
<li></title> као ознака за крај наслова прозора (не мешати са насловом документа!);</li>
<li><meta> као ознака за почетак метаподатака о документу (у овом случају се ради о кодној шеми UTF-8 коју користи документ);</li>
</ol>
<p>У претходној листу непарни елементи представљају отворене етикете, а парни елементи затворене етикете.
За сваку отворену етикету постоји и наведена је њена затворена етикета, једино за етикету <meta> није наведена
њена затворена етикета (иако постоји!), ни у листи, а ни у самом HTML-документу на месту где је коришћена.
Објашњење је дато у одељку 'Елементи'.</p>
<h3>Атрибути</h3>
<p>У појединим случајевима етикета није довољна да опише неки структурни део документа, већ се етикети придружују
додатне информације преко атрибута. Атрибути се наводе искључиво у оквиру отворене етикете, може их бити један или више,
а њихов запис је у формату 'имеАтрибута=вредностАтрибута', при чему се вредностАтрибута увек записује под знацима навода (апострофима или наводницима).</p>
<p>Један од атрибута елемента 'meta' је 'charset' (скр. од енгл. 'character set', у преводу 'карактерски скуп'),
који се односи на кодну шему (а тиме и карактерски скуп) који је примењен у документу. У овом документу је примењена
кодна шема 'UTF-8', односно карактерски скуп Unicode, чиме је омогућено да у тексту користимо
слова алфабета српског језика, а такође и да у истом тексту истовремено користимо и ћирилицу и латиницу.</p>
<p>Међутим, навођење кодне шеме помоћу елемента 'meta' и атрибута 'charset' није довољно. Датотека у којој се налази
HTML-документ мора бити снимљена (сачувана) са одговарајућом кодном шемом или распоредом (енгл. encoding).
Различити програми на различите начине одређују која кодна шема се користи за чување документа. Notepad, на пример, приликом
првог снимања документа, у дијалогу 'Save As...' нуди падајући мени 'Encoding:' у коме корисник може изабрати кодне шеме
Windows CP-1250 (означена као 'ANSI'), UTF-8, UTF-16 LE (означена као 'Unicode') и UTF-16 BE (означена као 'Unicode big endian'.
Дакле, ако користимо Notepad за куцање HTML-документа и кодну шему UTF-8 као вредност атрибута 'charset' елемента 'meta',
приликом снимања датотеке која садржи HTML-документ у менију 'Encoding:' треба изабрати опцију 'UTF-8'.</p>
<h3>Елементи</h3>
<p>Елемент HTML-документа је структурни део тог документа који се, као посебна целина, састоји из:</p>
<ul>
<li>отворене етикете,</li>
<li>њој одговарајуће затворене етикете и</li>
<li>свега између тих етикета (било да је у питању обичан текст, други елементи или комбинација текста и елемената).</li>
</ul>
<p>Назив елемента је исти као и назив одговарајућих етикета.</p>
<p>У том смислу, цео HTML-документ у коме се тренутно налазимо, не рачунајући прву линију (<!DOCTYPE html>),
представља један елемент који се зове 'html'. Њему одговарајуће етикете су <html> и </html>, између којих
се налазе два елемента, 'head' (заглавље HTML-документа) и 'body' (тело или садржина HTML-документа).
Елементи 'head' и 'body' се такође састоје из других елемената. Садржина појединих елемената је обичан текст (на пример,
елементи 'title', 'h1', 'li'), док је садржај појединих елемената мешовит (видети, на пример, елемент p у одељку
'Елементи, етикете и атрибути за опис стила документа (које треба избегавати!)').</p>
<p>Посебан случај представља елемент 'meta' чији је садржај увек празан, па се због тога 'meta' и слични елементи (на пример, елемент 'br' који означава прекид линије, односно прелазак у нови ред)
називају празни елементи. Празни елементи имају, поред уобичајеног записа, скраћени запис у коме се не наводи затворена етикета,
већ се на крају отворене етикете, пре знака 'веће' наводи коса црта ('/'). Према томе, следећи записи имају исто значење:</p>
<ul>
<li><meta></meta>, <br></br></li>
<li><meta/>, <br/></li>
</ul>
</body>
</html>