Obrázky na stránkách

Při umísťování používejte co největší kompresi, neumísťujte obrázky zbytečně velké a hlavně
se vyvarujte zbytečných a matoucích obrázků, a to nejen kvůli vyšší celkové velikosti stránky
– dbejte na grafickou vyváženost, střídmost a úpravu. Internet by totiž měl být přímočarý
a přehledný, ne plný všelijakých obrázků, které nemají pro uživatele význam.
Umísťujeme obrázky
Značka IMG je jedna z mála nepárových značek HTML. Má základní syntaxi

a definuje soubor s obrázkem, který se má na stránku umístit. Jméno souboru je uvedeno
v hodnotě parametru SRC; pokud není u jména souboru uvedena cesta, jak relativní nebo
absolutní, prohlížeč hledá obrázek v aktuálním adresáři, tedy v tom, kde je umístěn doku−
ment, který obrázek zobrazuje. Celkem lze použít čtyři způsoby zadávání cesty:
_ – Obrázek je umístěn v aktuálním adresáři.
_ – Relativní zadání lokální cesty, obrázek umístěn
v nadřazeném adresáři.
_ – Absolutní zadání lokální cesty, kdy je
obrázek na místním pevném disku v určeném adresáři.
_ – Cesta k obrázku je zadána s celou
URL, kde se obrázek nachází, tzn. lze zobrazit jakýkoliv obrázek na kterémkoliv
serveru na celém světě.
Nejčastěji používané grafické soubory jsou typu JPG a GIF, které zároveň nabízejí nejvyšší
kompresi a tedy i úsporu místa, občas se používá i formátu PNG. Každý z těchto formátů má
svoje výhody a nevýhody, např. GIF může používat průhledné barvy, JPG zase až 16,7 mi−
liónu barev; GIF pouze 256. Dané formáty se tedy používají tam, kde se více hodí.
Potřebujete−li celou barevnou paletu, například u fotografií, použijete JPG. Potřebujete−li
naopak obrázek s průhledným pozadím, sáhnete po GIFu. Formát GIF se také hodí zejména
pro různá tlačítka akcí a jiné grafické prvky.

Na dalším řádku je umístěn obrázek.

Část první: Úvod do Internetu

Výchozí nastavení barev stránky
Každý dokument HTML má svoje výchozí barevné nastavení – barva pozadí, implicitní barva
textu, barva odkazy na jinou stránku, barva odkazu již navštívené stránky apod. Všechny tyto
implicitní barvy se nastavují na začátku zdrojového textu ve značce BODY, která uvozuje tělo
vlastního kódu, který bude prohlížeč zobrazovat (viz kapitola 2).
Jednotlivé jeho parametry jsou následující:
_ BGCOLOR – Barva, která bude použita na pozadí, standardně bílá.
_ TEXT – Implicitní barva textu, která se použije, nestanoví−li uživatel jinak, standard−
ně černá.
_ LINK – Barva odkazu, který jste ještě nenavštívili, standardní nastavení je modrá.
_ VLINK – Barva již navštíveného odkazu, implicitní nastavení fialová.
_ ALINK – Barva odkazu, na nějž jste právě klepnuli, standardně červená.
Pokud tedy použijete ve značce BODY všechny uvedené parametry, vypadá to např. takto:
ALINK="red">
Tato značka nastaví následující barvy: barva pozadí černá, barva textu bílá, barva odkazu ne−
navštívené stránky žlutá, barva odkazu navštívené stránky zelená a konečně barva odkazu,
na nějž jste právě klepnuli, červená.
Programování WWW stránek pro úplné začátečníky

Zadávání barev

HTML definuje pro základní barvy (bílá, černá, modrá, červená atd.) přímé názvy odpovída−
jící anglickému ekvivalentu jména barvy, tedy bílá=white, černá=black, modrá=blue, čer−
vená=red apod. Tyto barvy se zadávají jako hodnota parametrů značek. Jak jste si jistě všim−
li v předchozí kapitole, barva textu se zadává značkou .
Protože nelze pokrýt názvy všechny možné barvy a jejich kombinace, lze barvy „míchat“
pomocí hexadecimálního vyjádření. Např. modrá vypadá takto: #0000FF, jednotlivé složky
barvy – červená, zelená a modrá (red, green, blue – RGB) se tedy zadávají pomocí
osmibitových čísel (8 bitů = 256 kombinací = dvojciferné hexadecimální číslo), tedy v tomto
konkrétním případě je červená reprezentovaná dvojicí 00, zelená také dvojící 00 a nakonec
modrá dvojicí FF. Je nasnadě, že změna poměru barev RGB změní i výslednou barvu.
Základní barvy a jejich hexadecimální vyjádření:
Aqua tyrkysová #00FFFF
Black černá #000000
Blue modrá #0000FF
Fuchsia fialová #FF00FF
Část první: Úvod do Internetu
21
Gray šedá #808080
Green tmavě zelená #008000
Lime zelená #00FF00
Maroon tmavě červená #800000
Navy tmavě modrá #000080
Olive tmavě žlutá #808000
Purple tmavě fialová #800080
Red červená #FF0000
Silver stříbrná #C0C0C0
Teal tmavě tyrkysová #008080
White bílá #FFFFFF
Yellow žlutá #FFFF00
Abyste nemuseli potřebné barvy míchat přímo v HTML podle oka, je dobré je vytvořit nejdříve
v nějakém grafickém editoru, který umožňuje editovat barevnou paletu. Hodnoty tyto barvy
tvořící si zapíšete a teprve pak umístíte do HTML. Upozorňuji, že se musí jednat o barevný
model RGB, nikoliv CMYK!

Efekty a zvýrazňování písma

Každé písmo v HTML, které použijete, může mít v rámci zdůraznění několik zvýrazňujících
prvků. Každý z nich má svoji vlastní značku, která má vliv na veškerý text nacházející se
uvnitř těchto značek. Samozřejmostí je kombinace, tzn. písmo může být jak podtržené, tak
tučné a skloněné.
Pro tyto základní efekty nabízí tedy HTML tyto značky:
_ B – tučné písmo;
_ I – kurziva (nakloněné písmo);
_ U – podtržené písmo;
_ STRIKE – přeškrtnutí písma;
_ BIG – ohraničuje písmo, které bude o jeden bod větší než standardní;
_ SMALL – ohraničuje písmo, které bude o jeden bod menší než standardní;
_ SUB – dolní index;
_ SUP – horní index.
POZNÁMKA: Pokud budete používat kombinace více zvýrazňujících prvků, nezapomeňte na
správný postup při zadávání a ukončování platnosti značek, a sice prvně zadaná značka
musí být ukončena jako poslední a naopak, posledně zadaná značka ukončena jako první.
Bude−li tedy prvně zadána kurziva, následně tučnost a nakonec podtržení, pak nejdříve
musíte ukončit účinek podtržení, následně tučnosti a teprve nakonec kurzivy! Jiný postup než
tento je sice přípustný, vnáší však do zdrojového textu spíše chaos než tolik potřebný pořádek
pro snadnou orientaci v něm.

Odstavce a jejich zarovnání

Pro definici odstavců je nepohodlné používat značky BR. Proto HTML definuje další dvo−
jici užitečných značek, za jejichž pomoci je celý tento úkon podstatně jednodušší a hlavně
zdrojový text se stává čitelnějším.
První z nich je DIV, druhou pak P. Obě jsou párové a ve svém těle definují odstavec. To
znamená, že další text začne na novém řádku. Rozdíl mezi oběma značkami je ten, že P navíc
vynechá jeden prázdný řádek – to proto, že HTML nepoužívá pro rozlišení odstavce odsazení
jeho prvního řádku.
Obě značky mají také jeden důležitý parametry, který definuje zarovnání odstavce v textu:
ALIGN. Jeho hodnoty jsou následující:
_ left – pro zarovnání odstavce doleva (je nastaveno jako implicitní);
_ right – pro zarovnání odstavce doprava;
_ center – pro zarovnání odstavce na střed, vycentrování.
Zde bych rád uvedl ještě jednu zajímavou párovou značku, která vystředí veškerý obsah,
který uzavírá, CENTER. Má tedy vliv jak na text, tak na tabulky nebo obrázky – jde tedy o uni−
verzální způsob, jak dostat daný objekt do středu okna prohlížeče.
Mezi značky pro definici odstavce patří také tzv. citace. Ta daný text odřádkuje, tj. vynechá
před ním prázdný řádek, a provede jeho odsazení o tabulátor. Pro lepší představu příklad:
Dnes máme samozřejmě jiné představy o temperamentech, než ukazuje "šťávová" teorie
Hippokratova a později Galéna, protože víme, že chování a prožívání jsou závislá především na nervové
soustavě a na sociálně psychologických zákonitostech chování člověka. Uvedeme proto
několik definic temperamentů jednotlivých autorů:
"Temperament je dynamický aspekt osobnosti, charakterizující dynamiku psychické
činnosti."
S. L. Rubištejn, 1964
"Temperament se kryje s pojmem typu vyšší nervové činnosti, který je dán vztahem
procesu podráždění a útlumu."
I. P. Pavlov
Citace se definuje značkou BLOCKQUOTE nebo Q, syntaxe pak vypadá takto:

Citovaný text

Neformátovaný text

Základním prvkem, kterým se publikují data na Internetu, je text. K jeho zobrazení není
potřeba žádné zvláštní značky, za text se tedy považuje cokoliv, co není součástí žádné
značky (parametry, hodnoty) uvnitř sekce BODY>Protože prohlížeč nerozlišuje, zda ve zdrojovém kódu stisknete mezi jednotlivými slovy
klávesu ENTER a tak vlastně odsunete zbytek textu za klávesou ENTER na další řádek, používá
se pro oddělení řádku značka BR. Není párová a má jednorázový účinek – odsune následu−
jící text na další řádek.
Stejně jako odřádkování klávesou ENTER ve zdrojovém kódu nemá vliv na formátování
zobrazovaného textu v prohlížeči, nemá na něj vliv ani vícenásobná mezera. Ta je totiž
prohlížečem vždy interpretována jako jediná. Proto se pro pevnou mezeru musí použít
speciální značka,  , přičemž je nutné dodržet tuto syntaxi včetně středníku, jinak
nedosáhnete kýženého efektu.

liv jiné binární soubory, nejsou umístěny ve zdrojovém kódu HTML, ale v externích sou−
borech, na něž ze zdrojového textu odkazujete. Takovýto odkaz, konkrétně na obrázek, byl
uveden i v příkladě v první kapitole:

kdy jde o obrázek se jménem logo.gif, který je umístěn ve stejném adresáři jako kód HTML.
Při zobrazování stránky v prohlížeči je tento obrázek načten do paměti počítače a zobrazen
na obrazovce.
Veškeré příkazy, v HTML nazývané značky (dříve se používalo názvu tag), jsou uzavřeny
ve špičatých závorkách <> včetně všech svých parametrů, které značku ovlivňují. Všechno
ostatní, co se mimo tyto značky nachází, je text, který prohlížeč zobrazí.
HTML používá párové a nepárové značky, kdy párové mají vliv na určitou část dokumen−
tu, např. na text (kurziva, tučnost, zarovnání apod.) – jeho první část se nachází před daný−
mi prvky a druhá za nimi, což přesně vymezuje část, na niž má mít tato párová značka vliv.
Nepárová značka naopak má vliv sama na sebe, definuje v HTML nějaký prvek, například
obrázek, nebo má vztah k celému dokumentu.
Párová značka tedy obecně vypadá takto

kód HTML, na nějž má mít značka vliv

kdežto nepárová takto

Pokud tyto znalosti adaptujete na příklad v první kapitole:


Vítejte na stránkách společnosti Firma, s.r.o.





Společnost Firma se zabývá výrobou nábytku.

pak je příklad párové a IMG a BR nepárové značky. Zjednodušeně lze tedy
říci, že celý zdrojový text HTML se skládá z párových a nepárových značek a textu, který je
umístěn mimo tyto značky, tedy mimo špičaté závorky.
Z předchozích odstavců je vidět, že HTML má dány přesné principy stavby zobrazované
stránky a že je podstatně jednodušší než programovací jazyky, neboť v něm jde pouze
o zobrazování, nikoliv výpočty, skoky, podmínky, funkce, podprogramy aj. Lze jej přirovnat
Část první: Úvod do Internetu
17
k textovému souboru RTF, který také používá k formátování obsahu dokumentu jednoduché
značky, i když jde o formát mnohem komplexnější a nabízející lepší výstup.
Jednotlivých značek má HTML velice mnoho a není účelem této knihy vám je všechny
ukázat a popsat. Stále totiž vznikají nové, které nabízejí bohatší zobrazovací schopnosti –
HTML se stále vyvíjí a to, co je dnes složité, bude se za rok provádět jednou značkou.

Zdrojový text HTML

Každý programovací jazyk má svůj zdrojový text vytvořený programátorem. Stejně tak HTML
má svůj zdrojový text, který popisuje grafickou podobu stránky v prohlížeči. Jako každý jazyk
i HTML má svoji přesnou syntaxi, kterou je nutno dodržovat, ovšem zároveň je velice přizpů−
sobivý. I když se dopustíte nějakých chyb, dokáže většinou prohlížeč zobrazit prakticky celou
stránku tak, jak vypadat má. Více než tři čtvrtiny stránek na Internetu nemají zcela správnou
syntaxi, a přesto jsou zobrazeny správně. Tato flexibilita prohlížečů je dána rychlým vývojem
HTML, prohlížeč tedy přímo předpokládá, že se setká s nesprávnou syntaxí, jako je vynechání
značky, špatné formátování, chybějící uvozovky u hodnot parametrů apod. Ovšem pokud
narazí na zásadní chybu, nedokáže si s ní poradit, a pak je stránka zobrazena špatně. Naštěstí
se zdrojový text HTML velice době ladí, protože jediný výsledek je zobrazení, kdežto u oprav−
dového jazyka jde o složité operace, výpočty, které lze odhalit až při důkladném prozk−
oumání celého programu. U HTML stačí jediný pohled a víte, co není v pořádku. Také je pod−
statně snadnější naučit se HTML, než jakýkoliv programovací jazyk. V podstatě vám na zvlád−
nutí základů postačí jediný den důkladného studia a vlastního praktického zkoušení a experi−
mentování.
Zdrojový text HTML je vždy pouze textový formát ASCII, který má příponu HTM nebo
HTML. V tomto textovém formátu je také interpretován prohlížečem – podoba ASCII je tedy
finální a není dále kompilována do žádného binárního souboru, jako EXE nebo COM. Toto
je zásadní rozdíl od klasických programovacích jazyků, kdy se program musí před použitím
zkompilovat. Všechny ostatní součásti stránky, jako obrázky, zvuky, videoklipy nebo jakéko−
Programování WWW stránek pro úplné začátečníky

Jednoduchá webová stránka

firmy na poli prohlížečů – Microsoft a Netscape, které svými prohlížeči ovládají téměř sto pro−
cent trhu. Každá tedy do svých programů implementuje vlastní značky, takže konečná podo−
ba stránky vypadá v každém rozdílně. Aby se tomuto předešlo, vznikla W3C (WWW
Consorcium), která konečnou podobu HTML schvaluje. Existují tak jednotlivé verze HTML,
každá je schválena po určité době používání. Postup je tak opačný, než by každý očekával –
místo aby něco vstoupilo v platnost a pak bylo užíváno, nejdříve se užívá a pak teprve ofi−
ciálně schválí (nebo také neschválí). V současnosti je poslední schválená verze HTML 4.0,
kterou lze v kompletní podobě dokumentovaného výpisu nalézt na internetové adrese
http://www.w3c.org
Abyste si mohli stránky vytvořené v jazyce HTML potřebujete již zmíněný program, obecně
nazývaný prohlížeč. Ten interpretuje zdrojovou podobu HTML do grafické podoby, která je
čitelná všem uživatelům Internetu (což se o zdrojovém textu říci nedá). Formát HTML je ma−
ximálně úsporný, a sice z důvodu zatím nedostatečné propustnosti internetových linek.
Pokud vezmu tutéž stránku se stejným nebo podobným formátováním, bude tato stránka
v HTML řádově desetinásobně úspornější než tatáž vytvořená programem Microsoft Word.
Tato úsporná data jsou také dekódována do grafické podoby podstatně rychleji než z již
zmíněného dokumentu Wordu. Nevýhodou HTML jsou zatím omezené formátovací možnosti
– na Internetu je totiž vše orientováno na rychlost. Na rozdíl od textového editoru je prohlížeč
skutečně pouze prohlížeč – slouží tedy jen k prohlížení dat, ne k jejich vytváření.

Co je HTML

HTML (Hypertext Markup Language) je v kód, který slouží k zobrazování dat předem
zadaným způsobem; je to vlastně podrobný návod, jak zobrazit přijatá data na obrazovce –
kód HTML je tedy přesným a stručným vyjádřením toho, co chceme zobrazit v programu
obecně zvaném prohlížeč, jedná se o jazyk, který slouží k popisu webové stránky:


Vítejte na stránkách společnosti Firma, s.r.o.





Společnost Firma se zabývá výrobou nábytku.

Ač se vám bude vyjádření téhož v kódu HTML zdát podstatně nesrozumitelnější, vězte, že za
chvíli budete takový zdrojový text číst téměř jako knihu a poznáte z něj, jak bude taková
stránka v prohlížeči vypadat:
V průběhu let vývoje Internetu se samozřejmě vyvíjel i jazyk HTML. Nejedná se v žádném pří−
padě o jednou navržený kód – HTML se dynamicky mění v souladu s technologickým vývo−
jem a požadavky producentů softwaru a jeho uživatelů

Jak uložit aktuální stránku na disk?

Kromě zobrazení zdrojového kódu stránky umožňuje Internet Explorer také tuto stránku
uložit na disk včetně všech objektů a prvků, které jsou ve stránce obsaženy. Z nabídky Soubor
vyberte příkaz Uložit jako, objeví se standardní dialogový panel Windows.
Kromě standardních voleb jako název apod. je důležitá volba Typ souboru, který můžete
zvolit z následujících možností:
_ Úplná stránka WWW – Na disk se uloží jak dokument HTML, tak i veškeré prvky,
které jsou ve stránce obsaženy (obrázky, banery). Stránka bude upravena pro lokál−
ní použití, tzn. při otevření se nebudou tahat obrázky a další prvky z webu.
_ Archiv WWW pro elektronickou poštu – Uloží se pouze jeden soubor s příponou
MHTa tedy jako formát, který se dá poslat elektronickou poštou (Outlook, Outlook
Express). Příjemce této pošty dopis otevře jako internetovou stránku i s obrázky
a dalšími prvky.
_ Stránka WWW, pouze HTML – Na disk se uloží pouze dokument HTML, bez prvků
na obrázku. Je to podobné, jak kdybyste si stránku nechali zobrazit v Poznámkovém
bloku a následně uložili na disk.
_ Pouze text – Vytvoří soubor, v němž budou uloženy pouze viditelné texty stránky,
bez jakéhokoliv formátování.
Základy práce s Internet Explorerem tedy máme za sebou. Pokud chcete jít více do hloubky,
doporučuji knihu Používáme Internet s programem Internet Explorer 5.0 od Jiřího Hlavenky.
Můžeme se tak podívat na základy tvorby stránky; kapitola je shrnutím důležitých kapitol
knihy Tvorba WWW stránek pro úplné začátečníky s tím, že jsou omezeny příklady, chybí
části o seznamech, rámech a tabulkách. Orientuje se totiž spíše na základní znalosti, bez
kterých se při studiu dalších částí neobejdete; pokud je však znáte, klidně přeskočte na
druhou část.
Programování WWW stránek pro úplné začátečníky
14
Dialog pro uložení stránky na disk má navíc jednu položku

Jak se podívat na svoji oblíbenou stránku?

Pokud máte několik oblíbených stránek, které často čtete, např. denní zpravodajství nebo
ekonomické aktuality, můžete, abyste si nemuseli pamatovat všechny jejich adresy a dlouze
je vypisovat do adresního řádku, využít tzv. Oblíbených položek. Jde o jakýsi seznam adres,
které jednoduše vyvoláte přímo z nabídky Exploreru a klepnete na tu vybranou – je to
pohodlné a hlavně rychlé. Tento seznam lze třídit do kategorií a ty do dalších podkategorií,
a to s prakticky neomezeným vnořováním a neomezeným počtem položek. U katalogu
oblíbených položek je relativně pracný jen první úkon, a tím je jeho vytvoření; používání je
pak maximálně jednoduché.
Jakmile se načte stránka, kterou chcete do oblíbených položek přidat, klepněte v nabídce
Oblíbené na položku Přidat k oblíbeným… Objeví se dialogové okno Přidat oblíbenou položku,
v němž se do políčka automaticky vyplní políčko Název. Tento název bude stejný, jako má
aktuální stránka v záhlaví okna. Můžete jej samozřejmě jakkoliv upravit tak, abyste přesně
věděli, jaká adresa se pod danou oblíbenou položkou skrývá. Nyní klepněte na tlačítko OK.
Tato stránka se nyní objeví v seznamu Oblíbených položek, který vyvoláte klepnutím na
nabídku Oblíbené, stejně jako když jste přidávali adresu do seznamu. Pod volbami Přidat
oblíbenou položku a Uspořádat oblíbené položky se nachází dosavadní stránky, které jste do
seznamu přidali buď vy, nebo byly přidány výrobcem programu.
Programování WWW stránek pro úplné začátečníky
12
Když v této nabídce klepnete na jakýkoliv zde se nacházející příkaz, bude patřičná strán−
ka automaticky zobrazena v okně Exploreru (pokud existuje).
Přidávání položek do seznamu je tedy velice jednoduché. Explorer však umožňuje tyto
položky různě kategorizovat a uspořádávat. Abyste mohli přímo při vytváření oblíbené
položky umístit stránku do příslušné složky (např. odkaz na zpravodajství Živě přidat do
složky Zpravodajství), musíte v dialogu na obrázku 26 klepnout na tlačítko Vytvořit >>, které
rozbalí další okénko. V něm vidíte aktuální strukturu oblíbených položek.
Máte−li zde již vytvořené další složky pro oblíbené položky, můžete klepnout na
požadovanou složku (popřípadě na složku v ní zanořenou, používáte−li několik úrovní
vnoření) a pak stisknout tlačítko OK. Potřebujete−li k tomuto účelu vytvořit novou složku
(kdekoli v hierarchii), vyberte složku bezprostředně nadřazenou a zadejte příkaz Nová složka,
pak jméno nové složky a stiskněte OK.
Část první: Úvod do Internetu
13
Přidání oblíbené položky do seznamu
Položku Živě přidáváme do složky Zpravodajství / Počítače

Jak se vrátit na již navštívenou stránku?

Základní pohyb po stránkách se provádí pomocí odkazů. Klepnete myší na odkaz a v okně
Exploreru se zobrazí stránka, na niž odkaz vedl. Pokud třeba zjistíte, že tato stránka není to
pravé, co jste hledali, můžete se na původní stránku vrátit klepnutím na tlačítko Zpět. To vás
vrátí přesně o jednu načtenou stránku. Pokud se chcete vrátit o více než jednu stránku, stačí,
když místo na tlačítko Zpět klepnete na malou šipku, která se nachází vpravo od tohoto tlačít−
ka. Vyroluje se seznam devíti posledně navštívených stránek, které můžete vyvolat pouhým
klepnutím na požadovaný název. Vzhledem k tomu, že si Internet Explorer již navštívené
stránky ukládá na váš pevný disk, nemusíte vždy čekat, až se tato stránka stáhne celá znovu
z Internetu. Někdy se však stránka za dobu, co jste byli pryč, změní, a protože to Internet
Explorer nepozná, zobrazí opět tu, co předtím uložil na disk. To se dá vyřešit buďto stiskem
klávesy F5 nebo klepnutím na tlačítko Obnovit na hlavním panelu. Obojí začne stahovat
aktuální stránku znovu z Internetu, přičemž na disk se uloží tato aktualizované verze.
V okamžiku, kdy se vrátíte na navštívenou stránku, přestane být tlačítko Vpřed zašedlé
a „rozsvítí se“ (tedy zčerná). Nyní na něj můžete klepnout myší. Co se stane? Dostanete se
opět na stránku, kterou jste před chvilkou opustili. Pomocí tlačítek Zpět a Vpřed se můžete
pohybovat tam a zpět po celé historii vašich návštěv; z každého mezikroku samozřejmě
můžete „odbočit“ jinam, a tím změnit celou strukturu historie. Jak to přesně funguje, zjistíte
experimentováním. Stejně jako u vracení i postupu vpřed lze klepnutím na šipku vedle tlačít−
Programování

Internet Explorer a jak ho nakonfigurovat

Okno aplikace Internet Explorer má dvě základní plochy – jednou je plocha, kde se zobrazu−
je vlastní obsah webové stránky, druhou základní nabídka, panel nástrojů, adresní řádek
s webovou adresou aktuální stránky, panel rádio a panel odkazy. Explorer umožňuje nezávis−
lou konfiguraci těchto panelů, takže je nemusíte mít zobrazeny všechny.
Pokud klepnete kdekoliv na panelu pravým tlačítkem, objeví se kontextová nabídka, kde
si zapnete nebo vypnete zobrazení jednotlivých prvků na panelu. To provedete zatrhnutím
nebo naopak odškrtnutím dané položky. Jediné, co nejde vypnout, je hlavní nabídka.
Část první: Úvod do Internetu
7

Internet Explorer 5.0
Na obsah webu se díváme skrze program zvaný prohlížeč. Ten je vstupní branou do tohoto
virtuálního světa, proto musíte dobře znát jak se ovládá, abyste jej sami později mohli efek−
tivně využít jako tvůrci tohoto obsahu. V této kapitole vás stručně seznámím s programem
Internet Explorer 5.0, který je spolu s verzí 4.01 nejpoužívanějším prohlížečem na světě.
Už ve verzi 4.0 byl Internet Explorer velice kvalitním webovým prohlížečem. Integroval
v sobě kromě vlastního prohlížení webových stránek také mnoho dalších komponent, které
přinesly uživatelům webu snazší a jednodušší život. Program je ve verzi 5.0 stále kom−
plexnější, což jej dělá podstatně větším. Už to není jenom prosté prohlížení Internetu – je to
také e−mailový klient (Outlook Express), klient FTP, editor WYSIWIG HTML kódu (Frontpage
Express), přehrávač multimediálních souborů (Přehrávač záznamů) a hodně dalších malých
programů a plug−inů (zásuvné moduly).
V současné době je Internet Explorer nejlepším a nejrozšířenějším webovým prohlížečem.
Jeho konkurenti, kterých kdysi bylo jako máku, se dnes dají spočítat na prstech ruky a navíc
kvalit Exploreru nedosahují. Ač by se mohlo zdát, že se od poslední verze nezměnil, není to
pravda; výrazné změny proběhly zejména uvnitř. Tvář zůstala skoro stejná. Uživateli by se tak
mohlo zdát, že má v ruce jeden a týž produkt. I další profesionální programy (např. Office
2000) se na první pohled neliší, a přitom doznaly obrovských změn. Ovládání programů
zůstává stejné nejen proto, že si na něj lidé zvykli, ale proto, že je velmi blízké ideálu a tudíž
na něm není potřeba téměř nic měnit. I Windows zůstávají téměř stejná už od verze 95; dosta−
la se do stádia, kdy už není potřeba vylepšovat ovládání a vzhled, ale rozšiřovat funkce
a možnosti. Takže ačkoliv řada uživatelů (mezi něž jsem patřil i já) nepozná, že místo čtverky
má na počítači pětku, Internet Explorer 5.0 (verze 5.5 je už v přípravě a venku je první
betaverze) je novým produktem s mnoha novými vylepšeními. Proto se na tuto verzi přesed−
lat vyplatí.
POZNÁMKA: Internet Explorer 5 je integrován v operačních systémech Windows 98 Second
Edition a Windows 2000; pokud máte Windows 95 nebo Windows 98 prvního vydání, musíte
si Internet Explorer 5 nainstalovat dodatečně, instalace má necelých 70 MB a lze ji stáhnout
z adresy http://www.microsoft.com.

Visual Basic

je stejně jako Java vývojovým nástrojem, na němž lze postavit jakoukoliv
aplikaci. Omezen je však pro použití ve Windows, jeho otcem je totiž společnost Microsoft.
VB existuje ve dvou mutacích: Visual Basic pro tvorbu plnohodnotných programů, které běží
v prostředí Windows, a Visual Basic for Applications, který je určen pro programování
rozšiřujících možnost již existujících aplikací Microsoftu. Lze v něm např. programovat makra
pro programy Microsoft Office (Excel, Word, Outlook…).
Přestože oba zmíněné skripty vycházejí z těchto programovacích jazyků, společného za tu
dobu vývoje už mnoho nemají. Více než JavaScript Javě se podobá VBScript Visual Basicu.
V žádném případě však není nutné mít jakoukoliv znalost nějakého programovacího jazyka,
abyste se mohli naučit skripty používat; je to však pro vás malou výhodou.

Skripty a jejich využití

Ve zkratce tedy víme, co jsou skripty. Protože je tato kniha především o nich a o jejich propo−
jení na objekty prohlížeče, povíme si o nich něco více.
Skript je svým způsobem plnohodnotný programovací jazyk upravený tak, aby jej prohlížeč
stíhal překládat a provádět v reálném čase. Jde tedy o jazyk interpretovaný, nikoliv kompilo−
vaný, jako třeba Pascal nebo C++. Zatímco kompilované jazyky jsou před spuštěním
přeloženy do strojového kódu, který je následně spuštěn, skript je prováděn přímo ze svého
zdrojového kódu. Do zdrojového textu webové stránky tedy není vkládán odkaz na nějaký
binární soubor, ale přímo kód skriptu. Na rozdíl od značek HTML neříká prohlížeči, kde
a jaký prvek má zobrazit, ale říká, co má prohlížeč udělat, jaká data zpracovat apod.
Oba používané skripty, JavaScript a VBScript, mají svoje analogie ve světě skutečných pro−
gramovacích jazyků. U JavaScriptu je to Java, u VBScriptu pak Visual Basic. V těchto jazycích
se vytvářejí klasické programy spustitelné i mimo web; oba mají svá jedinečná specifika, proto
je stručně představím:
Java je programovací jazyk velice podobný známému C++. Jeho základní a velice dobrou
vlastností je hardwarová a platformová nezávislost. Nezáleží na tom, na jakém počítači pro−
gram napsaný v Javě spouštíte, poběží totiž všude. To je dáno zvláštním přístupem ke kom−
pilaci. Program napsaný v Pascalu nebo C musíte před použitím zkompilovat do strojového
kódu, což omezuje použití tohoto programu pouze na jednu platformu: program pro
Windows 98 nepoběží na OS/2 nebo Linuxu a naopak. Program v Javě se však zkompiluje
do zvláštního kódu, tzv. Java Byte Code, který je následně kompilován za běhu na dané plat−
formě. Jednoduše řečeno, program je interpretován a prováděn zároveň. Takový kód je stej−
ný pro všechny platformy a je tedy přenositelný z jedné platformy na druhou. Musíte však
mít v počítači interpret Javy – Java Virtual Machine (JVM). Tohle všechno zmiňuji z jednoho
důvodu: JVM je totiž implementován do většiny současných prohlížečů, včetně Internet
Exploreru a Netscape Navigatoru. Důsledky z toho plynoucí jsou nasnadě – program napsaný
v Javě může být součástí webových stránek. Ovšem Java je velice silným nástrojem, který se
pro jednoduché oživení stránky nehodí; proto jsou více využívány skripty, pro svoji jednodu−
chost, rychlost a hlavně optimalizaci pro web. Použít na tyto jednoduché operace Javu je, jako
kdybyste šli s dělem na zajíce.

služeb tohoto skriptu využívají. Odezvy pak mohou být tak dlouhé, že uživatelé stránky
opustí. Proto je současná tendence co nevíce práce přesouvat na klientský počítač, který
nemusí být tak výkonný jako server, protože jeho strojový čas má k dispozici výhradně jeden
uživatel. A tady se rodí prostor pro skripty běžící na klientu, mezi nejznámější patří JavaSript
a VBScript.
Abych mohl lépe vysvětlit, jakým způsobem fungují skripty zpracovávané na straně serveru
a na straně klienta, uvedu příklad. Dejme tomu, že existuje elektronický obchod, kde si lze
koupit rohlíky. Jakým způsobem nákup probíhá u skriptu běžícím na serveru?
1) Vejdu do prodejny a do košíku přidám deset rohlíků.
2) Klepnu myší na tlačítko objednávky, zobrazí se objednávka s deseti rohlíky.
3) Počítač požaduje vyplnit adresu a způsob úhrady nákupu.
4) Vyplníte požadovaná data a odešlete je tlačítkem.
5) Server po obdržení objednávky zkontroluje správnost vámi uvedených dat.
6) V případě chyby vás požádá o doplnění nebo opravu dat v objednávce a skočí zpět na
bod 3.
7) Pokud jsou data správně, zašle potvrzení o přijetí objednávky a zboží expeduje.

Jak se na webu zrodila interaktivita

Když na přelomu osmdesátých a devadesátých let několik vědeckých odborníků spustilo
vlastní počítačovou síť, kterou byli propojeni mezi sebou a na níž publikovali výsledky svého
zkoumání, vědecké zdroje a další informace, nevěděli, že dali základ největší počítačové síti
na světě – Internetu.
Tehdejší Internet byl velice chudý. Byl totiž vytvořen pro vlastní potřebu vědeckých
odborníků, laická veřejnost k těmto stránkám neměla přístup. Nebylo účelem jej používat pro
zábavu a komerci, ale pouze a jen pro odborníky. Webové stránky byly jednoduché, striktní,
informace co nejvíce „stlačeny“ – přenos dat po tehdejší síti nebyl zdaleka tak rychlý, jak je
dnes. Princip tehdejšího Internetu byl tehdy stejný jako dnes: z drahých a výkonných serverů
byla data přenášena na klientské počítače a zde zobrazena.
Protože byl kladen důraz na jednoduchost a rychlost komunikace mezi serverem a klien−
tem, webové dokumenty nemohly obsahovat obrázky – vše bylo tvořeno pouze textem
a odkazy. To znamená, že z jedné stránky vedl odkaz na jinou stránku, která buďto nějaký
pojem na původní stránce vysvětlovala nebo byla s tímto původním dokumentem nějak infor−
mačně provázána. Uživatel se tedy mohl „proklikat“ přes množství stránek až k informaci,
kterou hledal. Tato provázanost pomocí odkazů se nazývá hypertext (to proto, že tehdejší
stránky byly textové).
Oproti dnešku tu však byly i další viditelné rozdíly. Stránky postrádaly jakoukoliv interak−
tivitu, spolupráci s uživatelem. Uživatel tedy nemohl ovlivnit děj na stránce, byl jen pasivním
uživatelem a vstřebavatelem informací. Nemohl např. napsat názor na danou problematiku
a umístit ji na stránku (dnes známá diskusní fóra). Nebylo také možné přímo na webové
stránce provádět např. výpočty, nebylo možné objednávat zboží, nešlo hlasovat v různých
anketách; všechno to jsou věci, bez nichž si dnešní web těžko dokážeme představit. Tehdejší
Část první: Úvod do Internetu
3
Programování WWW stránek pro úplné začátečníky
4
web prostě nebyl živý a dynamický, jaký je teď. Veškeré zásahy šlo provádět pouze ze strany
serveru, něco jako dynamicky generované stránky (ASP) prostě neexistovalo. Web tedy nešlo
označit ani s notnou dávkou představivosti jako „živý“.