LINUXSOFT.cz Přeskoč levou lištu
Uživatel: Heslo:  
   CZUKPL

> HTML (1)

V prvním díle tohoto seriálu si řekneme, co to vlastně HTML je a co musí správný dokument obsahovat

3.6.2004 15:00 | Pavel Kácha | Články autora | přečteno 68853×

Co to je HTML?

HTML, jak už název napovídá, patří mezi značkovací jazyky, pomocí kterých definujete strukturu dokumentů - v tomto případě webových stránek. To, že jde o značkovací jazyk znamená, že pomocí tohoto jazyka nemůžete dělat žádné výpočty ani grafická kouzla (ale to snad nikoho ani nenapadne... :)). HTML je tu z úplně jiného důvodu, kvůli tvorbě jasně a přesně strukturovaných dokumentů. Možná si myslíte, že vyznačit v dokumentu jeho strukturu není nic obtížného, ale bohužel se na internetu stále objevují dokumenty, které nevyhovují standardům. Někdy to jsou jen drobné chyby, které nevyhovují přísnějším standardům (chybějící popisek obrázku), jindy to jsou ale chyby, které brání správnému zobrazení stránek (chybně ukončená tabulka). Abyste se těchto chyb vyvarovali a využívali HTML v celé jeho síle, je tu tento seriál.

Co musí HTML dokument obsahovat?

Každý dokument musí obsahovat několik základních značek (tagů), které dohromady tvoří kostru stránky vyhovující standardům. Validita stránek by měla být naším hlavním cílem, toho ale nedocílíme bez správné kostry dokumentu.

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). 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. Většina současných prohlížečů pracuje ve dvou módech: standardním (stránka se zobrazuje podle specifikovaného typu dokumentu, aktivuje se při určení typu dokumentu i s URL adresou definice) a nestandardním (stránka se zobrazuje přibližně jako v Netscape 4, aktivuje se pokud není definován typ dokumentu nebo je definována verze starší než HTML 4). K čemu by byla stránka napsaná podle standardu, která by se nezobrazovala tak, jak má?

V tomto seriálu se budeme zabývat poslední verzí HTML 4.01, takže ve svých stránkách se můžete rozhodnout pro jeden z těchto typů dokumentů (vždy si ale zkontrolujte ve validátoru, zda váš dokument odpovídá definovanému standardu):

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).

Po určení typu dokumentu můžeme už přejít k dalším tagům. V HTML se všechny tagy (značky) zapisují do špičatých závorek (<značka>). Značky se dělí na dvě hlavní skupiny

  • párové
  • nepárové

Párové značky musí mít svůj začátek, ve kterém jsou vypsány i atributy doplňující vlastnosti prvku, nějaký svůj obsah a samozřejmě konec - typickým příkladem je třeba odstavec <p></p>. Konec platnosti určitého tagu se označuje pomocí stejného tagu, jako byl začáteční tag, jediný rozdíl je ten, že za otevírací závorku (<) přidáte lomítko (/). Pokud vám na tom není cokoli jasné, nezoufejte, určitě pochopíte na příkladech níže. Nepárové značky naproti tomu nemají žádný obsah, který by ovlivňovaly - nejčastější nepárovou značkou je asi znak nové řádky <br>.

Každá stránka musí být uzavřena do párového tagu <html></html>, který "ohraničuje" celou stránku.

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

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 text/html; charset=iso-8859-2 tuto hodnotu text/html; charset=windows-1250

Další důležitou značkou je <title></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ímto jsme skončili s nejdůležitějšími prvky v hlavičce dokumentu a můžeme ji proto uzavřít tagem </head> a posunout se v tvorbě dokumentu zase o kus dál, tedy k samotnému tělu stránky. 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. Můžete si to hned vyzkoušet. Pokud byste chtěli vytvořit stránku, kde se bude text dělit na několik odstavců využijete k tomu tag <p></p>.

To bude pro dnešek vše. Nakonec ještě musím dodat, že v HTML nezáleží na tom, kolik mezer mezi jednotlivými značkami uděláte, zobrazí se vždy pouze jedna (pokud to přímo nepřikážete nebo nepoužijete režim výpisu s přesným počtem mezer). Také bych vás rád upozornil, že se rozhodně vyplatí uzavírat párové tagy, i když se na mnoha místech můžete dočíst, že to není nutné. Ano, není to nutné, ale potom vznikají stránky, které nejsou jasně pochopitelné pro vás ani pro prohlížeče. Takže si sami zvažte, jestli těch pár klepnutí do klávesnice stojí za to předkládat kvalitně napsané stránky, nebo doufat, že prohlížeč pochopí všechno tak, jak má, a nevzniknou vám na stránce nesmysly.

Základ tedy už znáte a můžete si zkusit vytvořit svůj první dokument v jazyku HTML, takže si otevřete svůj oblíbený textový editor a pěkně směle do toho. Své výtvory ukládejte s příponou .html. Jako inspirace vám může posloužit třeba tento výpis:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"; "http://www.w3.org/TR/html4/loose.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>

Verze pro tisk

pridej.cz

 

DISKUZE

Charset 3.6.2004 09:02 Petr Zajíc
  L Re: Charset 18.12.2005 15:03 Dominik Lakatos
    L Re: Charset 18.12.2005 15:41 Aleš Hakl
      L Re: Charset 19.12.2005 05:56 Petr Zajíc
        L Re: Charset 29.1.2006 21:23 Dominik Lakatos




Příspívat do diskuze mohou pouze registrovaní uživatelé.
> Vyhledávání software
> Vyhledávání článků

14.11.2017 16:56 /František Kučera
Máš rád svobodný software a hardware nebo se o nich chceš něco dozvědět? Zajímá tě DIY, CNC, SDR nebo morseovka? Přijď na sraz spolku OpenAlt – tradičně první čtvrtek před třetím pátkem v měsíci: 16. listopadu od 18:00 v Radegastovně Perón (Stroupežnického 20, Praha 5).
Přidat komentář

12.11.2017 11:06 /Redakce Linuxsoft.cz
PR: 4. ročník odborné IT konference na téma Datová centra pro business proběhne již ve čtvrtek 23. listopadu 2017 v konferenčním centru Vavruška, v paláci Charitas, Karlovo náměstí 5, Praha 2 (u metra Karlovo náměstí) od 9:00. Konference o návrhu, budování, správě a efektivním využívání datových center nabídne odpovědi na aktuální a často řešené otázky, např Jaké jsou aktuální trendy v oblasti datových center a jak je využít pro vlastní prospěch? Jak zajistit pro firmu či jinou organizaci odpovídající služby datových center? Podle jakých kritérií vybrat dodavatele služeb? Jak volit součásti infrastruktury při budování či rozšiřování vlastního datového centra? Jak efektivně spravovat datové centrum? Jak eliminovat možná rizika? apod.
Přidat komentář

13.9.2017 8:00 /František Kučera
Máš rád svobodný software a hardware nebo se o nich chceš něco dozvědět? Zajímá tě DIY, CNC, SDR nebo morseovka? Přijď na sraz spolku OpenAlt – tentokrát netradičně v pondělí: 18. září od 18:00 v Radegastovně Perón (Stroupežnického 20, Praha 5).
Přidat komentář

3.9.2017 20:45 /Redakce Linuxsoft.cz
PR: Dne 21. září 2017 proběhne v Praze konference "Mobilní řešení pro business". Hlavní tématy konference budou: nejnovější trendy v oblasti mobilních řešení pro firmy, efektivní využití mobilních zařízení, bezpečnostní rizika a řešení pro jejich omezení, správa mobilních zařízení ve firmách a další.
Přidat komentář

15.5.2017 23:50 /František Kučera
Máš rád svobodný software a hardware nebo se o nich chceš něco dozvědět? Zajímá tě DIY, CNC, SDR nebo morseovka? Přijď na sraz spolku OpenAlt, který se bude konat ve čtvrtek 18. května od 18:00 v Radegastovně Perón (Stroupežnického 20, Praha 5).
Přidat komentář

12.5.2017 16:42 /Honza Javorek
PyCon CZ, česká konference o programovacím jazyce Python, se po dvou úspěšných ročnících v Brně bude letos konat v Praze, a to 8. až 10. června. Na konferenci letos zavítá např. i Armin Ronacher, známý především jako autor frameworku Flask, šablon Jinja2/Twig, a dalších projektů. Těšit se můžete na přednášky o datové analytice, tvorbě webu, testování, tvorbě API, učení a mentorování programování, přednášky o rozvoji komunity, o použití Pythonu ve vědě nebo k ovládání nejrůznějších zařízení (MicroPython). Na vlastní prsty si můžete na workshopech vyzkoušet postavit Pythonem ovládaného robota, naučit se učit šestileté děti programovat, efektivně testovat nebo si v Pythonu pohrát s kartografickým materiálem. Kupujte lístky, dokud jsou.
Přidat komentář

2.5.2017 9:20 /Eva Rázgová
Putovní konference československé Drupal komunity "DrupalCamp Československo" se tentokrát koná 27. 5.2017 na VUT FIT v Brně. Můžete načerpat a vyměnit si zkušenosti z oblasti Drupalu 7 a 8, UX, SEO, managementu týmového vývoje, využití Dockeru pro Drupal a dalších. Vítáni jsou nováčci i experti. Akci pořádají Slovenská Drupal Asociácia a česká Asociace pro Drupal. Registrace na webu .
Přidat komentář

1.5.2017 20:31 /Pavel `Goldenfish' Kysilka
PR: 25.5.2017 proběhne v Praze konference na téma Firemní informační systémy. Hlavními tématy jsou: Informační systémy s vlastní inteligencí, efektivní práce s dokumenty, mobilní přístup k datům nebo využívání cloudu.
Přidat komentář

   Více ...   Přidat zprávičku

> Poslední diskuze

15.12.2017 15:11 / Petit
freehold nj

15.12.2017 15:06 / Petit
nj freehold

5.12.2017 11:50 / Thomas
kitchen renovations

18.9.2017 14:37 / Rojas
high security vault

15.9.2017 7:33 / Wilson
new zealand childcare jobs

Více ...

ISSN 1801-3805 | Provozovatel: Pavel Kysilka, IČ: 72868490 (2003-2017) | mail at linuxsoft dot cz | Design: www.megadesign.cz | Textová verze