HTML.GIF


Obsah lekce:


Jazyk HTML

Zdrojový kód dokumentu psaném v jazyce HTML je prostý text psaný v ASCII formátu, který lze prohlížet i upravovat v libovolném textovém editoru. Jazyk HTML je jazykem typografickým, což znamená, že výsledný dokument pouze popisuje, ale jeho interpretace je přenechána až na cílový browser (čti brouzr = prohlížeč HTML dokumentů - např. Netscape Navigator, Internet Explorer nebo Mosaic).


ZDROJ.GIF
Ukázka zdrojového textu.



Syntaxe příkazů

Úprava textu je realizována pomocí příkazů, které jsou uzavřeny do ostrých závorek "<" a ">". Většina těchto příkazů ohraničujících určitou část textu má na začátku umístěno počáteční a na konci koncové návěští příkazu. Koncové návěští se od počátečního liší pouze umístěním lomítka "/" před název návěští:


<H2> Obsah </H2>


Příkaz, který je tvořen počátečním a koncovým návěštím, se nazývá "kontejner". Avšak ne všechny příkazy jsou ukončovány koncovým návěštím. Jako příklad může sloužit příkaz <BR>, který si v textu vynucuje přechod na nový řádek.
Většinu příkazů lze upřesnit pomocí různých atributů. Atributy jsou psány hned za vlastní počáteční návěští (dovnitř ostré závorky). Hodnoty jsou atributům přiřazovány pomocí rovnítka. Příkladem může být příkaz <IMG> zobrazující obrázek, jehož umístění je uloženo v atributu SRC:


<IMG SRC="image/fotka.gif">


Je běžné, že příkazy HTML lze do sebe vkládat - mezi počáteční a koncové návěští jednoho příkazu se vloží příkaz jiný. Tímto způsobem je možné dosáhnout pozoruhodných výsledků v konečném vzhledu dokumentu.
Pokud prohlížeč některé návěští nezná, jednoduše jej ignoruje. Tedy starší prohlížeč, který nezná některá z nových rozšíření jazyka HTML neukončí svou činnost chybovým hlášením, ale přejde neznámé návěští bez povšimnutí.


URL ADRESA

Hlavním cílem prohlížečů je zajistit přístup ke zdrojům, které se mohou nacházet na libovolném serveru připojeným na Internet. Zdrojem je míněn objekt na Internetu a mohou jím být HTML dokumenty, obrázky, programy a mnoho dalších. K jednoznačné identifikaci těchto objektů slouží URL (Uniform Resource Locator) adresa.
Tyto URL adresy slouží jednak při zadávání adres v prohlížečích, pokud si chcete prohlédnout některý konkrétní dokument nebo do prohlížeče natáhnout nějaký jiný objekt, a jednak přímo v HTML dokumentech, kde slouží k realizaci hyperlinků a vkládání obrázků.

Části kompletní URL adresy:


http://www.oknet.cz/~benni/index.htm
V tomto případě prohlížeč zobrazí HTML dokument index.htm, který je uložen na serveru oknet.cz v adresáři ~benni.


Při zadávání cest je nutno si dát pozor na to, že v jazyce HTML se k oddělení názvů adresářů používá místo obráceného lomítka ("") lomítko normální ("/").
Adresa objektu se nemusí vždy zadávat jako kompletní URL adresa, ale je možné používat i relativní adresy. Relativní adresování se obvykle používá v případech, kdy odkazujete na zdroje uložené přímo na vašem serveru. Základním adresářem je pak adresář, v němž je uložen aktuální dokument.


Příklad.
V rámci dokumentu:
http://www.oknet.cz/~benni/index.htm

má být zobrazena grafika:
http://www.oknet.cz/~benni/Images/pinknet.gif

Potom v návěští IMG stačí zadat cestu:
<IMG SRC="Images/pinknet.gif">



Příkazy každého HTML dokumentu

Některá návěští jsou povinná a tvoří základní kostru každého HTML dokumentu. Celý dokument musí být uzavřen mezi návěští <HTML> a </HTML>. Kromě toho musí každý dokument mít svou hlavičku, která se označuje návěštím <HEAD> a </HEAD>. V hlavičkové části dokumentu je nutné pomocí návěští <TITLE> a </TITLE> zadat název dokumentu. Vlastní obsah dokumetu je pak zadáván do oblasti omezené NÁVĚŠTÍMI <BODY> A </BODY>.
Dále by měl dokument, podle standardu verze 3.2 jazyka HTML, obsahovat oficiální identifikaci HTML dokumentu, která je specifikována v prvku komentáře uvozeného znakem "!" - vykřičník (viz. první řádka zdrojového souboru následujícího příkazu).


Příklad (nejjednodušąí úplná definice stránky).

<!DOCTYPE HTML PUBLIC "-//IETF/DTD HTML v.m//EN">
<HTML>
<HEAD>
<TITLE> </TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>



<! [--text_komentáře_1--] [--text_komentáře_2--] ... >
komentář je text, který přímo s obsahem HTML dokumentu nesouvisí a při zpracování prohlížečem je ignorován; kromě kometování částí dokumentu může mít i jiný specifický účel, jako např.:
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML v.m//EN"> - oficiální identifikace HTML dokumentu
<!--#příkaz parametr=hodnota parametr=hodnota ... --> - příkaz pro server (serverem vkládané vsuvky - server nahradí tyto příkazy v těle dokumentu částmi HTML textu):
#echo var="proměnná" - nahradí vsuvku hodnotou proměnné (LAST_MODIFIED, DOCUMENT_NAME, DOCUMENT_URL, QUERY_STRING_UNESCAPED, DATE_LOCAL, DATE_GMT, ...)
#exec cgi="program" - nahradí vsuvku výstupem spuštěného programu nebo scriptu
#exec cmd="příkaz" - nahradí vsuvku výstupem příkazu standardního interpretu příkazů (shellu)
#size file="soubor" - nahradí vsuvku údajem o velikosti zadaného souboru
#flastmod file="soubor" - nahradí vsuvku dobou poslední modifikace zadaného souboru
#include file="soubor" - nahradí vsuvku obsahem souboru
#include virtual="url" - nahradí vsuvku obecným URL


<HTML> ... </HTML>
párová značka, která slouží k ohraničení každého dokumetu



<HEAD> ...prvky záhlaví... </HEAD>
párová značka, která vymezuje záhlaví dokumentu; obsahuje uspořádanou kolekci informací o dokumentu, která slouží výlučně pro prohlížecí program; do záhlaví dokumentu náleží prvky: <TITLE>, <BASE>, <ISINDEX>, <META>, <LINK>, <STYLE>, <SCRIPT>



<TITLE> ...text titulku... </TITLE>
párová značka, která definuje titulek dokumentu, každý HTML dokument musí obsahovat titulek TITLE (měl by obsahovat stručnou a výstižnou charakteristiku; použije se například v seznamu záložek, zobrazí se na horní liště okna prohlížecího programu a zachovává jej většina vyhledávacích programů; počet znaků by neměl překročit 64 znaků



<BODY background="url" bgcolor=" barva" text="barva" link=" barva" alink="barva" vlink=" barva">
...tělo dokumentu...
</BODY>
párová značka ohraničující celou hlavní část dokumentu
background URL obrázku použitého jako podklad
bgcolor barva podkladu dokumentu
text barva normálního textu
link barva hypertextových odkazů
alink barva aktivních (právě vybraných) odkazů
vlink barva již použitých odkazů