Hvordan lage et bildekart med HTML

Hvordan lage et bildekart med HTML


Et bildekart er et sett med koordinater som deler bildet inn i flere "klikkbare" områder som lenker til andre nettsider eller nettsteder. Hvis du har en grafisk eller bilde med ulike deler, kan du bruke bildekart for å legge til noen unike berører til ditt nettsted. De er ofte brukt som en form for web navigasjon, slik at besøkende til å klikke på de forskjellige linkene på bildet for å komme til en annen del av området. Bildekart er enkle å lage for de med grunnleggende kunnskap om HTML, og ikke krever noen spesielle skript eller programmer for å gjennomføre.

Bruksanvisning

1 Velg bildet du planlegger å bruke som bakgrunnsbilde for bildekartet. Grafikk med ulike områder av form eller farge som er lett for besøkende å skille er best egnet for å lage bildekart. Fotografier er ikke anbefalt.

2 Velg de ulike områdene som du kommer til å ha knyttet til andre sider på nettstedet ditt eller andre steder på nettet. Det er tre typer områder du kan bruke som linker på bildekartet: RECT, sirkel og polygon. Dessuten er det ingen grense for hvor mye linker du kan legge til HTML bildekart.

3 Åpne opp ditt bilde på noen redigering program for å bestemme koordinatene for hvert område du har valgt for bildekartet. Microsoft Paint kommer med mange PCer, og kan lett brukes til å finne koordinatene. Hvis "klikkbare" områder er rektangulær form, trenger du bare å finne øverst til høyre og nederste venstre koordinater. For sirkulære områder, koordinerer bare i midten og størrelsen av radien er nødvendig. Polygonale formede områder har flere koordinater, og du vil trenge å liste dem i rekkefølge. Skriv ned koordinatene for bildekart for enkel referanse.

4 Sett inn bildet på din nettside ved å åpne den opp i et tekstredigeringsprogram (for eksempel Notisblokk) og skrive <img src = "URL" USEMAP = "# MAPNAME">. Bytt ut URL med plasseringen av bildet, og MAPNAME med navnet på kartet du ønsker å bruke (dette kan være noe).

5 Lag kart av bildet ved å skrive <MAP NAME = "MAPNAME">. Du kan gi kartet navnet du ønsker, så lenge det samsvarer med navnet utpekt på bildet. Hvis navnene på kartet, og bildet ikke stemmer overens, så kartet bildet ikke vil fungere.

6 Etter kartet kode, skriv <area shape = "form" coords = "A, B, C, D" href = "URL">. Bytt SHAPE med formen på ditt område, og legge inn koordinatene for området i stedet for A, B, C, D. For eksempel vil et rektangulært formet område være <area shape = "RECT" coords = "116113203144" href = "URL">. Bytt ut URL med URL-adressen til siden du vil at denne delen av bildet for å koble til.

7 Etter at du har skrevet i HTML-koden for alle områder av bildekartet, lukke ut kartet ved å skrive </ MAP> på slutten.

8 Åpne opp siden der du har satt inn bildekart i nettleseren for å teste at HTML er korrekt, og at bildekartet fungerer. Du og dine besøkende kan nå klikke på ulike områder av et bilde og besøke andre deler av nettstedet ditt.