Následující text je obdivuhodný už proto, že ve světě WWW, kde se všechno neustále mění před našima užaslýma očima, si tento minikurs udržel svoji užitečnost po téměř dva roky, které již od jeho napsání uběhly. Ačkoliv mnohé informace (např. o browserech) nám již mohou přijít poněkud zastaralé, jako názorný úvod do světa HTML je text stále ještě použitelný. Ostatně, jeho autorem je Pavel Satrapa, který na toto téma napsal mimo jiné i knihu WWW pro čtenáře, autory a misionáře.

V Computerworldu nyni vychazi podorbny serial o HTML venujici se jak vytvareni vlastni domovske stranky, tak i navodum, jak resit nektere casto se vyskytujici problemy. Autorem serialu je Jiri Kosek ml. a na jeho domovske strance na http://manes.vse.cz/~xkosj06/ naleznete zatim vysled dily serialu v kolonce Bibliografie.

Stante se WWW-autorem

Pavel Satrapa

14. 5. 1995

Cilem tohoto textu je poskytnout nic netusicimu ctenari zakladni poznatky k tomu, aby byl schopen vytvaret jednoduche dokumenty pro World-Wide Web (WWW). Jadrem textu je strucne seznameni s jazykem HTML, ktery je pro tyto ucely pouzivan. 
Nevylucuji, ze text prodela jiste zmeny. Jakekoli pripominky, upozorneni na chyby, namety k doplneni, komentare, penezni i vecne dary ci dalsi odezvy vitam. Ma E-adresa je Pavel.Satrapa@vslib.cz.

. -------------------------
Co je co

World-Wide Web, zkracovany na WWW, je jednou z nejnovejsich sluzeb pocitacovych siti. Je mimoradne ambiciozni, ale bohuzel take narocny na prenosove kapacity. Stavi na principech, ktere v soucasne dobe cloumaji celym pocitacovym svetem. 

Uzivatelsky pritulny: 
klientske programy typicky pouzivaji graficke uzivatelske rozhrani (bez nej ostatne WWW ztraci radu svych vyhod), uzivatel jen cvaka mysi a nevychazi z uzasu. 

Hypertextovy: 
zakladni jednotkou komunikace ve WWW je dokument. Ten muze obsahovat odkazy na dalsi dokumenty. Tyto odkazovane dokumenty se mohou nachazet kdekoli v Internetu. Uzivatel se tedy jednim cvaknutim mysi muze prenest z Japonska do Ameriky. 

Multimedialni: 
krome textu dokaze pracovat i s obrazky, zvuky, animacemi atd. atp. Zkratka vsim, co mame ve zvyku oznacovat slovem multimedia. 

WWW vychazi z modelu klient---server. Uzivatel si pro jeho vyuzivani musi obstarat specialni klientsky program (casto se pro nej pouziva termin prohlizec), ktery pro nej obstarava komunikaci se serverem. Specialitou WWW je velmi vyznamna role, kterou prisuzuje prave klientovi. Ten krome vytvareni dotazu musi zajistit i interpretaci a formatovani dokumentu, ktere ziskal jako odpovedi na sve dotazy. Vzhled a chovani WWW tedy lezi na bedrech klienta. 
Ve svete WWW se casto setkate s nasledujicimi pojmy: 

HyperText Transfer Protocol (HTTP) 
je protokol, ktery definuje pravidla komunikace mezi klientem a serverem. Pro bezneho uzivatele ci autora neni nijak zvlast vyznamny a proto se mu nebudu venovat. Zminim se jen o jedne vyznamne vlastnosti: tento protokol je bezstavovy. To znamena, ze jednotlive dotazy a odpovedi na ne predstavuji zcela samostatne jednotky komunikace. Jestlize server odesle odpoved na dotaz klienta, cela transakce pro nej konci. Pokud vzapeti obdrzi od tehoz klienta dalsi dotaz, nedava jej do zadne souvislosti s dotazem predchozim. Veskere vazby (napr. to, ze dotaz vznikl odkazem z predchoziho dokumentu) obstarava klient. 

HyperText Markup Language (HTML) 
oznacuje jazyk pro popis dokumentu. Dokumenty WWW musi dodrzovat HTML, aby je klienti mohli spravne interpretovat a zobrazit. Dulezitou skutecnosti je, ze interpretace (a tudiz i vzhled) dokumentu je jednoznacne v kompetenci klienta. Na nem zalezi, jak bude formatovat jednotlive prvky dokumentu. Autori nekterych klientu dokonce rozsirili jejich schopnosti za hranice HTML, coz je dvojsecna zbran. Na jedne strane tim zvysuji atraktivnost svych programu a prinaseji nove podnety pro rozvoj HTML. Zaroven tim vsak do HTML vnaseji chaos. Dokumenty vytvorene na miru urcitemu klientovi mohou pusobit problemy jinemu. 

Unified Resource Locator (URL) 
slouzi k definici odkazu na dokumenty. Jeho prostrednictvim lze presne popsat, jak ziskat v Internetu urcitou informaci. URL identifikuje sluzbu, kterou musite pouzit, server a misto na nem, kde se dotycna informace nachazi. 

Existuje nekolik klientskych programu, ktere se vyznamneji zapsaly do historie. Patri mezi ne 
Mosaic 
je klasikem zanru a znacnou merou se podilel na obrovske popularite a rozsireni WWW. Jedna se o grafickeho klienta pro X Window System (Unix), System 7 (Macintosh) a MS-Windows (PC). 

NetScape 
predstavuje pro Mosaic nejvaznejsi konkurenci. Ja osobne mu davam prednost. Neprilis stastnou kapitolu v historii NetScape predstavuje jeho nestandardni rozsireni jazyka HTML. Nastesti se autori rozhodli dalsi rozvoj podridit nove vznikajicimu standardu HTML 3. NetScape je dispozici pro tytez platformy jako Mosaic. 

Arena 
je experimentalni klient. Jiz dnes podporuje jazyk HTML verze 3, ktery je v soucasnosti teprve ve stadiu zrodu. Je k dispozici jen pro X Window System (Unix). 

Lynx 
patri do neprilis pocetne rodiny klientu, pracujicich v textovem rezimu. Lynx je implementovan pro operacni systemy Unix a MS-DOS. 

Velmi castou a logickou uzivatelskou otazkou je: Ktery klient je nejlepsi? Jedina rozumna odpoved na ni zni: Vyzkousejte je a vyberte si sami. Jak uz jsem rekl, ja zpravidla pouzivam NetScape, ale nelpim na nem (cas od casu jej stridam s Mosaicem).

-------------
HTML a dokumenty

Jazyk HTML patri do kategorie markup language. Jedna se o jazyky, u nichz jsou prikazy (v terminologii HTML se jim rika znacky), ovlivnujici vzhled dokumentu, primo soucasti textu. Rozsirenymi zastupci teto kategorie jsou typograficky program TeX ci nroff, troff a spol. 
Pro vytvoreni HTML dokumentu mate k dispozici nekolik moznosti. 

HTML editor. 
Jedna se o editor, urceny primo k vyrobe HTML dokumentu. Zpravidla zna vsechny komponenty jazyka, dokaze kontrolovat spravnost dokumentu a spustit WWW klient k prohlednuti vysledku. Existuje nekolik produktu teto kategorie --- napr. HoTMetaL ci HTML Assistant. Krome toho existuji nadstavby beznych textovych editoru, umoznujici vyrabet HTML z jejich beznych dokumentu. Takove nadstavby jsou k dispozici treba pro MS Word ci Emacs. 

Konvertor. 
Tyto programy slouzi k prevodu dokumentu z nejruznejsich existujicich typografickych ci textovych systemu do HTML. Autor se nemusi ucit nic noveho, vyrobi dokument svym obvyklym zpusobem a na zaver jej necha zkonvertovat do HTML formatu. Tahle moznost zni dost lakave --- vzdy je prijemne rozsirit svuj akcni radius, aniz by se clovek musel neco ucit. V praxi bohuzel narazi na konflikty mezi schopnostmi jednotlivych systemu a HTML. Vysledek konverze je casto zapotrebi rucne upravit do vysledne podoby. Konvertory existuji z LaTeXu, *roffu, RTF a rady dalsich systemu. Napr. tento dokument byl vytvoren v LaTeXu a konvertovan do HTML. 

Rucni prace. 
K ni vam postaci libovolny ASCII editor a znalost HTML. Vytvorite proste text, do ktereho primo zapisete jednotlive znacky. Ja osobne davam tomuto zpusobu prace prednost, zejmena pri vytvareni jednodussich dokumentu. Mym oblibenym HTML editorem je tedy stary dobry vi. 

Znacky
vymezuji jednotlive prvky HTML dokumentu, ktere maji byt zpracovany urcitym specialnim zpusobem. Jejich prostrednictvim se definuji jine druhy pisma, zahlavi, odkazy ci obrazky. V jazyce HTML je znacka tvorena slovem, uzavrenym mezi znaky < a > --- napr. <BODY> zahajuje telo dokumentu (viz dale). Nezalezi na velikosti pismen ve jmene znacky (muzete psat <strong> i <StronG>). Budete-li dokumenty vyrabet rucne, doporucuji stanovit si svou vlastni konvenci a psat znacky jednotnym zpusobem. Napr. ja je pisi velkymi pismeny, coz bude patrne z tohoto textu. 
Rada znacek se vyskytuje v parech, ktere vymezuji rozsah jejich pusobnosti. V takovem pripade je ukoncujici znacka totozna se zahajujici, ale jejimu jmenu je predsazeno lomitko (/). Telo HTML dokumentu je tedy zahajeno znackou <BODY> a ukonceno </BODY>. 
Chovani mnoha znacek ovlivnuji jejich atributy. Podrobneji se jim budu venovat v casti venovane odkazum. 

Kostra dokumentu
obsahuje zakladni format, ktery by mel dodrzovat kazdy HTML text. Vetsina klientu je sice benevolentni a snese dokument, ktery nesplnuje zde uvedene pozadavky. V ramci slusneho vychovani vsak vrele doporucuji, abyste sve dokumenty zasadne opatrili timto zakladnim obalem: 

<HTML>
<HEAD>
hlavicka dokumentu
</HEAD>
<BODY>
telo dokumentu
</BODY>
</HTML> 

Cely dokument je obklicen znackami <HTML> a </HTML>. Sklada se ze dvou zakladnich casti --- hlavicky (mezi <HEAD> a </HEAD>) a tela (uzavreno mezi <BODY> a </BODY>). Drtiva vetsina samozrejme pripada na telo dokumentu. Ostatne bylo by smutne, kdyby platil opak. 
Hlavicka zpravidla byva jen velmi jednoducha. Mela by vzdy obsahovat titulek dokumentu, uzavreny mezi znacky <TITLE> a </TITLE>. Rada prohlizecu jej pouziva pro nadpis okna se zobrazenym dokumentem.

Text

Prvky

HTML zcela ignoruje usporadani textu. Nedela rozdily mezi koncem radku a mezerou, libovolny pocet mezer plati jako jedna. Predstavujte si chovani klienta tak, ze precte dokument a prerovna jej cely do jedne radky (nahradi vsechny konce radku mezerami). Mezi jednotlivymi slovy ponecha vzdy jen jednu mezeru. Teprve pote se zacne zabyvat otazkou, jak dokument zobrazi. Veskera informace o jeho puvodnim tvaru tedy zanikla. Chcete-li vysledny text jakymkoli zpusobem usporadat, musite to dat najevo patricnymi znackami. 
Zakladni cleneni textu na odstavce a pripadne radky zprostredkovavaji dve znacky: 

<P> 
zahajuje novy odstavec (Paragraph) 

<BR> 
zahajuje novy radek (line BReak) 

Chcete-li jeste vice zduraznit rozdeleni textu, muzete pouzit znacku <HR>, ktera vytvori vodorovnou caru pres celou sirku dokumentu (Horizontal Rule). 
Jednim z nejcastejsich pozadavku na libovolny system pro praci s textem je pouzivani ruznych druhu a velikosti pisem. Otazka Kolik to umi pisem? byva jednou z prvnich, zejmena v pripade zacatecniku. Odpovedet na ni v pripade HTML je ponekud osidne. Jak uz bylo nekolikrat naznaceno, zavisi odpoved do znacne miry na klientovi. Vlastni jazyk HTML obsahuje nekolik parovych znacek, umoznujicich ovlivnovat pouzite pismo. 
Elementarni, primo pouzivana pisma jsou tri: 

<B>...</B> 
tucne pismo (Bold) 

<I>...</I> 
kurziva (Italics) 

<TT>...</TT> 
pismo s pevnou sirkou znaku, podobne psacimu stroji (TypewriTer) 

Predchozi tri pary znacek umoznuji pevne predepsat druh pisma. Doporucuje se vsak davat prednost oznaceni logickemu. Tedy navyknout si uvazovat v terminech tento text chci zvyraznit misto prizemniho tento text chci psat kurzivou. Takovy pristup vice odpovida myslence HTML. Pro vymezeni logickych prvku v textu jsou k dispozici tyto znacky: 

<EM>...</EM> 
zvyrazneny text (EMphasized; klientum je doporuceno zobrazovat tyto partie kurzivou) 

<STRONG>...</STRONG> 
durazne zvyrazneny text (doporuceno tucne) 

<CITE>...</CITE> 
citace (doporuceno kurzivou) 

<CODE>...</CODE> 
cast kodu (doporuceno psacim strojem) 

<SAMP>...</SAMP> 
ukazka (doporuceno psacim strojem) 

<KBD>...</KBD> 
ukazka uzivatelskeho vstupu (doporuceno psacim strojem) 

<VAR>...</VAR> 
promenna (doporuceno psacim strojem) 

Mozna jste si jiz polozili otazku, jak dopravit do textu znaky < a >, kdyz jsou urceny pro vymezovani znacek. Problem specialnich znaku je spolecny vsem jazykum kategorie markup language. Jestlize maji byt prikazy bezprostredne soucasti textu, je treba je nejak odlisit. Typicke reseni je vyhradit nekolik znaku se specialnim vyznamem a jejich prostrednictvim pak vyznacovat dulezite konstrukce jazyka. Pochopitelne je treba poskytnout konstrukce, ktere do vysledneho textu vlozi prave zminene specialni znaky. V pripade HTML slouzi k temto ucelum 

&lt 
vytvori znak mensi nez (<) 

&gt 
vytvori znak vetsi nez (>) 

&amp 
vytvori znak ampersand (&) 

&quot 
vytvori znak uvozovky (") 

Znacky pro vyrobu specialnich znaku maji spolecny rys --- vsechny zacinaji znakem &. Krome vyse uvedenych je k dispozici cela rada dalsich znacek pro ruzne symboly, pismena narodnich abeced atd. atp. Navic mate k dispozici znacku &#kod ktera vysazi znak s danym kodem. Jejim prostrednictvim muzete do HTML textu vlozit libovolny znak. 
Tim se nase prochazka jazykem HTML zcela nenapadne ocitla v oblasti kodu. Bohuzel nas hrdy narod Kozinuv opet ostrouhal mrkvicku. Zli Americane nas (ostatne jako obvykle) pustili k vode a jednoznacne stanovili jedinym pravym pro HTML kod ISO 8859--1 (znamy tez jako Latin 1). Ten sice obsahuje nektere z nasich akcentovanych znaku, ale zdaleka ne vsechny. Secteno a podtrzeno: s cestinou je problem. 
Nekteri autori se rozhodli vyuzivat (zneuzivat by mozna bylo presnejsi slovo) skutecnosti, ze HTTP prenasi dokumenty osmibitove a do jejich obsahu nijak nezasahuje. Pokud je dokument sepsan cesky, cesky se tez prenese. Je to sice nestandardni, ale funguje to. Problem ovsem vyvstava v tom, jake kodovani cestiny se pouzije. Zvoli-li autori tento pristup, zpravidla vychazi z toho, ze vetsina potencialnich uzivatelu pouziva klienty pod MS Windows a proto voli jejich kodovani. My ostatni pak jen sedime u svych Unixu ci Macintoshu, zirame na jakesi pitoreskni smesice nahodnych znaku a skripeme zuby. 
V posledni dobe se zacinaji objevovat prostredky pro automaticke prizpusobeni kodu podle prani uzivatele. Tato oblast se v soucasnosti dost bourlive rozviji. Uvidime, zda povede k nejakemu jedine spravnemu reseni. 

Cleneni a formatovani
Vetsina textu byva strukturovana na kapitoly, podkapitoly a podobne. HTML pro tyto ucely nabizi pouziti hlavicek. Jsou vymezeny znackami <Hn> a </Hn>. Text mezi temito znackami je formatovan jako nadpis (hlavicka) prislusne casti dokumentu. K dispozici je sest urovni hlavicek (pripustne hodnoty n tedy jsou 1 az 6), pricemz hlavicka prvni urovne (n=1) je nejvetsi. 

Priklad: Uvod k jakesi prirucce muze zacinat takto: 
<H1>Uvod</H1>
Ctete uzivatelskou prirucku editoru <EM>Edit</EM> verze 1.234.
<H2>Predpokladane znalosti</H2>
Ocekavame Vasi dobrou znalost editoru <EM>Edit</EM> verze 1.233.
<H2>Hardwarove predpoklady</H2>
<EM>Edit</EM> vyzaduje pocitac IBM PC kompatibilni s procesorem
alespon 80586 a minimalne 64 MB RAM (doporuceno 128 MB)...

Citace
z jinych publikaci ci souboru (ale toto formatovani je vhodne kdykoli chcete cast textu odlisit od jeho okoli --- treba priklady ci cviceni) uzavrete mezi znacky <BLOCKQUOTE> a </BLOCKQUOTE>. Text mezi nimi bude zobrazen na uzsich radcich s velkymi okraji. Nektere zobrazovace pro nej navic pouzivaji kurzivu. 

Predformatovany text
se pri zobrazovani ridi zcela jinymi pravidly, nez je v HTML bezne zvykem. Jsou v nem dodrzovany mezery i konce radku. Naproti tomu je zakazano pouzivat v nem znacky pro cleneni ci formatovani. Zkratka se ocekava, ze text jiz je v te podobe, ve ktere ma byt zobrazen. Zvyraznovani a odkazy jsou uvnitr povoleny. Predformatovany text je vymezen znackami <PRE> a </PRE>. Byva sazen pismem s pevnou sirkou znaku. Nejcasteji se pouziva pro ukazky zdrojovych textu programu, konfiguracnich souboru a podobne. 

Seznamy
tvori pomerne pestrou kapitolu HTML. Je podporovano nekolik druhu, ktere se navzajem lisi svym urcenim i formatovanim. 
Seznam definic obsahuje vzdy nadpis polozky (zahajen znackou <DT>) a popisny text k ni (zahajen znackou <DD>). Cely seznam je uzavren mezi znacky <DL> a </DL>. 

Priklad: Uvedme si ukazku z vykladoveho slovnicku: 
<DL>
<DT>pocitac <DD>je zarizeni, schopne kdykoli Vas presvedcit,
ze Vase IQ jen stezi prekroci hodnotu na venkovnim teplomeru
<DT>programator <DD>je (nekdy) vyjimkou, potvrzujici pravidlo
"neexistuje clovek, ktereho by <EM>pocitac</EM> poslouchal"
</DL>

Je-li seznam slozen jen z kratkych polozek, byva v terminologii HTML oznacen za adresar. V tom pripade se pro nej pouzivaji znacky <DIR> a </DIR>. Jednotlive polozky jsou zahajeny znackou <LI>. 

Priklad: Odkazy na jednotlive dily slovniku mohou byt shrnuty do spolecneho seznamu takto: 
<DIR>
<LI>A-H   <LI>I-M   <LI>N-R   <LI>S-Z
</DIR>

O dalsich seznamovych znackach se zminim jiz jen zbezne. Menu (ktere je do znacne miry podobne adresari) se uzavira mezi <MENU> a </MENU>. Pro seznam, jehoz jednotlive polozky jsou cislovany, pouzivejte dvojici <OL> a </OL>. Naproti tomu necislovany seznam je uzavren mezi <UL> a </UL>

-----------
Odkazy

Textovou cast mame uspesne za sebou. Abychom splnili volebni slib, je zapotrebi k ni pridat hyper. Pojmem hypertext byva oznacovan text, jehoz nektere casti predstavuji odkazy na texty jine. 
V HTML jsou odkazy realizovany znackou <A> (Anchor). Je parova a retezec znaku, uzavreny mezi <A> a </A>, reprezentuje odkaz. Je zarazen do textu a nejakym zpusobem zvyraznen (barevne, podtrzenim a podobne). Pokud jej uzivatel vybere (napr. mysi), obdrzi dokument, na ktery tento odkaz vede. 
Cil odkazu je urcovan pomoci atributu teto znacky. V pripade parovych znacek byvaji atributy vzdy soucasti oteviraci konstrukce. Zapisuji se ve forme 
jmeno=hodnota 
Pripustna jmena pochopitelne zavisi na dane znacce --- kazda ma jine atributy. Hodnota byva casto uzavirana do uvozovek. 
V pripade odkazu byva nejcastejsim atributem HREF, urcujici cil odkazu (dokument, ktery ma byt zobrazen po zvoleni odkazu). Jeho tvar je 
HREF="URL" 
Napriklad odkaz na WWW server TU v Liberci (jehoz URL je http://www.vslib.cz/) muze byt do textu zaclenen nasledujici konstrukci: 

<A HREF="http://www.vslib.cz/">liberecky WWW server</A> 

URL v odkazu muze byt relativni. Chybi-li v nem identifikace pristupove metody a serveru, chape se dokument jako soucast tehoz serveru. V tom pripade mohou nastat dva mozne pripady: 

1.Zacina-li URL lomitkem, nahradi v URL aktualniho dokumentu celou cast za identifikaci serveru. Jestlize napr. v dokumentu s URL http://www.x.cz/docs/uvod.html pouzijete odkaz s atributem HREF rovnym /pub/welcome.html, vede tento odkaz ve skutecnosti k dokumentu http://www.x.cz/pub/welcome.html. 

2.Jestlize URL zacina cimkoli jinym, chape se jako relativni vuci umisteni aktualniho dokumentu. Pokud tedy ve vyse zminenem dokumentu http://www.x.cz/docs/uvod.html pouzijete odkaz na URL kapitola1.html, bude pri jeho zvoleni zobrazen dokument http://www.x.cz/docs/kapitola1.html. 

Cile pro odkazy
Ve vetsine pripadu byva odkazovano na cele dokumenty. HTML vam vsak dava moznost odkazovat se i na jejich jednotlive casti. V takovem pripade nejprve musite v cilovem dokumentu polozit znacku na to misto, ktere ma byt cilem budouciho odkazu. Poslouzi vam opet znacka <A>, ovsem tentokrat s atributem NAME. Napriklad konstrukce 

<A NAME="uvod">Uvod</A> 

vytvori v miste sveho vyskytu navesti pro skok se jmenem uvod. Chcete-li se na nej pozdeji odkazat, musite v atributu HREF uvest krizek (#), nasledovany jmenem navesti. Odkazujete-li se v ramci tehoz dokumentu, mate identifikaci cile kompletni. Tedy pokud se v dokumentu s vyse definovanou znackou ma pozdeji objevit odkaz na ni, muze vypadat takto: 

V <A HREF="#uvod">uvodu</A> jsem uvedl... 

Krome toho lze krizek a navesti pripojit za libovolne platne URL dokumentu. Odjinud tedy odkaz muze vypadat 

Viz <A HREF="http://www.x.cz/docs/uvod.html#uvod">uvod</A> clanku...

------------
Obrazky

S hypertextovosti jsme se uspesne vyrovnali, zbyva multimedialita. Odkazovane dokumenty mohou byt ruzneho druhu. V ramci WWW se lze odkazovat na obrazky, zvuky, videosekvence, atd. atp. Klientsky program si zpravidla pro jejich zobrazeni spousti specializovane programy. 
Pro klasifikaci druhu dokumentu byla prevzata typologie z MIME (Multipurpose Internet Mail Extensions --- rozsireni elektronicke posty pro prepravu multimedialnich a jinych rafinovanych dopisu). Kazdemu dokumentu je prirazen urcity typ (napr. obrazek) a podtyp (napr. GIF) podle klasifikace MIME. V konfiguracnim souboru klienta je pak receno, jaky zobrazovac ma byt volan pro kterou dvojici typ+podtyp. Vybere-li uzivatel z aktualniho dokumentu napr. odkaz na zvukovou sekvenci, spravne konfigurovany klient by mu ji mel prehrat (zpravidla tak, ze zavola prehravajici program). 
Krome moznosti odkazat se temer na cokoli umoznuje HTML zarazovat obrazky primo do dokumentu. Klient, pracujici v grafickem prostredi, je pak zobrazi jako soucast dokumentu (napr. symbol firmy v zahlavi stranky, obrazek popisovaneho predmetu a podobne). Jedinym oficialne podporovanym grafickym formatem pro tento ucel je GIF. Posledni verze klientu jsou vsak schopny akceptovat i JPEG. Tato moznost je vsak nestandardni a proto doporucuji (alespon prozatim) drzet se GIFu. 
Obrazek do textu zaradite prostou znackou <IMG>. Vsechny potrebne informace musite doplnit prostrednictvim atributu. Nejdulezitejsi nepochybne je atribut SRC. Urcuje, odkud se ma obrazek vzit. Jeho tvar je SRC=URL. Napriklad 

<IMG SRC="/html/gifs/logo.gif"> 

vlozi do dokumentu na misto sveho vyskytu obrazek logo.gif. Bude pochazet z aktualniho serveru (je pouzito relativni URL) a vede k nemu cesta /html/gifs. Mimochodem --- doporucuji vytvorit si v ramci serveru (ci jeho casti) jeden spolecny adresar pro bezne pouzivane obrazky. Do nej ukladejte obrazky, pouzivane v rade dokumentu (znacky instituci, oddeleni ci autoru, obrazky tlacitek a podobne). Naproti tomu obrazek, specificky pro urcity dokument (napr. zobrazeni popisovaneho predmetu) je vhodne umistit do stejneho adresare, jako dokument. 
Atributem ALIGN muzete ovlivnovat pozici obrazku vuci okolnimu textu. Nereknete-li jinak, je totiz obrazek normalni soucasti textu na aktualnim radku. Mohou byt zarovnany bud jejich horni okraje (horni okraj obrazku s hornim okrajem okolniho textu; tuto variantu naridi atribut ALIGN=TOP) nebo spodni okraje (ALIGN=BOTTOM) nebo mohou byt navzajem centrovany (ALIGN=MIDDLE). 
Je zahodno pamatovat i na klienty, pracujici v textovem rezimu. Jejich uzivatele se musi obejit bez obrazku. HTML umoznuje utesit je alespon napisem, ktery se vypise na miste obrazku. Lze jej definovat atributem ALT="alternativni text". Pokud klient neumi zobrazit obrazek (nektere programy to delaji i v tom pripade, kdy je zobrazovani potlaceno), vypise misto nej alternativni text. 

Priklad: Titulek stranky, venovane TU v Liberci muze vypadat nasledovne
<H1><IMG SRC="/html/gifs/TUlogo.gif" ALIGN=MIDDLE ALT="TU logo"> Technicka univerzita v Liberci</H1> 

Z prikladu je patrne, ze obrazky jsou normalni soucasti textu. Mohou byt tudiz zarazovany do nejruznejsich konstrukci, o kterych jsem mluvil. V prikladu je obrazek soucasti zahlavi prvni urovne (<H1>). Dalsim castym pripadem jsou obrazky, reprezentujici odkazy. Napr. byva pomerne caste zaradit na konec kazde stranky moznost skoku na domaci stranku daneho WWW serveru. Byva reprezentovan ikonou s domeckem (rekneme, ze je ulozena v souboru home.gif). Dotycny odkaz muze byt realizovan nasledovne 

<A HREF="/"><IMG SRC="/html/gifs/home.gif" ALT="Go to home page"></A> 

Podstatne slozitejsi kapitolu predstavuji obrazky s klikou (clickable images, sensitive images). Chovaji se jako mapa --- uzivateli je zobrazen dokument v zavislosti na tom, ktere misto na obrazku s klikou zvoli. Takto lze realizovat napr. turistickeho pruvodce. Uzivatel z mapky vybere pamatku a dostane o ni podrobnejsi informace. Slozitost teto problematiky bohuzel presahuje zacatecnicky uvod do HTML. Mimo jine proto, ze je treba konfigurovat i samotny WWW server. Dovolim si vas odkazat na specializovany text, ktery jsem na toto tema napsal. Najdete jej na URL ftp://ftp.vslib.cz/pub/liane/documents.cz/click-img.ps. odkazat