Cara membuat peta gambar menggunakan Photoshop

Langkah 1

Buka gambar yang akan Anda gunakan untuk membuat peta gambar Anda di Photoshop. Gambar harus sudah dioptimalkan untuk internet.

Langkah 2

Akses komponen Image Ready Photoshop dengan menekan "Shift-Ctrl-M" atau dengan mengklik tombol "Edit di Image Ready" di bagian bawah kotak peralatan Anda.

Langkah 3

Tekan tombol "P" atau pilih ikon alat "Image Map" di toolbox standar untuk mengakses alat "Image Map". Biarkan alat "Map Gambar" ditekan dan Anda akan melihat bentuk persegi panjang, lingkaran atau poligonal. Pilih bentuk yang paling sesuai dengan area gambar yang ingin Anda gunakan sebagai titik aktif.

Langkah 4

Menggunakan mouse Anda, klik pada gambar dan sorot area titik aktif dengan mengklik dan menyeret mouse. Saat Anda melepaskan tombol mouse, Image Ready akan membuat titik aktif baru pada gambar Anda.

Langkah 5

Buka kotak pilihan peta gambar dengan mengklik menu drop-down "Window" dan memilih "Image Map". Gunakan opsi "Nama" untuk memberi nama titik aktif. Gunakan menu drop-down "URL" untuk menyorot halaman lokal atau masukkan alamat halaman web eksternal untuk mengakses melalui titik yang aktif ini. Gunakan menu tarik-turun "Tujuan" untuk menyoroti bagaimana tautan eksternal Anda akan terbuka. Area "Alt" akan berisi teks yang ditampilkan ketika penunjuk mouse diposisikan pada titik yang aktif ini.

Langkah 6

Gunakan opsi "Dimensi" untuk menyempurnakan posisi dan ukuran titik aktif Anda. X dan Y menunjuk lokasi yang tepat dari titik aktif Anda menggunakan piksel vertikal dan horizontal. W dan H memungkinkan Anda untuk menentukan ukuran titik aktif Anda menggunakan sejumlah piksel.

Langkah 7

Ulangi langkah 4, 5, dan 6 untuk setiap titik aktif yang ingin Anda buat.

Langkah 8

Tekan "Ctrl-Shift-Alt-S" atau pilih menu tarik-turun "File" dan pilih "Simpan dioptimalkan sebagai". Masukkan nama file dan pastikan "HTML dan gambar" muncul di bagian "Simpan sebagai tipe". Klik "Simpan" untuk menyelesaikan proses penyimpanan file. Ini menciptakan file HTML dan folder terkait untuk gambar.

Langkah 9

Klik pada file HTML yang baru dibuat untuk menguji pengoperasian peta gambar baru Anda.