Klikattavat eli interaktiiviset kuvat johtavat uudelle www-sivulle, joka voi olla itse tehty HTML-tiedosto tai muualla sijaitseva URL-osoite.

postimerkkikuvat
Usein suurista ja hitaasti latautuvista kuvista kannattaa ensin esittää pienempi ns. postimerkkikuva (kutsutaan myös thumbnail-kuvaksi), jota klikkaamalla lukija voi halutessan nähdä suuremman version. Tämä toteutetaan tekemällä pienestä kuvasta linkki suurempaan kuvaan: esim. <a href="isokuva.jpg"> <img src="thumbnail.jpg"> </a>. Linkki vastaa siis normaalia tekstin linkkausta, mutta klikattavan tekstin paikalle tulee nyt thumbnail-kuva. Kuvan ympärille tulee tavallisen tekstilinkin värinen kehys, jonka voi poistaa lisäämällä kuvakomentoon attribuutin border=0.

kuvakartta (imagemap)
Kuvakartalla tarkoitetaan kuvaa, joka sisältää useampia linkkejä uusille www-sivuille (HTML-tiedostoihin/URL-osoitteisiin). Kuvakartta tehdään siten, että kuvaan määritellään kuumia kohtia (ts. kohta sisältää linkin).

Kuvakartan tekeminen sujuu helpoiten apuohjelmilla. Myös monilla www-editoreilla voi tehdä kuvakarttoja. Kuumat kohdat merkitään hiiren avulla ja kohdat linkataan HTML-tiedostoon tai URL-osoitteeseen. Ohjelma laskee hiirellä merkittyjen alueiden koordinaatit, tekee kuvakartan ja sijoittaa sen HTML-tiedoston sisään.

Kuvakartan voi tehdä myös ilman apuohjelmia. Aluksi kuva avataan kuvankäsitteluohjelmassa ja etsitään tulevien kuumien kohtien x- ja y- koordinaatit niiden koon määrittämiseksi. Monet kuvankäsitteluohjelmat osaavat näyttää kuvasta koordinaatit. Esim. Paint Shop Pro:ssa näet halutun kohdan koordinaatit ikkunan alalaidassa, kun pidät hiiriosoitinta kohdan päällä. Photo Shop:ssa koordinaatit näkyvät infopaletissa. Varmista, että mittayksikkönä on pikselit (file: preferences: units & rulers).

Kuumat kohdat voivat olla suorakaiteen, ympyrän tai monikulmion muotoisia. Suorakulmiosta otetaan ylös vasemman ylänurkan ja oikean alanurkan koordinaatit; ympyrästä keskipisteen koordinaatit ja säteen pituus; monikulmiosta jokaisen kulman koordinaatit.

Seuraavaksi siirrytään HTML-tiedostoon ja tehdään kuvakartta. Se aloitetaan komennolla <map>. Komennon sisään laitetaan attribuutti name, jolla annetaan kartalle haluttu nimi (tällä nimellä kuvaan viitataan img-komennossa: esim. usemap="#map1") Aloitus- ja lopetuskomentojen (</map>) väliin sijoitetaan kuumien kohtien määrittelyt, joista jokainen merkitään komennolla <area>. Komennon sisään sijoitetaan attribuutit shape (voi saada arvon rect/circle/poly eli kuuman kohdan muoto), coords (alueen koordinaatit kirjoitetan peräkkäin pilkulla erotettuina) ja href (HTML-tiedosto/URL-osoite eli sivu, jolle kuuman kohdan klikkaus johtaa). Attribuuttien sisältö kirjoitetaan lainausmerkkien sisään (esim. shape="rect"). Jos kuumat kohdat sijaitsevat kuvassa osittain päällekkäin, luetellaan ne kuvakartassa päällimmäisestä alimmaiseen.

Lopuksi on vielä muistettava liittää kartta <img>-komentoon attribuutilla usemap, jolla viitataan <map>-komennossa kartalle annettuun nimeen (esim. <img src="kuva.gif" usemap="#map1">). Jos et halua kuvan ympärille kehystä, lisää kuvakomentoon attribuutti border="0".