Hvad du skal vide
• Brug et billede i normal størrelse, som browseren ikke vil omskalere. Du skal også bruge en billededitor og en HTML- eller teksteditor.
• Når du indsætter billedet, skal du tilføje en ekstra egenskab for at identificere kortets koordinater.
• For eksempel:
Denne artikel forklarer, hvordan man opretter billedkort ved hjælp af HTML-tags i stedet for en billedkorteditor. De fleste billedredigerere vil vise dig koordinaterne for din mus, når du peger på billedet, hvilket er alle de data, du behøver for at komme i gang med billedkort.
Oprettelse af et billedkort
For at oprette et billedkort skal du først vælge et billede, der skal tjene som grundlag for kortet. Billedet skal være "normal størrelse" - det vil sige, du bør ikke bruge et billede så stort, at browseren vil skalere det.
Når du indsætter billedet, tilføjer du en ekstra egenskab, der identificerer kortets koordinater:
Når du opretter et billedkort, opretter du et område, der er klikbart på billedet, så kortets koordinater skal stemme overens med højden og bredden af det billede, du valgte. Kort understøtter tre forskellige former for former:
- rekt-et rektangel eller firesidet figur
- poly-en polygon eller flersidet figur
- cirkel-en cirkel
For at oprette områderne skal du isolere de specifikke koordinater, du har til hensigt at kortlægge. Et kort kan bestå af et eller flere definerede områder på billedet, der, når der klikkes på det, åbner et nyt hyperlink.
For et rektangel kortlægger du kun det øverste venstre og nederste højre hjørne. Alle koordinater er angivet som x, y (over, op). Så for det øverste venstre hjørne 0, 0 og det nederste højre hjørne 10, 15 skal du skrive 0, 0, 10, 15. Du inkluderer det så på kortet:
For en polygon kortlægger du hver x, y-koordinat separat. Webbrowseren forbinder automatisk det sidste sæt koordinater med det første; alt inden for disse koordinater er en del af kortet.
Cirkelformer kræver kun to koordinater, ligesom rektanglet, men for den anden koordinat angiver du radius eller afstanden fra cirklens centrum. Så for en cirkel med centrum på 122, 122 og en radius på 5 ville du skrive 122, 122, 5:
Alle områder og former kan være inkluderet i det samme kortmærke:
Overvejelser
Billedkort var meget mere almindelige i Web 1.0-æraen fra 1990'erne og ind i begyndelsen af 2000'erne - billedkort dannede ofte grundlaget for et websteds navigation. En designer ville skabe en slags billede for at angive menupunkter og derefter sætte et kort.
Moderne tilgange tilskynder til responsivt design og bruger cascading style sheets til at kontrollere placeringen af billeder og hyperlinks på en side.
Selvom korttagget stadig understøttes i HTML-standarden, kan brugen af mobile enheder med små formfaktorer føre til uventede ydeevneproblemer med billedkort. Derudover taler båndbreddeproblemer eller ødelagte billeder om værdien af et billedkort.
Så du er velkommen til at fortsætte med at bruge denne stabile, velforståede teknologi, vel vidende at der i øjeblikket er mere effektive alternativer på mode hos webdesignere.
