Create successful ePaper yourself
Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.
• Téma čísla: Technologie webových stránek<br />
Čitelný a přesto mocný<br />
Nejdůležitější myšlenkou u vzniku značkovacích<br />
jazyků (ML – Markup Language) byla<br />
čitelnost. I text, který je složitě označkován,<br />
musí být čitelný a upravitelný v libovolném<br />
textovém editoru. Protikladem jsou třeba<br />
binární formáty MS Office.<br />
Základem ML (a tedy i HTML) je i to, že<br />
značkování neslouží k popisu vzhledu, ale jen<br />
struktury. Už od první verze ale jazyk HTML<br />
obsahoval i několik značek pro vizuální formátování<br />
(např. pro tučné písmo). Tato<br />
nejednotnost vedla ke stavu, kdy dnes stránky<br />
jejich tvůrci formátují pomocí tabulek,<br />
barev, fontů atd. Pro vytvoření jednoduché<br />
stránky se tento postup sice hodí, ale z hle-<br />
Vpozadí všech webových stránek diska větších projektů je cestou do<br />
stojí slovo hypertext. Vzniklo horoucích pekel.<br />
dokonce ještě dřív, než idea<br />
I zde se však našlo řešení. První<br />
World Wide Webu (www). Už kroky omezující možnosti HTML<br />
v šedesátých letech minulého přišly v roce 1996, kdy byla definována<br />
století začali vědci pracovat na způsobu<br />
„řetězení“ textových informací. Problém<br />
tzv. nelineárního spojování dokumentů<br />
(tedy dokumentů, které mohou libovolně<br />
odkazovat na ostatní dokumenty) zpracoval<br />
Theodor Nelson, který také poprvé použil<br />
slovo hypertext.<br />
Mezitím se pracovalo rovněž na popisu<br />
samotného textu, přesněji řečeno jeho<br />
struktury. V roce 1986 vznikl jazyk SGML<br />
(Standard Generalized Markup Language),<br />
který se dokonce stal normou pro popis<br />
dokumentů.<br />
verze 3.2 (dodnes hojně<br />
využívaná). Zároveň vznikly CSS<br />
(Cascading Style Sheets) verze<br />
1.0 (o CSS si můžete přečíst více<br />
například na straně 90). Právě<br />
CSS slouží k popisu vizuálních<br />
vlastností, zatímco HTML se má<br />
věnovat pouze popisu struktury.<br />
Poslední verze HTML 4.01 jde<br />
v tomto směru ještě dál.<br />
Posledním krokem k „vyčištění“<br />
webu je specifikace XHTML 1.0<br />
(eXtensible), která je na tvůrce World Wide Web znamená v překladu celosvětová pavučina<br />
Pronikněte webu<br />
pod kůži<br />
Pavel Nygrýn<br />
Z čeho se skládají webové stránky<br />
Většina uživatelů počítačů zná webové stránky jen ze zobrazení v prohlížeči.<br />
Pokud se ale chcete pustit do tvorby vlastního webu, je nutné vědět, jak vypadají<br />
stránky z druhé strany.<br />
Téma čísla<br />
Grafika pro web 21<br />
Web a normy 22<br />
Jednoduchá stránka 23<br />
Dynamický web 25<br />
Sláva zkratky www začala v mezinárodních<br />
laboratořích CERN ve Švýcarsku. Zde se<br />
objevila skutečná potřeba sdílení dokumentů<br />
a jejich provázanosti. Tim Berners-Lee spojil<br />
značkovací jazyk a ideu hypertextu a v letech<br />
1989–1991 se mu podařilo vytvořit první<br />
verzi jazyka HTML (Hypertext Markup Language),<br />
vyvinout potřebné servery a vytvořit<br />
také prohlížeč (pouze v textovém režimu).<br />
Dalšími významnými milníky byl příchod<br />
grafického prohlížeče Mosaic v roce 1993<br />
a poté příchod firmy Netscape. Do HTML<br />
přibyla možnost vkládat obrázky, vytvářet<br />
tabulky a tím vznikly webové stránky vypadající<br />
v podstatě tak, jak je známe dnes.<br />
mnohem přísnější. Není v ní možné zapomínat<br />
na ukončování značek, ty jsou vždy<br />
párové a nesmí se křížit, parametry musí být<br />
v uvozovkách. Stále ale jde o čistý text.<br />
Základní stavební kameny<br />
Webová stránka, tedy HTML dokument, je<br />
tvořena hlavičkou, ve které jsou uvedeny<br />
obecné informace (jako např. název stránky)<br />
a vlastním tělem dokumentu. To může být<br />
v nejjednodušším případě tvořeno holým<br />
neformátovaným textem. Ano, i takto jednoduchá<br />
může být webová stránka.<br />
Obvykle se ale text nějak člení, už od<br />
verze 1.0 jsou podporovány víceúrovňové<br />
nadpisy. Nejvýznamnější nadpis tedy bude<br />
v textu vypadat takto: Významný<br />
den. Text v odstavci uzavřete mezi <br />
a a základní formátování je hotovo.<br />
HTML je ale jazykem, který ignoruje tzv.<br />
bílá místa – zejména mezery a konce řádků.<br />
Je tedy zbytečné snažit se vzhled textu upravit<br />
těmito prvky, naopak si můžete pomocí<br />
řádkování upravit zdrojový text tak, aby se<br />
vám dobře upravoval. Pokud chcete vytvořit<br />
nový řádek i jinde, než na konci odstavce,<br />
potřebujete značku .<br />
Kdekoli v textu může být umístěn<br />
onen slavný hypertextový odkaz. V nejjednodušším<br />
případě vypadá třeba takto:<br />
web<br />
Computeru. Značka a má tedy parametr<br />
href, který ukazuje, kam bude návštěvník po<br />
klepnutí na web Computeru přesměrován.<br />
Nezávislé obrázky<br />
Protože je dokument tvořen jen textem, není<br />
možné přímo do něj vložit obrázky. Ty se<br />
připojují značkou .<br />
Obrázek je tedy umístěn pomocí odkazu<br />
na soubor. Má to několik výhod. Stránka se<br />
zobrazuje velmi rychle, protože je možné<br />
nejprve načíst text a teprve poté stahovat<br />
podstatně větší obrázek. Stejný obrázek<br />
může být použit na několika místech na<br />
stránce nebo na několika stránkách a prohlížeč<br />
ho musí stáhnout jen jednou.<br />
Tímto způsobem je také možné připojit<br />
obrázek z libovolného místa na<br />
internetu. Zkuste třeba .<br />
Značka img může obsahovat i parametry<br />
určující velikost obrázku nebo popisek, který<br />
se zobrazí v textovém prohlížeči.<br />
Podobným způsobem, tedy odkazem na<br />
soubor, lze do stránek vkládat další objekty –<br />
k tomu slouží značka object, jíž můžete do<br />
stránek vložit prakticky vše, od jednoduchého<br />
obrázku, přes video až po složitý skript.<br />
Aktivní weby<br />
Se samotným HTML ovšem vystačíte pouze<br />
v případě, že vaše stránky nejsou aktivní,<br />
jsou jen statickým textem. Aktivitu jim ale<br />
můžete jednoduše přidat pomocí skriptování<br />
na straně klienta (tedy prohlížeče). Pomocí<br />
Javascriptu či VBScriptu je možné vytvořit<br />
různé webové kalkulačky, efektní nabídky<br />
a podobné vylomeniny.<br />
Skripty na straně klienta ale nemohou<br />
komunikovat s okolím a tedy ani s ostatními<br />
soubory. Pro tvorbu dynamických stránek<br />
• Vytvořit osobní webové stránky<br />
není nic složitého<br />
proto potřebujete skriptování na straně<br />
serveru. Teprve s ním získáte možnost tvořit<br />
nejen webové stránky, ale spíše webové<br />
aplikace. Skripty ve spolupráci s databází<br />
dokáží vytvořit diskusní fórum, webový<br />
obchod a v případě, že komunikují i s dalšími<br />
programy, můžete vyrobit třeba web zobrazující<br />
polohu vašeho auta se zabudovaným<br />
systémem GPS.<br />
Zatímco tvorba webové stránky je jednoduchá<br />
a pomocí několika příkladů ji zvládne<br />
každý, tvorba skriptů už vyžaduje programátorské<br />
znalosti. Na druhou stranu může<br />
být Javascript dobrým místem pro vstup do<br />
programování. Nepotřebujete žádný speciální<br />
editor ani překladač, vstup i výstup je<br />
jednoduchý a vaše programy vám zcela jistě<br />
nenabourají celý systém. Chcete-li se o programování<br />
pro web dozvědět více, přečtěte si<br />
článek na straně 25.<br />
p11633q<br />
20 • Computer <strong>13</strong>-<strong>14</strong>/04<br />
• Příští test bude v sekci Uživatel: Které herní zařízení je nejšikovnější?