Home » Školení » Tvorba WWW – HTML » Struktura stránky

Struktura stránky

Každý dokument musí obsahovat několik základních značek (tagů), které dohromady tvoří kostru stránky vyhovující standardům.


Struktura stránky

Validita stránek by měla být naším hlavním cílem, toho ale nedocílíme bez správné kostry dokumentu.

<!DOCTYPE HTML PUBLIC „-//W3C//DTD HTML 4.01//EN“ „http://www.w3.org/TR/html4/strict.dtd“>

<html>

<head>
<meta http-equiv=“Content-Type“ content=“text/html; charset=ISO-8859-2″>
<title>Moje první stránka</title>
</head>
<body>
<p>Ahoj světe!</p>
<p>Já jsem webová stránka, kterou sis právě napsal.
Moc toho neumím, ale přesto bys mě mohl mít rád – jsem přece TVOJE. </p>
Tak už se loučím
</body>

</html>

doctype
head (hlavička)
body (tělo stránky)

DOCTYPE

Jako úplně první informace by se ve zdrojovém kódu naší stránky, měla objevit informace o tom, jakou verzi HTML na svých stránkách používáme – neboli specifikace typu dokumentu (DTD). DTD je jinými slovy návod pro prohlížeč zpracovávající dokument. Říká mu, jaké elementy dokument používá a jak s nimi zacházet. Element DOCTYPE není součástí HTML dokumentu, není elementem HTML a nemusí mít koncovou značku.

Tato specifikace byla – a bohužel stále je – dost často tvůrci stránek opomíjena, ale přitom jde o zásadní část každého dokumentu. Podle tohoto prvního řádku se určí, v jakém režimu má pracovat validátor, kterým si budete kontrolovat syntaktickou bezchybnost svých stránek, i prohlížeče návštěvníků vašich stránek.

HTML 4.01 Strict
<!DOCTYPE HTML PUBLIC „-//W3C//DTD HTML 4.01//EN“ „http://www.w3.org/TR/html4/strict.dtd“>

HTML 4.01 Transitional
<!DOCTYPE HTML PUBLIC „-//W3C//DTD HTML 4.01 Transitional//EN“ „http://www.w3.org/TR/html4/loose.dtd“>

HTML 4.01 Frameset
<!DOCTYPE HTML PUBLIC „-//W3C//DTD HTML 4.01 Frameset//EN“ „http://www.w3.org/TR/html4/frameset.dtd“>

  • Typy dokumentů strict a transitional se liší jen tolerancí k chybám webmastera a vyžadováním CSS. Stránky psané v HTML 4.01 Transitional jsou mezistupněm mezi starým HTML 3.2 a HTML 4.01 Strict. Ve verzi strict byste si měli zvyknout na veškeré formátování pomocí CSS, pokud si osvojíte tento způsob práce bude pro vás později přechod na XHTML hlavně o změně první řádky určující typ dokumentu.
  • Typ dokumentu Frameset má tytéž vlastnosti, jako typ Transitional, ale je navíc obohacen o podporu rámů (slouží k definici rozložení rámů na stránce, co je to rám si povíme v dalších dílech).

Vlastní HTML

Každá stránka musí být uzavřena do párového tagu <html></html>, který „ohraničuje“ celou stránku. Tento tag je tzv. párový, tzn. že musí mít jak tak otevírací, <html> tak tag koncový </html>.

Hlavička – head

Dalším tagem, na nějž nesmíme zapomenout je opět párový tag označující hlavičku dokumentu, je to tag <head></head>.

Sem se zapisují informace o dokumentu (použité kódování atd.), informace pro vyhledávače (klíčová slova atd.) a titulek dokumentu.

Žádná z informací uvedených v hlavičce se nezobrazí ve formě textu na výsledné stránce; přesto mají na zobrazení stránky velký vliv.

  • Kódovat stránky budete nejspíš v kódování iso8859-2, proto napište mezi tagy <head></head> tento řádek
    <meta http-equiv=“Content-Type“ content=“text/html; charset=iso-8859-2″>

    Pokud byste někdy museli psát stránky pod Windows použijte místo charset=iso-8859-2 tuto hodnotu charset=windows-1250.

  • Další důležitou značkou je <title>, do které se uzavírá nadpis stránky, který se má zobrazit v titulku okna prohlížeče nebo záložky. Pokud tuto značku nepoužijete, objeví se v titulku adresa URL.

Tělo stránky – body

Tělo stránky je ta část, kterou vidíte ve svých prohlížečích jako tabulky, odstavce, seznamy, články atd. Tělo stránky se označuje zcela prozaicky tagem <body></body>, který následuje hned za tagem označujícím konec hlavičky (</head>). Pokud mezi tagy <body></body> vložíte nějaký text, tak se vám (kromě HTML tagů) zobrazí v prohlížeči.