Posted by : Jody Baharizki Monday, February 9, 2015

Karena banyak permintaan tentang membuat desain web di photoshop maka saya akan melanjutkan tutorial dasar ini. Untuk postingan kali ini kita akan mencoba cara mendapatkan gambar / slicing dari photoshop untuk dimasukan kedalam HTML web kita.


Tapi, untuk kamu yang baru mengunjungi website ini silahkan klik disini untuk materi sebelumnya. 

Dalam mendesain website kita harus mempertimbangkan beberapa aspek. Terutama adalah komposisi gambar. Karena tidak semua gambar perlu dimasukan kedalam web kita nanti, karena akan sangat berat ketika proses loading.

Kita hanya perlu mengambil gambar yang perlu kita gunakan saja. misal gambar logo kita. Bagaimana cara mengambilnya dari photoshop ? 

Pertama kita menuju layer yang akan kita slicing.


 kemudian klik pada bagian yang akan kita ambil.

bagian yang diambil
Setelah itu tekan CTRL+C --- CTRL+N --- CTRL+V kita akan menuju ke layer baru yang hasilnya adalah objek/gambar yang kita pilih tadi.
Kemudian untuk save tekan CTRL+ALT+SHIFT+S untuk Save For Web.

save for web
Kenapa harus save for web ? karena disini kita bisa atur ukuran size, besar kecil, dan lain-lain.
setelah muncul gambar diatas lalu klik OK  untuk menyimpan di folder kalian.

Nah, untuk image lain juga sama seperti itu. Lalu bagaimana jika mengambil object yg terpisah ?
Kita gabungkan dulu dengan convert to smart object.



Caranya adalah klik di layer gambar 1, tekan SHIFT + KLIK layer gambar 2
Setelah itu klik kanan, pilih convert to smart object.Kemudian lakukan langkah seperti Save For Web diatas.


Sekian dulu materi untuk Membuat Desain Web Di Photoshop Part 2.
tunggu materi berikutnya ya menunggu feedback kalian materi apa yg akan kita bahas di part 3

Jangan lupa baca dari Part 1 ya :)

{ 1 comments... read them below or add one }

  1. Pemrograman web Genap 2015

    http://jodybaharizki.com/perkuliahan-pemrograman-web-genap-2015/

    ReplyDelete

Psang Iklan?

Psang Iklan?
Klik gambar diatas

Like Us!

Youtube

\
\

Labels

Powered by Blogger.

Total Pageviews

- Copyright © 2016 Jody Baharizki -@jodybaharizki- Powered by Blogger -