Membuat Web Statis Dengan Photoshop Dan Image Ready

Membuat web statis dengan photoshop CS 3

Pembuatan layout halaman • Pilih file  new, gunakan ukuran kertas 1024 X 768 pixel • Buat layout yang diinginkan( dengan menu utama minimal : Home, About, dan Gallery ) menggunakan software photo shop • Dan beri nama halaman utama.psd

Halaman utama

Buat 2 halaman lagi masing masing untuk about.psd dan gallery.psd

Halaman About

Halaman gallery

Membuat Slice Pada Photoshop CS 3 1.

Gunakan Slice tool untuk membuat slice pada tombol tang akan di buat (mis pada text : Home, Gallery dan About me )

Slice Tool

2. Slice pada home, gallery dan about me

3. Gunakan Slice Select tool untuk memilih seleksi (dengan cara menekan Slice tool sampai keluar flyout dan pilih slice select tool ) dan seleksi slice home, Gallery dan About me

4. Klik Slice Option pada tool option bar ( pastikan yang anda pilih adalah slice select tool )

Slice select tool

Slice Option

Pada Halaman Utama Dan ISIKAN •HOME, •URL : index.html •Target : _Self ( open) /_blank ( open new tab )

• Gallery •URL : gallery.html •Target : _Self ( open) /_blank ( open new tab )

• About • URL : about.html •Target : _Self ( open) /_blank ( open new tab )

Catatan : Pada Message Text dan ALT Tag boleh di isi atau tidak (untuk sementara di kosongkan saja )

Menyimpan halaman utama dengan nama index.html • Setelah selesai pengeditan Halaman utama simpan untuk halaman web dengan memilih file --> Save for web and device, setelah muncul kotak dialog, pilih save pada file name isikan index.html ( pastikan pada save as type berisi HTML and Image )

Lakukan Hal yang sama pada halaman GALLERY •Pilih Slice tooldan dan slice ABOUT pada Area HOME, Gallery, dan About •Pilih Slice select tool untuk memilih obyek dan isikan : •HOME, •URL : index.html •Target : _Self ( open) /_blank ( open new tab )

• Gallery •URL : gallery.html •Target : _Self ( open) /_blank ( open new tab )

• About • URL : about.html •Target : _Self ( open) /_blank ( open new tab )

Menyimpan Dengan Format *.html • Setelah selesai pengeditan galery dan about, selanjutnya simpan dengan format html dengan memilih • File --> Save for web and device – Halaman Utama simpan dengan nama : index.html – Halaman Gallery simpan dengan nama : gallery.html – Halaman About simpan dengan nama :about.html

• Catatan : pada save as type pilih Text and Image

SELESAI

Jika ada kesulitan bisa tanya lewat Face book : [email protected]