Belajar belajar belajar… praktek praktek praktek praktek praktek… ayo kita belajar buat design website lagi… :idea: :arrow:

Sebelumnya aku mohon maaf lahir dan batin dulu yaaaa :mrgreen: , baru sekarang ini aku sempet bikin episode lanjutan dari Membuat Design Website dengan Adobe Photoshop(1) :mrgreen:

Langsung aja yaaaa… :arrow: aku anggap semua udah selesai utak atik template photoshop, jadi sekarang tinggal gimana caranya supaya website template yang masih berformat adobe photoshop document (*.psd) itu bisa diubah jadi html :idea:

1. Potong-potong templatenya

Gunakan slice tool, lalu kita potong template nya jadi beberapa bagian

Yang harus “dipotong” itu adalah bagian-bagian yang nantinya akan jadi button/menu navigasi. Kalo bagian yang lain sih tinggal disesuaikan saja dengan kebutuhan kita, misal untuk bagian content ya sebaiknya jadi 1 potongan saja, biar gampang nanti utak-atik di HTML nya. Memang sih, dulu waktu awal-awal juga aku berapa kali ubrak abrik potongannya, tapi ya memang harus begitu kayaknya, harus banyak coba-coba sendiri karena berbeda untuk tiap design. Kalau sudah sering coba, nanti juga tau sendiri gimana “pola potongan” yang efektif, efisien dan optimal :idea:

2. Ubah template photoshop jadi file HTML

Pilih menu File > Save for Web, lalu save dengan nama file yang kita inginkan

sehingga nantinya akan ada 2 file baru:

Dan website template pun siap untuk digunakan

PERHATIAN!!!
Uraian di atas adalah berdasarkan pengalaman pribadi dan dari hasil belajar secara otodidak. Kalau teman-teman ingin panduan membuat website yang lebih detail, saya sarankan teman-teman untuk download modul panduan membuat website disini, GRATIS TIS TIS dan langsung dari ahlinya