Images Map

Sidst opdateret
26. februar 2005

 

Opret et klikbart billedkort



Som et eksempel på
anvendelse af Image-map,
kan du se min hjemmeside på: www3.ewebcity.com/otto/home.asp

Image map - eller på dansk Billed-kort, er et grafikbilled hvori der er indsat  et eller flere links, således at forskellige dele af billedet fungerer som link til forskellige web-sider. Man taler også om et 'klikbart billedkort.....fedt ord ikke sandt *s*

Inden man begydner at lave et images-map,  bør man sikre sig at man har et anvendeligt billed . Eller overbevise sig selv om, at man selv gider komponere et anvendelig billed, f.eks med PhotoShop, PaintShop Pro eller et andet billedbehandlingsprogram. 

Et andet -mere avanceret eksempel kan du se på Discovery - hvor det giver mere mening at anvende et klikbart billedkort. Hvordan gør man ....? Princippet er egentlig enkelt.
De områder i billedet (også kaldet et 'Hotspot') der skal fungere som links til andre sider, markeres med  et retangel/cirkel eller polygon.
Herefter angives URL'en på den web-side som linket skal henvise til.
Hvis man ikke har et godt billed - kan det være nødvendigt at indsætte en tekst oveni horspot'et , som fortæller at her er et link - ligesom i eksemplet nedenfor.
Sådan gør du:
  1. Indsæt dit billed.
  2. Klik på billedet så værktøjslinjen    Images Toolbar åbnes.
  3. Opret et 'Hotspot' med et af værktøjerne:
    retangel, cirkel eller polygon fra værktøjslinjen.
  4. Indtegn dit hotspot på billedet
  5. herefter bliver du bedt om at angive den URL - altså web-side som hotspot'et skal linke til
  6. Hvis billedet ikke taler for sig selv, kan du indsætte en tekst over dit HotSpot - som jeg har gjort her.
    Hertil anvender du tekstværktøjet i Image Toolbar'en.
knossos.jpg (59342 bytes)
I mangel af bedre har jeg brugt dette billed fra det minoriske kongeslot Knossos på Kreta (igen)

På billedet her har jeg indsat tre links - eller Hotspots. Jeg har kun sat tekst på det ene .... ja , indrømmet, jeg gad ikke lave de andre. Men find de to andre hotspots ...!

Images map'et her er også et eksempel på at hvis man ikke har et anvendeligt billed - og heller ikke gider sætte tekstfelter ind - så skal man ikke begynde at bruge tid på at lave image-map.

Prøv f.eks at se HTML -koderne for denne side. Find koderne for billedet her (knosses.gif) . Her har FP98 angivet koordinaterne  for de enkelte Hotspots ( retangler) øverste venstre og nederste højre hjørne. Koordinaterne er angivet som pixel afstanden fra billedets øverste kant og venstre kant.

 

© Otto leholt

Til top af siden