Jika
saat ini anda sedang sibuk mendesain web/blog tentu anda tidak asing
dengan istilah header. Header ini merupakan bagian paling atas dari
sebuah halaman web tempat menulisakan judul web (Kadang-kadang dalam
bentuk gambar). Biasanya pada bagian header ini terdapat menu-menu yang
mengarah ke sebuah link/url seperti: home, about, contact, dls. Langsung
saja, untuk membuat header sekaligus menu menggunakan Adobe Photoshop CS 4 dapat dilakukan dengan langkah-langkah berikut:
1. Pilih File -> New. Ukuran 960 x 150 pixel. Lalu klik Ok.
2. Gunakan Gradient Tool untuk mewarnai. (gunakan Panel Color untuk memilih warna. saya menggunakan foreground: biru dan background: hitam)
3. Gunakan Type Tool untuk menuliskan judul web/blog dan menu seperti contoh gambar di bawah ini.
4. Gunakan Slice Tool untuk memotong/memilah bagian yang akan dijadikan header dan menu. Aktifkan Slice Tool ->
letakkan pointer di sudut kiri atas -> lalu klik dan tahan sambil
menyeret ke kanan sesuai luas yang diinginkan. Kemudian, pisahkan juga
untuk menu (home, contact me dst) dengan cara yang sama. Lihat gambar.
5. Selanjutnya, simpan menjadi web. Klik File ->Save For Web & Devices… supaya ukuran gambar tidak terlalu besar pilih format JPEG pada kotak preset. Lalu klik Save.
6. Kemudian akan muncul kotak dialog Save Optimized As. Pada kotak Save as type pilih HTML and images (*.html) lalu klik Save.
Lihat hasilnya di mana anda menyimpannya tadi. akan tampak nama file
dengan format .html dan folder images yang berisi gambar yang telah
dipotong menggunakan Slice Tool tadi.
7. Jika file .html dibuka dengan firefox akan tampak seperti gambar berikut.
Langkah selanjutnya adalah mengeditnya menggunakan Notepad untuk menambahkan link pada menu (home, contact me, about me, tips n trik) yang akan dibahas pada posting berikutnya cara membuat link pada gambar.
0 komentar:
Posting Komentar