Nadpisy, text, seznamy - aby je prohlížeč rozeznal, označíme je značkami, kterým rozumí. Tyto značky se jmenují tagy.
Všechno, co chceme, aby se na stránce zobrazovalo, budeme psát mezi tagy <body> </body>. Opět připomínám, že se prozatím bavíme pouze o obsahu, nikoli o formě (grafika, design, barvy, fonty atd.).
Při psaní HTML doporučuju dodržovat hierarchii, kterou každý text má - neříkejte že ne, stačí, když má nadpis, a je to tady. Jazyk (X)HTML na to má přímo vlastní tagy.
Teoreticky je možné napsat celý text jako odstavec a některému změnit velikost, barvu, písmo atd. tak, že výsledek skutečně vypadá jako členěný text. Ve skutečnosti, bez formátování, to ale bude pořád jenom text odstavce na stále stejné hierarchické úrovni.
Podívejte se na 2. příklad. Tady je jeho zdrojový kód:
<body>
<h1>Nadpis první úrovně</h1>
<h2>Nadpis druhé úrovně</h2>
<p>text odstavce text odstavce text odstavce</p>
<h2>Nadpis druhé úrovně</h2>
<h3>Nadpis třetí úrovně</h3>
<p>text odstavce text odstavce text odstavce</p>
<ul>
<li>položka seznamu s odrážkami</li>
<li>položka seznamu s odrážkami</li>
<li>položka seznamu s odrážkami</li>
</ul>
<h3>Nadpis třetí úrovně</h3>
<p>text odstavce text odstavce text odstavce</p>
</body>
Ani v příkladech a zkouškách nezapomínejte na správnou strukturu kódu! Doctype a hlavičku tady vynechávám a na konec patří ještě </html> - to by se mělo rozumět samosebou. Můžete se když tak podívat přímo na zdrojový kód příkladu - to platí pro všechny zde uváděné příklady.
Vidíte, že jsme použili různé značky, a výsledek svou formou, aniž bychom se o ni starali, odpovídá svým členěním našemu záměru. To je proto, že jsme použili správné tagy na správných místech. Podíváme se na ně podrobněji.