pertemuan 5

• Href merupakan kepanjangan dari hypertext refence.
• Jika di html kita menggunakan atribut "id", maka pada cssnya di awali dengan (#), sedangkan jika pada html kita menggunakan atribut "class", maka pada cssnya akan di awali dengan tanda (.).
• dalam href, ada yang nama <a href="#"></a>
  biasanya ini digunakan untuk memberikan link.
• <span></span>, biasanya digunakan untuk memberikan efek khusus pada suatu objek, misalnya tulisan. Penggunaan span, pada cssnya juga di awali dengan tanda (#), sama halnya seperti "id               

 Link Donwload : http://www.mediafire.com/?khi6werc8bz9qpt

Pertemuan 4

Folder Group

1. Untuk mempermudah meng”Hidden” layer pada saat pemotongan gambar, maka disarankan untuk mengelompokan beberapa layer
2. Fitur Group ada pada panel layer disebelah bawah disebelah kiri new layer yang berbentuk folder
3. Berikan group tersebut nama dengan men-double klik group tersebut. Lalu geser beberapa layer yang ingin dikelompokan dengan group tersebut

 Seleksi Area Potongan Yang bisa “Di Ulang”

1.  Untuk menghasilkan website yang ringan, maka diwajibkan memaksimalkan fitur perulangan atau “repeat” pada css.
2. Repeat-x adalah suatu atribut css untuk mengulang gambar ke samping kanan-kiri saja
3. Repeat-y adalah suatu atribut css untuk mengulang gambar ke atas dan kebawah

Merge Visible Sebelum Memotong

1. Merge visible (Ctrl+Shift+E) dapat menormalkan efek yang dimiliki suatu layer
2. Merge visible akan menyatukan seluruh layer yang terlihat menjadi sebuah layer
3. Setelah pemotongan selesai, diharap segera meng-Undo layer ke History dimana Layer Terpisah(sebelum di Merge Visible)
4. Hati-hati menggunakan Merge Visible, karena jika lupa meng-Undo, maka selamanya layer tidak dapat dipisahkan.

Crop dan Save For Web

1. Gunakan Image -> crop untuk memotong daerah seleksi
2. Gunakan File-> save for web untuk memunculkan fitur penyimpanan dengan konfigurasi web.
3. Aturlah kualitas gambar yang diinginkan
4. Perhatikan tingkat detail Gambar
5. Perhatikan Ukuran gambar

JPEG dan PNG 24
 

•JPEG(Joint Photographic Experts Group)

–Cocok untuk keperluan background dengan ukuran yang rendah. Karena converting ke JPEG mengakibatkan penurunan kualitas(lossy compression)

•PNG(Portable Network Graphics)

–Untuk keperluan background yang memiliki transparansi gambar. Converting ke PNG menjadikan sebuah gambar dapat di edit ulang tanpa penurunan kualitas namun ukuran yang dihasilkan besar

Atur File dan Folder

Folder Utama beri nama : [namaPanggilan]

–Index.html

–Folder CSS

•Style.css

–Folder IMAGES

•Gambar1.jpeg

•Gambar2.jpeg

•Gambar3.png
  
link : http://www.mediafire.com/?ag86o5mdxbbz54a

 Rancangan Web Design 

Tugas Pertemuan Ketiga

Kegunaan float : right adalah untuk menekan suatu  bidang ke atas kanan atau sebelah kanan
cara menggunakannya :

kegunaan float : left adalak untuk menekan suatu bidang ke atas kiri atau kesebelah kiri
cara kegunaannya :

kegunaan clear :both adalah untuk Mematikan fungsi float kiri clear:right dan float kanan clear:left;

  

materi pertemuan ketiga ;

1. Image (img) merupakan objek yang dapat berdiri sendiri dimana memiliki atribut panjang dan lebar.
2. Background adalah suatu atribut yang dimiliki suatu objek CSS dimana memiliki kemampuan dupiklasi diri dan dapat ditumpuk dengan tulisan diatasnya.
3. Tag <div> merupakan salah satu objek yang sering digunakan untuk menginduki atribut background.
4. Sintak background akan dibuat pada CSS, dan tulisan atau objek yang akan dibuat ditengah div tersebut.

Tambahan :

- Jika mau gambar dengan jumlah warna yang banyak dan ukurannya kecil gunakan format .jpg
- Untuk gambar animasi menggunakan format .gif
- Gambar terdapat bagian yang transparant menggunakan format.png 8/24

* materi photosop dasar
Pengertian Photoshop
Photoshop merupakan software yang digunakan untuk memodifikasi gambar atau
foto secara profesional baik meliputi modifikasi obyek yang sederhana maupun yang
sulit sekalipun.

Photoshop juga dapat digunakan untuk  membuat rancangan tampilan antarmuka web, dengan resolusi 1024px-768px.

2. Toolbox

1.   Move Tool : Digunakan untuk memindahkan gambar atau objek. 
2. Rectangular Marquee : Digunakan untuk menyeleksi sebuah objek berbentuk kotak.
3.  Lasso Tools : Digunakan untuk menyeleksi sebuah objek dengan bentuk sembarang.
4. Magic Wand : Digunakan meyeleksi sebuah objek bedasarkan warna tertentu.
5. Crop Tool : Digunakan untuk memotong sebuah objek.
6.  Slice Tool : Digunakan untuk memotong objek sesuai dengan bentuk garis lurus.
7.      Healing Brush Tool : Digunakan untuk menghilangkan bagian gambar terntentu pada image.
8.  Brush Tool : Untuk menghapus atau menggambar objek dengan sapuan kuas.
9. Clone Stamp Tool : Digunakan untuk menyalin sebuah warna untuk diaplikasikan pada objek lain.
10. History Brush Tool : Digunakan untuk menampilkan semua perintah Brush Tool.
11.  Eraser Tool : Digunakan untuk menghapus sebuah objek yang tidak digunakan.
12. Gradient Tool : Digunakan untuk membuat warna gradasi.
13. Dodge Tool : Untuk memberikan koreksi warna pada image agar terlihat terang atau cerah.
14.  Blur Tool : Digunakan untuk menggabungkan sebuah objek.
15. Pen Tool : Digunakan untuk membuat garis berbentuk kurva yang lebih variatif.
16. Horizontal Type Tool : Digunakan untuk membuat objek berupa teks.
17. Path Selection Tool :Untuk membuat seleksi gambar dengan menyambungkan titik-titik gambar agar menjadi sebuah kuva.
18. Rectangle Tools : Digunakan untuk membuat objek segi empat.
19. Eye Dropper Tool : Untuk mengambil sebuah sample background atau foreground.
20. Notes Tool : Untuk menambah sebuah catatan.
21. Hand Tool : Digunakan untuk menggeser stage atau bidang kanvas. Zoom Tool : Digunakan untuk memperbesar atau memperkecil tampilan image.

3. Layer Style
Layer style merupakan kumpulan dari efek-efek khusus untuk ditetapkan pada layer yang disediakan pada palet layer.

Beberapa menu-menu pada layer style :
- Drop shadow : membuat efek bayangan di bagian luar
- Inner shadow : membuat efek bayangan di bagian dalam objek
- Outer glow : Membuat efek bercahaya pada luar
- Inner glow : Membuat efek bercahaya pada dalam objek
- Bevel and emboss : Membuat efek timbul
- Satin : membuat pola-pola tertentu pada objek
- Color, gradient, dan pattern overlay : Sama-sama mengganti permukaan objek, masing-masing dengan warna, gradien, atau pattern
- Stroke : Memberi garis pinggir pada objek

cara menyimpan dengan mode save for web :

*Klik File->klik "save for web & devices->save
  atau dengan cara (Alt+Shift+Ctrl+S)

cara mamasukkan foto kekanvas photosop :

1. Klik File->New->Ok
2. Klik File->Open->Pilih foto->Lalu open
3. Klik "Move Tool"->tarik foto yang tadi lalu geser ke Kanvas.
4. Lalu sesuaikan foto dengan kanvas (menggunakan Ctrl + T)