Stvaranje veza za slike i mape slika
Ovotjedni odgovor predstavlja odgovor na pitanje čitatelja - "Možete li objasniti kako sliku povezati do stranice u HTML-u". Postoji nekoliko različitih tehnika koje možete koristiti za povezane slike. Jedno je povezati cijelu sliku s HTML-om, a drugo je napraviti mapu slike - gdje su različiti dijelovi iste slike povezani na različita mjesta.

Povezana slika u HTML-u

Povezivanje male slike ili ikone vrlo je jednostavno, sve što morate učiniti je da svoju vezu slike postavite unutar hiperveze:



Sve što sam ovdje učinio je da sliku priložim u html-u za vezu. To je najjednostavniji i najučinkovitiji način povezivanja male slike, a često se to događa pomoću prilagođenih metaka, ikona itd. Ali, što ako želite da se jedna velika slika poveže na nekoliko različitih mjesta? Ovo je mjesto gdje dolazi u redu rezanje slika.

Rezanje slika u Photoshopu

To je vrlo lako postići u Photoshopu. Trebali biste koristiti sliku koja nije pretjerano komplicirana, jer želite da vaši korisnici mogu jasno vidjeti gdje kliknuti na sliku. Također želite osigurati da vaši korisnici shvate da trebaju kliknuti unutar slike da bi došli tamo gdje idu. Pažljivo razvijte slikovne mape s obzirom na korisnika. Imajte na umu da slikovne karte obično nisu toliko tražilice kao tekst na stranici, ali pravilna uporaba alt oznaka unutar odsječaka slike može vam pomoći.

Nakon što je stvorena vaša slika, sljedeći korak je "rezanje" vaše slike. Ikona alata za rezanje izgleda kao mali egzotični nož. Nalazi se na vrhu alatne trake i nalazi se ispod alata za obrezivanje - ako kliknete na ikonu “obrezivanje”, pojavit će se alati za odabir kriški i kriški.

Odaberite alat za krišku, držite lijevu tipku miša i pažljivo povucite krišku gdje želite i zatim je otpustite. Idite dalje i nastavite s rezanjem cijele slike. Oko svakog područja slike koje želite povezati s drugom stranicom treba postojati kriška. Svako veliko bijelo područje može biti jedna kriška.

Nakon što je vaša slika u cijelosti narezana, sljedeći korak je upotreba alata "odabir slice", kliknite na svaku krišku i odatle odaberite vrstu kriške "slika". Ispod tog popunite url adrese od koje želite da ovaj križić usmjerite nakon čega slijedi polje alt oznake na dnu. Ostala polja nisu potrebna za jednostavno preslikavanje slike. Kroz svaku krišku se pomičite na isti način sve dok se cijela slika ne preslikava.

Nakon što je cjelovita slika gotova, upotrijebit ćete opciju "spremi za web i uređaje" Ako na vrhu kliknete "Datoteka" i pogledate ispod tipičnih opcija za spremanje, vidjet ćete opciju za spremanje za web i uređaje. Odaberite ovu opciju i otvorit će se dijaloški okvir gdje možete pregledati kako će izgledati vaša slika. Ako ste zadovoljni, pritisnite gumb za spremanje i otvorit će se drugi dijaloški okvir. Budite sigurni da druga opcija kaže "spremite slike i HTML", a zatim spremite svoj rad.

Otvorite mapu u koju ste spremili HTML dokument i otvorite je. Možete kopirati i zalijepiti ovaj kod u svoju HTML datoteku. Obično će ovaj HTML biti malo neuredan. Ako ste poznavatelj HTML-a, možete ga očistiti po želji, ali trebalo bi raditi sasvim dobro. Budite sigurni da se kao i uvijek vaše slikovne datoteke i sl. Nalaze na ispravnim mjestima, jer se u protivnom slika neće prikazati.

Upute Video: Map of Computer Science (Svibanj 2024).