2× DVD - Vitajte na stránkach www.einsty.hostujem.sk

I N T E R N E TVytvárame WWW stránky / 4. èasV predošlej èasti sme zaèali s hypertextovými odkazmi a teraz budeme pokraèova. Uká−eme odkazy na èas dokumentu, ïalšie monosti tagu a povieme si nieèo o grafike.Hypertextové odkazyZáklady hypertextových odkazov u poznáme z predchádzajúcej èasti. Aby však odkazfungoval, musíme zada správnu adresu, na ktorú odkazuje. Pri písaní odkazov rozlišuje−me dva typy: absolútne a relatívne. Ako ich budeme pouíva? Tu platí zásada, e priodkazoch na rovnaký server, na akom je umiestnená stránka, sa pouívajú relatívne odka−zy a na iné servery odkazujú absolútne odkazy. Aký je medzi nimi rozdiel?Vezmime si, e máme súbor stranka.htm na serveri www.pcrevue.sk. Jeho adresa jeteda www.pcrevue.sk/stranka.htm. V òom chceme vytvori odkaz na súbor index.htm natom istom serveri. Môeme poui relatívny alebo absolútny odkaz. relatívny: absolútny: Keïe sme si povedali pravidlo, pod¾a ktorého sa odkazy na stránky na tom istom serve−ri udávajú relatívne, pouijeme prvú monos. Keby bol súbor, na ktorý chceme odkáza,v nejakom adresári, pouili by sme takúto relatívnu cestu: relatívne: absolútne: Opaèný prípad je, ak je náš súbor, z ktorého odkazujeme, v nejakom podadresári a chce−me odkáza na súbor o úroveò vyššie. Náš súbor je na adrese www.pcrevue.sk/serial/stranka.htm. Chceme odkáza na www.pcrevue.sk/index.htm. Opä to môeme urobidvoma spôsobmi: relatívne: absolútne: V praxi sa však vyuívajú najmä relatívne odkazy a absolútne iba vtedy, ak sú nevyhnut−né (pri odkaze na stránku na inom serveri).Hypertextové odkazy na jednotlivé èasti dokumentuAk chcete svoj dokument z nejakých dôvodov rozdeli na viac èastí, pouijete práve tútovo¾bu. Èasti dokumentu oznaèíte pomocou tagu . Vysvetlíme sito na nasledujúcom príklade:Vylep enÆ orientÆcia vodJadroZÆver vod...Jadro...ZÆver...V prvom rade si potrebujeme definovanázvy èastí. V príklade sú to èasti s názvami1cast, 2cast a 3cast. Definujeme ich pomo−cou spomínaného tagu . Do tých−to èastí vloíme poadovaný text a pokraèu−jeme tvorbou hypertextových odkazov. Tie satvoria štandardným tagom s týmrozdielom, e namiesto názvu súboru.prípo−na pouijeme #názov èasti. Napríklad .Ïalšie monosti tvorby odkazovTag má ešte nieko¾ko moností: TITLE – je to titulok, ktorý sa zobrazuje, aknávštevník stránky podrí dlhšie myš nadodkazom.Príklad: TARGET – pouíva sa najmä pri stránkach obsahujúcich rámy (frames), keï definujú,v ktorom ráme sa má stránka zobrazi. Pri stránkach bez rámov sa pouíva parameter_blank. Ten spôsobí, e sa stránka otvorí v novom okne.Príklad: ACCESSKEY – pouíva sa na zjednodušenie prístupu. Pomocou neho môete odkazupriradi klávesovú skratku Alt + písmeno.Príklad: IT NewsInternetová grafikaAké by boli naše stránky, keby boli bez grafiky? Dá sa poveda, e grafika je nevyhnut−nos, ale netreba to preháòa. Zaèiatoèníci väèšinou robia chyby v tom, e to s grafikoupreháòajú. Predstavme si stránku, na ktorej blikajú všetky tlaèidlá, cez obrazovku z èasuna èas prebehne psík... Jednoducho úplne nevkusná stránka. A ani rýchlos jej naèítava−nia nie je najvyššia. Niekedy dosiahnete lepší efekt správnym skombinovaním písma a fa−rieb. Pri pouívaní grafiky treba dba na pouitie správneho formátu a optimalizáciu.Internetové prehliadaèe bene podporujú formáty JPEG a GIF. Novšie podporujú aj poma−ly sa rozbiehajúce PNG.GIFJPEG bezstratová kompresia – tento formát sa hodí najmä pre èiarovú grafiku farebná håbka je obmedzená na 256 farieb monos transparentného pozadia monos animácie stratová kompresia, ktorá vyuíva nedokonalos ¾udského oka, tento formát jevhodný najmä na fotografie farebná håbka True Color nemá monos transparentného pozadia nemá monos animácieKadý formát sa hodí na nieèo iné. Po tom, èo si správne vyberieme, treba vloi do HTMLstránky kód. Ten je vo formáte . Tag IMG má mnostvoparametrov, z ktorých najdôleitejšie sú: ALT – je to opis obrázka. Zobrazí sa, ak má pouivate¾ vypnuté zobrazovanie obráz−kov. Tento text pouívajú textové prehliadaèe, zobrazí sa, ak pouívate¾ podrí myš nadobrázkom.Príklad: ALT=opis obrázka WIDTH a HEIGHT – tieto parametre urèujú ve¾kos obrázka. Ak nemáme tieto dvaparametre definované, môe sa sta, e prehliadaè najprv natiahne text a a potomzaène s obrázkami. Stránka sa zaène meni, objekty preskakova a vôbec to nevyzerádobre. Ak sú však tieto dva parametre definované, prehliadaè natiahne výslednú podo−bu aj s miestom pre obrázky.Príklad: WIDTH="šírka v pixeloch" HEIGHT="výška v pixeloch"Výsledok môe vyzera takto Toto boli povinné hodnoty, ktoré by mal obsahova kadý obrázok. Okrem nich existujeaj parameter ALIGN a môe ma nasledujúce hodnoty: ALIGN="left" – zarovná obrázok do¾ava ALIGN="right" – zarovná obrázok doprava ALIGN="top" – horný okraj je zarovnaný s textom, ale text pokraèuje a pod obrázkom ALIGN="texttop" – zhodné s top ALIGN="middle" – stred obrázka je zarovnaný so základòou textu a zvyšok pokraèujepod obrázkom ALIGN="absmiddle" – stred obrázka je zarovnaný so stredom textu a zvyšok pokraèujepod obrázkom ALIGN="baseline" – spodný okraj obrázka je zarovnaný so základòou textu ALIGN="bottom" – totoné s baseline ALIGN="absbottom" – spodný okraj obrázka je zarovnaný so základòou najspodnejšejlinky textuAby sme si to vedeli predstavi, najlepšie je vytvori prázdnu stránku a všetky tieto para−metre si vyskúša.Ïalšími menej pouívanými parametrami sú Border (urèuje šírku rámèeka okolo obráz−ka v pixeloch), Vspace (vertikálny odstup ostatných objektov v pixeloch) a Hspace (hori−zontálny odstup ostatných objektov v pixeloch).Obrázky sa dajú, samozrejme, poui aj v kombinácii s obrázkami a získame nieèo ako„tlaèidlo“. Príklad môe vyzera takto: Výsledok môe by takýto:Ako sme si urèite všimli, okolo nášho obrázka s odkazom je modrý rámèek. Automatickysa pridáva z toho dôvodu, aby sa obrázky s odkazom odlíšili od obrázkov bez odkazu.Tento jav sa však dá odstráni. Staèí, aby sme text upravili tak, e pridáme parameterBorder="0", a rámèek zmizne.ZáverJanuárovú èas seriálu máme za sebou. Do budúcej èasti si môete precvièova prácus obrázkami a monosami ich zarovnávania. V nasledujúcom pokraèovaní sa vrátimek písmu a zaèneme rozsiahlu tému – tabu¾ky.Igor Kulman92 PC REVUE 1/2002