Kaip Web'e atsiranda piešinukai

Yra senas kaip pasaulis mitas, kad piešinys vertas kelių tūkstančių žodžių. Sunku ginčytis su mitais ir religiniais fanatikais, tačiau vis vien noriu paklausti "Ar tai tikrai geriau?" Juk tas posakis buvo skiriamas piešiniui bendrąja prasme, o ne voratinkliui (Web) su ribotomis perdavimo galimybėmis, įvairiomis suspaudimo schemomis, spalvų transformavimo schemomis, 16-os spalvų 600x400 taškų displėjais. Tokioje terpėje piešinys kartais atrodo kaip murzina dėmė. Tiek to, kaip piešinukai atsiranda www puslapyje.

Piešiniai yra pats paprasčiausias HTML puslapio elementas. Ir net keli mažyčiai piešinukai gali puslapį išskirti iš kitų. Pagrindinė priemonė juos įtrauki yra <IMG SRC=...> direktyva. "SRC" nurodo piešinio failo vardą, pvz., <IMG SRC="grybas.gif">. Vietoje failo vardo gali būti ir programos, kuriančios piešinio vaizdą, "Internet" adresas, - taip veikia daugelis skaitliukų.

Jeigu piešinys yra teksto dalis, galima nurodyti, kaip jis bus "lygiuojamas" su šiuo tekstu, - tam skirtas ALIGN parametras, pavyzdžiui, <IMG SRC="grybas.gif" ALIGN="top">. Visos peržiūros programos supranta TOP (ties didžiausio eilutės elemento viršumi), MIDDLE (centre) ir BOTTOM (teksto apačios "bazės" linija) lygiavimo atributus. Kad galima būtų tiksliau valdyti piešinių išdėstymą, "Netscape" įtraukė ir keletą naujovių, kurios išplito:

ALIGN=TEXTTOP - ties teksto viršumi;

ALIGN=ABSMIDDLE - eilutės centre;

ALIGN=BASELINE - atitinka ALIGN=BOTTOM

ALIGN=ABSBOTTOM - ties žemiausio eilutės elemento kraštu.

Tačiau vis vien piešiniai ir tekstas nenorėjo meiliai bendrauti. Pabandykite piešinį įdėti pastraipos viduje ir pamatysite, kad jis "surištas" tik su viena eilute, o kitos "neplaukia" apie jį (žr. pavyzduką) Todėl HTML 3.0 specifikacijoje papildomai įtrauktos horizontalaus lygiavimo RIGHT ir LEFT atributai. Reikalai iškart pagerėja!

Naudojant šiuos atributus, tekstas pildomas šalia piešinių eilutė po eilutės. Jeigu norite nutraukti teksto pildymą, galite įterpti <BR> direktyvą - "nulaužti" eilutę, - joje nurodydami CLEAR atributą, kurio leistinos reikšmės yra LEFT, RIGHT ir ALL. Pavyzdėlyje buvo panaudotas atributas ALL:

<P ALIGN="center">
<IMG SRC="grybas.gif" ALIGN="left">
<IMG SRC="vover.gif" ALIGN="right">
<FONT SIZE=+2>
Kas Lietuvoje nežino, kur daugiausia grybų?
<B>Varėna!</B> <BR>
Jei ne grybai, uogos, dzūkų mergos būtų nuogos!..
</FONT>
<BR CLEAR="ALL">

<P>Šiame kukliame pavyzdėlyje pristatysime
šio miškingo krašto įdomybes ir žmones.

<BR CLEAR=LEFT> ir <BR CLEAR=RIGHT> nurodo, kad reikia tęsti tekstą nuo pirmos tuščios kairės ar dešinės paraštės. <BR CLEAR=ALL> - nuo pozicijos, kurioje abi paraštės tuščios.

Rėmeliai

Dažniausia piešiniai neįdedami į rėmelius, nebent tada, kai jie yra nuorodos į kitą Internet puslapį dalis, - tada piešinių rėmelius yra tokios pat spalvos, kaip ir kitų nuorodų, esančių puslapyje (dažniausia mėlynos ar purpurinės spalvos). Tačiau rėmelį galima nurodyti ir tiesiogiai panaudojus BORDER atributą, kuris nurodo rėmelio plotį, pvz., <IMG SRC="grybas.gif" BORDER=5>. Nulinė reikšmė reiškia, kad rėmelis nebus naudojamas.

Alternatyvos

Nepaprastai svarbus yra ALT atributas ir jo nereikėtų niekada ignoruoti. Jis nurodo, kokį tekstą reikia pateikti piešinio vietoje, kol šis dar nėra atsiųstas. Peržiūros programos iš pradžių atsisiunčia tik www puslapio tekstą, jį nagrinėja ir tik tada atsisiunčia papildomus elementus, pavyzdžiui, piešinius. Tačiau piešiniai gali būti didelės apimties, ir kol jie atkeliaus, gali praeiti kelios ar net keliolika minučių. Tačiau piešinio vietoje bus pateiktas tekstas, nurodytas ALT parametru, pavyzdžiui, <IMG SRC="grybas.gif" ALT="GRYBAS">.

Kokio dydžio piešinys?

Piešinys yra tam tikrų išmierų. Geriausiai, kai jo aukštis ir plotis yra toks, kaip ir turi atrodyti www puslapyje. Tačiau piešinį galima ir "patampyti", nurodžius HEIGHT ir WIDTH parametrus, pavyzdžiui, <IMG SRC="grybas.gif" WIDTH=156 HEIGHT=156>. Tačiau stenkitės išvengti piešinių "tampymo", nes ne visos peržiūros programos sugeba dinamiškai pakeiti piešinio dydžio, - vieną kartą ir šių eilučių autoriui teko raudonuoti, - "jaunas - kvailas".

Tačiau rekomenduojama šiuos parametrus nurodyti net ir tada, kai puslapyje piešinys bus pateikiamas tikruoju dydžiu. Tai suteikia peržiūros programai papildomos informacijos ir pagreitina puslapio pateikimą ekrane, nes nereikia atsisiųsti net ir piešinio antraštės, kad sužinotų, kiek gi iš tikro vietos palikti piešiniui.

Tuščios lankos aplink

Taigi, savo www puslapyje įdėjote piešinuką ir netikėtai aptikote, kad tarp jo ir teksto nepaprastai mažas tarpelis. Ne taip netinka! Ir čia padeda nauji atributai HSPACE ir VSPACE, nurodantys kiek tuščios vietos palikti šalia piešinio, pvz.,

<IMG SRC="grybas.gif" ALT="GRYBAS" BORDER=0 WIDTH=156 HEIGHT=156 HSPACE=32 VSPACE=32>.

Fonai, čerpės ir vandens ženklai

Piešinukas, panaudotas fonui, labai pagerina puslapio išvaizdą. Tačiau nepradėkite piktnaudžiauti jais! Jis turi būti vien fonas ir neblaškyti dėmesio skaitant informaciją puslapyje. Nebent būtų toks tikslas...

Rekomenduojama, kad pagrindinis puslapio tekstas prasidėtų <BODY> direktyva (nors tai ir nėra būtina). Šioje direktyvoje galima nurodyti puslapio foną (nepamirštant, kad kartu reikia nurodyti ir kuo artimesnę fono spalvą - trejulę: raudona-žalia-mėlyna), pavyzdžiui, <BODY BACKGROUNG="samanos.jpg" BGCOLOR="#008800">.

Taip nurodytas fono piešinys yra dauginamas suklijuojant jį patį, kad užpildytų visą ekraną (kaip "čerpės" ar "šiferis"). Vaikštant po puslapį vienu metu vartosi ir tekstas ir puslapis. Tačiau "Microsoft Explorer" supranta atributą BGPROPERTIES=FIXED, pririšantį foną, - tada vartosi tik tekstas.

Kas dar?

<IMG ...> direktyvoje LOWSRC atributas nurodo alternatyvų piešinuką (dažniausiai žemesnės rezoliucijos, ir kelis kartus mažesnės apimties), kurį reikia pateikti vietoje pagrindinio, kokybiško ir dažnai milžiniškos apimties piešinio.

DYNSRC yra "Microsoft Explorer" išplėtimas, nurodantis AVI (video) failus. Jis susijęs su visa krūva papildomų atributų, pvz., LOOP, nurodančiu, kiek kartų kartoti šį "klipą" ir kitus. Besidomintys gali patys pasiskaityti http://www.microsoft.com/ie puslapyje.

Na o papildomų patarimų kaip palengvinti skaitytojams Jūsų ruošiamų puslapių vartymą, gal būt, sulauksite kitame numeryje. Jei Dievas duos...


(C)1996, spalis. Vartiklis. Pasiliktos visos teisės.


Šiuo metu taip pat galite pasiskaityti straipsniukus apie:
Kas yra HTML?
Kas yra CGI?
JavaScript pradžiamokslį,
JavaScript eilutes,
JavaScript laiko objektas,
JavaScript rėmeliuose
Sugrįšk, kol nevėlu... - 'Back' mygtukas ir
Kokie nauji JavaScript elementai naujoje versijoje?
Įvadas į Perl kalbą: Kas naudoja Perl?