Tietotori – Osallistu ja vaikuta

Tietotori

05 Kuvien liittäminen sivuihin

Kuvien liittäminen sivuihin

Jos sivuun halutaan liittää kuvia, ne määritellään <IMG SRC>-tageilla. Kuvat ovat oikeastaan puolet sivusta - ilman niitä WWW-sivu on tylsä ja ilmeetön. Kuvilla sivuille voidaan antaa tunnelmaa ja sivuista saadaan kiinnostavammat.

Jotta kuvia voidaan näyttää WWW-sivun osana, niiden tulee sijaita jollakin WWW-palvelimella, jotta WWW-sivu voidaan linkittää niihin. Ei riitä että ne sijaitsevat käyttäjän omalla kotikoneella - ellei kotikonetta käytetä henkilökohtaisena WWW-palvelimena. Kuvien tulee myös olla GIF- tai JPEG-muotoisia, sillä nämä muodot ovat yleisimmät WWW-selainten ymmärtämät kuvaformaatit. Kuvia voi konvertoida näihin muotoihin lähes kaikilla kuvankäsittelyohjelmilla. GIF-formaattia kannattaa käyttää kuvissa, joissa on suuria yksivärisiä pintoja. Mikäli kuvassa on monia häivytyksiä ja väriliukuja, kannattaa käyttää JPEG (eli JPG)-formaattia.

Tässä esimerkki WWW-sivusta, jolla on yksi kuva:

<HTML>
<HEAD>
  <TITLE>Jaskan sivu</TITLE>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<CENTER><FONT SIZE="+3" FACE="arial,geneva,helvetica">Jaskan kotisivu
<HR>
</FONT><FONT FACE="arial,geneva,helvetica">Kasvokuvani</FONT>
<P><FONT FACE="arial,geneva,helvetica"><IMG SRC="jaskan_naama.gif"></FONT></P></CENTER>
</BODY>
</HTML>

Tagi <IMG SRC>, tässä tapauksessa <IMG SRC=”jaskan_naama.gif”> määrittelee sivulle kuvan. Tämän tagin avulla kuva näkyy sivulla, vasemmassa laidassa, oikeassa koossaan. Jos haluttu kuva sijaitsee jollakin toisella palvelimella tai toisessa hakemistossa kuin käyttäjän sivu, tulee käyttää tiedoston koko polkua, muodossa ”http://www.jokupaikka.fi/jokuhakemisto/jokukuva.gif”. Jos kuva sijaitsee samalla palvelimella ja samassa hakemistossa kuin sivu jolla sen halutaan näkyvän käytetään pelkkää tiedostonimeä, esimerkiksi ”jokukuva.gif”. IMG-tagia ei tarvitse sulkea.

Mikäli kuva halutaan keskelle sivua vasemman laidan sijaan, se täytyy ympäröidä tagiparilla <CENTER> - </CENTER> näin:
<center><IMG SRC="jaskan_naama.gif"></center>

Kuva voi tekstin tavoin olla linkki. Kuvasta tehdään linkki ympäröimällä <IMG SRC>-tagi linkkitageilla:
<A HREF="linkinkohde.html"><IMG SRC="jaskan_naama.gif"></A>


© Intelligent Systems, 1999