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 68187×

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ů

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ář

15.4.2017 15:20 /František Kučera
Máš rád svobodný software a hardware nebo se o nich chceš něco dozvědět? Zajímá tě IoT a radiokomunikace? Přijď na sraz spolku OpenAlt, který se bude konat ve středu 19. dubna od 18:30 v Šenkovně (Sokolská 60, Praha 2).
Přidat komentář

5.3.2017 19:12 /Redakce Linuxsoft.cz
PR: 23. března proběhne v Praze konferenci na téma Cloud computing v praxi. Hlavními tématy jsou: Nejžhavější trendy v oblasti cloudu a cloudových řešení, Moderní cloudové služby, Infrastruktura současných cloudů, Efektivní využití cloudu, Nástrahy cloudových řešení a jak se jim vyhnout.
Přidat komentář

27.2.2017 22:12 /František Kučera
Pozvánka na 137. sraz OpenAlt – Praha: Tentokrát jsme si pro vás připravili neobvyklou akci. Ve středu 1.3. v 17:30 nás přivítá sdružení CZ.NIC ve svých prostorách v Milešovské ulici číslo 5 na Praze 3, kde si pro nás připravili krátkou prezentaci jejich činnosti. Následně navštívíme jejich datacentrum pod Žižkovskou věží. Provedou nás prostory, které jsou běžnému smrtelníkovi nedostupné!
Po ukončení prohlídky se všchni odebereme do hostince U vodoucha, Jagelonská 21, Praha 3 pochutnat si na některém z vybraných piv či dát si něco na zub. Rezervaci máme od 19:30, heslo je OpenAlt.
Ale pozor! Do prostor datového centra máme omezený přístup, dostane se tam pouze 10 lidí! Takže kdo přijde dříve, ten má přednost, a občanky s sebou! Kdo nebude chtít na prohlídku datového centra, může se pomalu přesunout do hostince U vodoucha a u nepřeberné nabídky piv počkat na ostatní.
Přidat komentář

18.1.2017 0:49 /František Kučera
Členové a příznivci spolku OpenAlt se pravidelně schází v Praze a Brně. Fotky z pražských srazů za uplynulý rok si můžete prohlédnout na stránkách spolku. Příští sraz se koná už 19. ledna – tentokrát je tématem ergonomie ovládání počítače – tzn. klávesnice, myši a další zařízení. Také budete mít příležitost si prohlédnout pražský hackerspace Brmlab.
Přidat komentář

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

> Poslední diskuze

11.5.2017 23:32 / lelo
Re: Problém se správcem balíčků

11.5.2017 5:45 / davd mašek
Re: Problém se správcem balíčků

10.5.2017 22:54 / lelo
Re: Problém se správcem balíčků

10.5.2017 22:19 / davd mašek
Problém se správcem balíčků

17.4.2017 19:15 / Jakub shoop
chyba

Více ...

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