Crearea legăturilor de imagine și a hărților imaginii

• Mai 19, 2024

Răspunsul acestei săptămâni răspunde la o întrebare a cititorului - „Puteți să explicați cum să faceți o legătură de imagine către o pagină în HTML”. Există câteva tehnici diferite pe care le puteți utiliza pentru imagini legate. Una este să conectați întreaga imagine cu HTML-ul dvs., iar cealaltă este să faceți o hartă a imaginii - unde diferite părți ale aceleiași imagini sunt legate de locații diferite.

Imagine asociată în HTML

Conectarea unei imagini mici sau a unei pictograme este foarte simplă, tot ce trebuie să faceți este să plasați legătura de imagine în hyperlink astfel:



Tot ce am făcut aici a fost să includ imaginea în html pentru link. Acesta este cel mai simplu și mai eficient mod de a lega o imagine mică și se face adesea cu gloanțe, pictograme, etc. Acesta este locul în care tranșarea imaginii vine la îndemână.

Image Slicing in Photoshop

Acest lucru este foarte ușor de realizat în Photoshop. Ar trebui să utilizați o imagine care nu este prea complicată, deoarece doriți ca utilizatorii dvs. să poată vedea unde să facă clic pe imagine în mod clar. De asemenea, doriți să vă asigurați că utilizatorii dvs. înțeleg că trebuie să facă clic în imagine pentru a ajunge acolo unde merg. Dezvoltați hărți cu imagini cu atenție, având în vedere utilizatorul dvs. Rețineți că hărțile de imagine nu sunt de obicei la fel de prietenoase cu motorul de căutare ca textul dintr-o pagină, cu toate acestea, utilizarea corectă a etichetelor Alt în feliile de imagine vă poate ajuta.

Odată creată imaginea dvs., următorul pas este să vă „tăiați” imaginea. Pictograma instrumentului de felie arată ca un mic cuțit exacto. Este aproape de partea de sus a barei de instrumente și situată sub instrumentul de decupare - dacă faceți clic pe pictograma „decupare”, vor apărea instrumentele de selectare a feliilor și a feliilor.

Selectați instrumentul pentru felie, țineți apăsată tasta stângă a mouse-ului și trageți cu atenție felia unde doriți și apoi eliberați. Mergeți mai departe și continuați să tăiați întreaga imagine. Ar trebui să existe o felie în jurul fiecărei zone a imaginii pe care doriți să o conectați la o altă pagină. Orice zonă albă mare poate fi o felie.

După ce imaginea dvs. este tăiată complet, următorul pas este să folosiți instrumentul „selectare felie”, să faceți clic pe fiecare felie și de acolo să alegeți tipul de felie „imagine”. Sub această completare, completați adresa URL de unde doriți ca această felie să fie direcționată, urmată de câmpul Alt tag din partea de jos. Celelalte câmpuri nu sunt necesare pentru o simplă mapare a imaginilor. Deplasați fiecare felie în aceeași manieră până când întreaga imagine este mapată.

Odată ce întreaga imagine este completă, veți folosi opțiunea „economisiți pentru web și dispozitive” Dacă faceți clic pe „Fișier” în partea de sus și priviți în jos sub opțiunile tipice de salvare, veți vedea opțiunea de salvat pentru web și dispozitive. Selectați această opțiune și se va deschide o casetă de dialog unde puteți previzualiza cum va arăta imaginea dvs. Dacă sunteți mulțumit de acesta, apăsați butonul de salvare și se deschide o altă casetă de dialog. Asigurați-vă că a doua opțiune spune „salvați imagini și HTML”, apoi salvați-vă munca.

Accesați folderul dvs. în care ați salvat documentul HTML și l-ați deschis. Puteți copia și insera acest cod în propriul fișier HTML. În mod obișnuit, acest HTML va fi puțin sloppy. Dacă sunteți priceput în HTML, îl puteți curăța după bunul plac, dar ar trebui să funcționeze la fel de bine. Asigurați-vă că, întotdeauna, fișierele dvs. de imagine etc sunt în locațiile corecte, altfel imaginea dvs. nu va fi afișată.

Instrucțiuni Video,: Barcuta din Hartie Tutorial (Mai 2024).