Cara membuat halaman Web dengan photoshop

Tutorial membuat halaman Web menggunakan Photoshop

Pertama –tama  download  photoshop

Kalau sudah di download ,lalu di Buka nati akan muncul seperti gambar di samping ,tunggulah sebentar .

Kita disinih menggunakan photoshop CC  

Kalau sudah terbuka, maka tampilan lembar kerjanya seperti gambar di atas .

Yang berada di sebelah kiri pada gambar itu adalah Toll-toll yang di gunakan untuk mengedit

Setelah itu kita akan membuat lembar kerja baru .

Dengan cara :”klik file” setelah itu “klik new”

Maka akan muncul seperti gambar di atas .

Setelah itu isi name :untuk judul lembar kerja ,isinya sesuka hati .

Isi  preset:”web” ,size=widthdan heightsudah di atur dari sanahnya . Jika ingin size= widthdan heightseperti keinginan kita maka maka pilih preset “custom”.

Isi widthdan height :dengan ukuran “pixels/ CM”

Disini kami menggunakan preset=”custom” width=”800 pixels”dan height=”1500 pixels”

Maka akan muncul seperti gambar di atas yang masi background putih ,jika ingin mengganti background “klik tool set foreground color” untuk memilih warna. disini kami  menggunakan warna coklat . setelah itu “klik tool paint bucket tool”lalu “klik lembar kerjanya “maka background akan berganti 

Maka hasilnya seperti gambar di atas

Jika ingin menambahkan tulisan maka “klik tool horizontal type tool”untuk memberi  area  mana yang akan di beri tulisan , setelah itu “klik lembar kerja “dan beri area untuk menambah tulisan ,setelah itu “klik area tersebut “dan ketik  tulisan yang ingin di tulis. maka hasilnya seperti gambar di atas .

Jika ingin menambah foto maka “klik file “lalu “klik open “ lalu cari dimana foto yang anda ingin masukan disimpan setelah ketemu “klik file “lalu “klik open”maka akan terbuat lembar kerja baru untuk mengedit terlebih dahulu sebelum di masukan kedalam “lembar kerja halaman web”,jika suda selesai  mengedit maka “klik move tool ”dan klik fotonya kemudian tarik kelembar kerja halaman web ,lalu atur posisi foto sesuai yang kita ingin kan .maka hasilnya seperti gambar di atas.

Sebelum di save “klik slice tool”untuk bisa mengarahkan gambar yang di klik kesuatu link atau lokasi file,lalu ke lembar kerja bagi bagian mana yang ingin di klik .maka hasilnya seperti gambar di atas

Jika suda selesai ,langkah selanjutnya adalah seve dengan cara “klik file “lalu “klik save for web” maka akan muncul seperti gambar di atas setelah itu “klik save”

Maka akan muncul seperti gambar di atas maka pili dimana file akan di simpan ,setelah itu isi file name sesuka hati anda=untuk member I nama judul file ,dan isi dengan format=”HTML and images” setelah itu “klik save”

Dan itu adalah hasilnya  jika belum di edit menggunakan notepad maka bagian yang tadi di slice tidak akan bisa di klik 

Langkah selanjutnya adalah pengeditan menggunakan notepad .

Langkah pertama adalah “klik kanan file “lalu “klik open with “lalu “klik notepad”.maka hasilnya seperti gambar di atas . di sini kami menggunakan notepad++ . 

Jika ingin gambarnya berada di tengah maka masukan tag
di samping tagdan jangan lupa masukan tag tutup di samping tag tutp

. Dan jika ingin gambar yang tadi di slice bisa di klik maka masukan tag di samping kana tag gambar yang ingi di klik janga lupa beri tag tutup di samping kanan tag gambar yang ingin klik.contohnya =

http://facebook.com”target =”blank”>

.sama seperti gambar di samping. Setelah itu “klik tombol save “yang berada di atas deretan yang ke 3 dari kiri ,lalu bukai file nya kembali.

Setelah di buka maka tampilannya seperti gambar di samping  ,lalu “klik gambar yang sudah di beri tag  

Jika berhasil maka akan menuju ke lokasi link yang ingi di tuju .

Karena disini kami tidak ada koneksi internet  jadi tidak bisa menuju link yang ingin di tuju ,karena link yang ingin di tuju harus  ada koneksi  internet. maka hasilnya seperti gambar disamping.


Semoga bermanfaat