Hvordan bygge bildekart uten en bildekartredigerer

Innholdsfortegnelse:

Hvordan bygge bildekart uten en bildekartredigerer
Hvordan bygge bildekart uten en bildekartredigerer
Anonim

What to Know

• Bruk et bilde i normal størrelse som nettleseren ikke vil skalere. Du trenger også et bilderedigeringsprogram og et HTML- eller tekstredigeringsprogram.

• Når du setter inn bildet, legg til et ekstra attributt for å identifisere kartets koordinater.

• For eksempel:

Denne artikkelen forklarer hvordan du lager bildekart ved hjelp av HTML-tagger i stedet for et bildekartredigeringsprogram. De fleste bilderedigerere vil vise deg koordinatene til musen når du peker på bildet, som er alle dataene du trenger for å komme i gang med bildekart.

Image
Image

Opprette et bildekart

For å lage et bildekart, velg først et bilde som skal tjene som grunnlag for kartet. Bildet skal være "normal størrelse" - det vil si at du ikke skal bruke et bilde som er så stort at nettleseren vil skalere det.

Når du setter inn bildet, legger du til et ekstra attributt som identifiserer kartets koordinater:

Når du lager et bildekart, lager du et område som er klikkbart på bildet, så kartets koordinater må stemme med høyden og bredden på bildet du valgte. Kart støtter tre forskjellige typer former:

  • rekt-et rektangel eller firesidig figur
  • poly-en polygon eller flersidig figur
  • sirkel-en sirkel

For å opprette områdene må du isolere de spesifikke koordinatene du har tenkt å kartlegge. Et kart kan bestå av ett eller flere definerte områder på bildet som, når det klikkes, åpner en ny hyperkobling.

For et rektangel kartlegger du bare øvre venstre og nedre høyre hjørne. Alle koordinater er oppført som x, y (over, opp). Så for øvre venstre hjørne 0, 0 og nedre høyre hjørne 10, 15 skriver du 0, 0, 10, 15. Deretter inkluderer du det på kartet:

For en polygon kartlegger du hver x-, y-koordinat separat. Nettleseren kobler automatisk det siste settet med koordinater med det første; alt innenfor disse koordinatene er en del av kartet.

Sirkelformer krever bare to koordinater, som rektangelet, men for den andre koordinaten spesifiserer du radiusen eller avstanden fra sentrum av sirkelen. Så for en sirkel med sentrum på 122, 122 og en radius på 5 vil du skrive 122, 122, 5:

Alle områder og former kan inkluderes i samme karttag:


Betraktninger

Bildekart var mye mer vanlig i Web 1.0-æraen på 1990-tallet til tidlig på 2000-tallet - bildekart dannet ofte grunnlaget for et nettsteds navigering. En designer ville lage en slags bilde for å indikere menyelementer, og deretter sette et kart.

Moderne tilnærminger oppmuntrer til responsiv design og bruker gjennomgripende stilark for å kontrollere plasseringen av bilder og hyperkoblinger på en side.

Selv om karttaggen fortsatt støttes i HTML-standarden, kan bruk av mobile enheter med små formfaktorer føre til uventede ytelsesproblemer med bildekart. I tillegg kommer båndbreddeproblemer eller ødelagte bilder opp i verdien av et bildekart.

Så, fortsett gjerne å bruke denne stabile, velforståtte teknologien, vel vitende om at det er mer effektive alternativer for tiden på moten med webdesignere.

Anbefalt: