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

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ů

8.5.2016 17:19 /Redakce Linuxsoft.cz
PR: Dne 26.5.2016 proběhne v Praze konference Cloud computing v praxi. Tématy bude např. nejnovější trendy v oblasti cloudu a cloudových řešení, cloudové služby, infrastruktura cloudu, efektivní využití cloudu, možné nástrahy cloudů a jak se jim vyhnout
Přidat komentář

21.4.2016 8:01 /František Kučera
Spolek OpenAlt zve na 127. distribuovaný sraz příznivců svobodného softwaru a otevřených technologií (hardware, 3D tisk, SDR, DIY, makers…), který se bude konat ve čtvrtek 28. dubna od 18:00 v Radegastovně Perón (Stroupežnického 20, Praha 5).
Přidat komentář

2.3.2016 22:41 /Ondřej Čečák
Letošní ročník konference InstallFest již tento víkend!
Přidat komentář

14.2.2016 16:39 /Redakce Linuxsoft.cz
O víkendu 5. a 6. března 2016 proběhne na pražském Strahově 8. ročník tradiční konference InstallFest. Celkem za dva dny uvidíte ​30 přednášek​ a ​6 workshopů.
Přidat komentář

5.2.2016 17:38 /Petr Ježek
Utilitka z XFce "xfce4-power-manager" nejen umožňuje nastavení lhůty pro uspání či hybernaci, ale i zapínání a vypínání prezentačního módu pro nerušené sledování videí. Stačí ji nastavit v každém vybavenějším panelu a v jakémkoli nontiled WM/DE.
Přidat komentář

10.1.2016 11:32 /Pavel `Goldenfish' Kysilka
LinuxMarket změnil provozovatele. Nově jej provozuje Marek Pszczolka. Více info a detaily #1 a #2.
Přidat komentář

29.12.2015 11:38 /Ondřej Čečák
Ještě posledních pár dní můžete přidávat příspěvky nebo nápady na Install Fest 2016, který se bude konat 5. a 6. března 2016.
Přidat komentář

8.12.2015 11:36 /Petr Ježek
Logické se stává realitou. LibreOffice a Thunderbird se mají dle článku na Redditu stát protiváhou MS řešení (MS Office a Outlook).
Přidat komentář

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

> Poslední diskuze

7.5.2016 14:58 / Teodor Komárek
Soubory

20.4.2016 0:07 / Jakub Cleing
Sázkový panel PHP FUSION

9.4.2016 9:43 / jiwopene@gmail.com
Re: problém s dpkg a nemožností instalovat

9.4.2016 9:41 / jiwopene@gmail.com
Re: změna velikosti disk.oddílu

9.4.2016 9:40 / jiwopene@gmail.com
Re: Přenesení starého OS Win7 na virtuál v Debianu

Více ...

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