Du kan ikke opprette et interaktivt bildekart direkte i Adobe Illustrator. Bildekart brukes til å definere klikkbare områder i et bilde, vanligvis for å navigere i et nettsted, og de krever et backend -språk som HTML og JavaScript for å fungere.

Du kan imidlertid forberede bildet og definere klikkbare områder I illustratør som du deretter kan bruke i nettkoden din:

1. Forbered bildet ditt i Illustrator:

* Åpne bildet ditt i Illustrator.

* Forsikre deg om at det er i ønsket størrelse og oppløsning for nettstedet ditt.

* vektorisering av bildet: Dette gjør det skalerbart uten å miste kvaliteten. Du kan gjøre dette ved å bruke bildesporfunksjonen (Window> Image Trace).

* Gruppe alle elementer: Velg alle elementene i bildet ditt og gruppere dem (objekt> gruppe) for å holde dem sammen.

2. Definer de klikkbare områdene:

* Bruk pennverktøyet (P) eller formverktøy: For å lage presise former for de klikkbare områdene dine.

* Lag et nytt lag: Dette hjelper deg med å organisere bildekartelementene dine.

* Tegn formene på toppen av bildet ditt: Forsikre deg om at formene er klart definert og samsvarer med områdene du vil lage klikkbare.

* Nevn formene dine: Dette vil være nyttig når du skriver HTML -koden. Bruk meningsfulle navn som beskriver området, f.eks. "Produkt-1", "Om-amerikansk", "Kontakt-form", etc.

3. Eksporter bildet og formene:

* Eksporter bildet som en PNG eller JPG: Dette vil være hovedbildet ditt på nettstedet ditt.

* Eksporter formene som en SVG -fil: Dette vil inneholde informasjonen om de klikkbare områdene dine.

4. Opprett HTML- og JavaScript -koden:

* I HTML -filen din, legg til bildekoden for det eksporterte bildet.

* Bruk tagene `kart` og` for å definere de klikkbare områdene. Attributtet `Shape` definerer typen form (RECT, CIRCLE, POLY) og 'KODERS` -attributtet definerer koordinatene til formen din (se SVG -filen for disse verdiene). Attributtet `Href` kobler området til en spesifikk URL.

* For mer komplekse interaksjoner, kan det hende du må bruke JavaScript for å håndtere klikkene på bildekartet.

Eksempel HTML:

`` html

`` `

Husk: Den nøyaktige koden vil avhenge av dine spesifikke behov og nettramme du bruker. Det er også forskjellige online bildekartverktøy som kan forenkle prosessen.

Denne prosessen lar deg lage et bildekart i Illustrator som du deretter kan bruke i webkoden din, noe som gjør bildene dine interaktive for besøkende på nettstedet.