<?xml version='1.0' encoding='UTF-8'?><?xml-stylesheet href="http://www.blogger.com/styles/atom.css" type="text/css"?><feed xmlns='http://www.w3.org/2005/Atom' xmlns:openSearch='http://a9.com/-/spec/opensearchrss/1.0/' xmlns:georss='http://www.georss.org/georss' xmlns:gd='http://schemas.google.com/g/2005' xmlns:thr='http://purl.org/syndication/thread/1.0'><id>tag:blogger.com,1999:blog-8242079819015736657</id><updated>2011-04-21T18:46:25.626-07:00</updated><category term='design Grafis'/><category term='PHP'/><category term='Dreamwaver'/><category term='layout website'/><category term='CSS'/><category term='Programmming PHP'/><category term='Photoshop'/><category term='HTML'/><title type='text'>Tutoral lengkap,Design Grafis,web programming</title><subtitle type='html'>Kumpulan Tutorial Design Grafis,Web Programming,Programming With C++/C,Layout Website</subtitle><link rel='http://schemas.google.com/g/2005#feed' type='application/atom+xml' href='http://moeldy815.blogspot.com/feeds/posts/default'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/8242079819015736657/posts/default?max-results=100'/><link rel='alternate' type='text/html' href='http://moeldy815.blogspot.com/'/><link rel='hub' href='http://pubsubhubbub.appspot.com/'/><author><name>Moeldy</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='28' height='32' src='http://4.bp.blogspot.com/_iqLKOgMYxQI/Sa4GZyu0H3I/AAAAAAAAACI/6FZ4uWMvHBE/S220/moeldy2.png'/></author><generator version='7.00' uri='http://www.blogger.com'>Blogger</generator><openSearch:totalResults>5</openSearch:totalResults><openSearch:startIndex>1</openSearch:startIndex><openSearch:itemsPerPage>100</openSearch:itemsPerPage><entry><id>tag:blogger.com,1999:blog-8242079819015736657.post-1422805795683478890</id><published>2008-03-30T18:48:00.000-07:00</published><updated>2008-03-30T18:50:32.391-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='PHP'/><category scheme='http://www.blogger.com/atom/ns#' term='Dreamwaver'/><category scheme='http://www.blogger.com/atom/ns#' term='CSS'/><category scheme='http://www.blogger.com/atom/ns#' term='HTML'/><title type='text'>Mengedit Website dengan Dreamwaver</title><content type='html'>&lt;p align="justify"&gt;&lt;span id="more-148"&gt;&lt;/span&gt;&lt;/p&gt; &lt;p&gt; &lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_01.gif" title="dreamweaver_01.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_01.gif" alt="dreamweaver_01.gif" /&gt;&lt;/a&gt;&lt;/p&gt; &lt;p&gt;1. &lt;strong&gt;Mengubah Objek menjadi Background&lt;/strong&gt;&lt;/p&gt; &lt;p align="justify"&gt;Tidak semua gambar (image) yang pada web yang telah kita buat diganti. Jika image tersebut berfungsi sebagai tombol, maka Anda dapat menambahkan menu pull down agar tampilan website lebih menarik. Anda juga dapat membuat tombol dalam bentuk mouse over, dan lain sebagainya.&lt;/p&gt; &lt;p align="justify"&gt;Pada bagian ini, kita akan mencoba membahas tentang teknik penggantian objek gambar menjadi latar belakang (backgrdound) agar kita dapat memasukkan beberapa komponen di dalamnya (teks maupun grafik).&lt;/p&gt; &lt;ol&gt;&lt;li&gt; &lt;p align="justify"&gt;Pertama kali, bukalah file index.html menggunakan Macromedia Dreamweaver.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_02.gif" title="Gambar 1"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_02.gif" alt="Gambar 1" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Setelah file terbuka, tentukan terlebih dahulu image mana saja yang akan di jadikan latar belakang dan bagian mana saja yang akan dijadikan sebagai tombol. Sebagai contoh, klik image di bagian bawah teks New Product.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_02b.gif" title="Gambar 2"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_02b.gif" alt="Gambar 2" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Pada bagian Properties, tertulis &lt;strong&gt;Src = images/index_26.gif&lt;/strong&gt;. Hal itu berarti kita tidak dapat memasukan teks di atas gambar tersebut karena objek tersebut adalah image, bukan merupakan background. Tekan &lt;strong&gt;Del &lt;/strong&gt;untuk menghapusnya.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_03.gif" title="Gambar 3"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_03.gif" alt="Gambar 3" /&gt;&lt;/a&gt;&lt;br /&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Klik pada Background URL of cell untuk memilih gambar yang akan dijadikan latar belakang (background). Oleh karena nama file yang baru saja dihapus adalah index_26.gif maka gunakan file tersebut sebagai latar belakang.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_04.gif" title="Gambar 4"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_04.gif" alt="Gambar 4" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Ketikkan &lt;strong&gt;images/index_26.gif&lt;/strong&gt; pada kolom Bg.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_05.gif" title="Gambar 5"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_05.gif" alt="Gambar 5" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Lakukan hal yang sama pada bagian lain apabila ingin dijadikan sebagai latar belakang agar kita dapat memasukkan objek berupa teks, animasi, maupun gambar.&lt;/p&gt; &lt;/li&gt;&lt;/ol&gt; &lt;hr /&gt;2. &lt;strong&gt;Memasukkan Objek&lt;/strong&gt; &lt;p align="justify"&gt;Objek yang dimaksud dapat berupa animasi, gambar, maupun teks. Dalam Macromedia Dreamweaver proses memasukkan objek sangat mudah karena sudah disediakan tool yang sangat lengkap. Anda tinggal memilih objek apa yang akan dimasukkan. Berikut ini akan membahas masalah teknik memasukkan objek berupa teks.&lt;/p&gt; &lt;ol&gt;&lt;li&gt; &lt;p align="justify"&gt;Letakkan kursor pada tempat yang akan ditambahkan teks.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_11.gif" title="Gambar 11"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_11.gif" alt="Gambar 11" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Pada penel Properties, aturlah beberapa spesifikasi seperti nampak pada gambar berikut.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_12.gif" title="Gambar 12"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_12.gif" alt="Gambar 12" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Ketikkan beberapa kalimat yang berisi berita, kemudian aturlah format teks tersebut seperti nampak pada gambar berikut.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_13.gif" title="Gambar 13"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_13.gif" alt="Gambar 13" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Anda bisa memasukkan image di antara teks tersebut. Untuk melakukan hal itu, pertama kali letakkan kursor di awal paragraf kemudian pilih menu &lt;strong&gt;Insert &gt; Image&lt;/strong&gt;.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_14.gif" title="Gambar 14"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_14.gif" alt="Gambar 14" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Pilih file gambar yang akan dimasukkan dalam dokumen tersebut.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_15.gif" title="Gambar 15"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_15.gif" alt="Gambar 15" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Apabila berhasil memasukkan gambar, maka akan terlihat objek tersebut berada di depan paragraf. Namun posisinya masih kurang sempurna karena susunan teks terdorong oleh gambar tersebut.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_16.gif" title="Gambar 16"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_16.gif" alt="Gambar 16" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Agar tampilan lebih rapi, Anda dapat mengatur posisi gambar sehingga seluruh teks akan berada di sebelah kanan gambar. Untuk melakukan hal tersebut, pada panel Properties pilih Left untuk Align.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_17.gif" title="Gambar 17"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/05/dreamweaver_17.gif" alt="Gambar 17" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;/ol&gt; &lt;p align="justify"&gt; &lt;/p&gt; &lt;p align="justify"&gt; &lt;/p&gt; &lt;p&gt;&lt;strong&gt;MEMBUAT LINK DAN NAVIGASI&lt;/strong&gt;&lt;/p&gt; &lt;p align="justify"&gt;Menu yang mudah digunakan (&lt;em&gt;user friendly&lt;/em&gt;) dapat membantu pengguna ketika mencari informasi yang dibutuhkan. Sebaiknya menggunakan tombol menu yang umum, seperti: Home, Product, Service, dan Contact Us&lt;/p&gt; &lt;p align="justify"&gt;Dalam Macromedia Dreamweaver, kita membuat Pop-up Menu, dan Jumping Menu secara mudah. Anda tidak bersusah payah menuliskan script yang panjang dalam bahasa Javascript karena telah disediakan tool yang sangat mudah dan fleksibel.&lt;/p&gt; &lt;p&gt;1.  &lt;strong&gt;Membuat Pop-up Menu&lt;/strong&gt;&lt;/p&gt; &lt;p align="justify"&gt;Keunggulan software Macromedia Dreamweaver dibandingkan dengan aplikasi lain yang sejenis adalah adanya tool untuk membuat menu pop-up yang dibuat dengan bahasa Java. Bagi mereka yang masih awan dengan bahasa Java, tidak perlu bingung karena disediakan panel Behavior untuk mempermudah dalam pembuatan menu pop-up.&lt;/p&gt; &lt;p align="justify"&gt;Sebelum membuat pop-up menu terlebih dulu harus menyiapkan nama file sebagai link. Sebagai contoh: ketika user memilih menu PC maka yang akan muncul adalah pilihan nama computer seperti Acer, HP, BenQ, dan lain sebagainya. Dan ketika user memilih salah satu opsi (missal: Acer) maka akan terhubung ke file tersebut.&lt;/p&gt; &lt;p&gt;Dengan demikian, Anda harus membuat beberapa file dengan bentuk interface yang sama seperti halaman utama, yaitu menyimpan dengan nama lain (contoh: Save As &gt; acer.html). Diasumsikan, Anda telah memiliki beberapa file sebagai link yang dimaksud.&lt;/p&gt; &lt;ol&gt;&lt;li&gt; &lt;p align="justify"&gt;Pertama kali, klik menu PC.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_21.gif" title="dreamweaver_21.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_21.gif" alt="dreamweaver_21.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Jika panel Behaviors belum muncul, aktifkan terlebih dulu dengan cara memilih menu &lt;strong&gt;Window &gt; Behaviors&lt;/strong&gt;.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_22.gif" title="dreamweaver_22.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_22.gif" alt="dreamweaver_22.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Pada panel Behaviors (berada di sebelah kanan), klik tombol Add (tanda plus) untuk membuka menu.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_23.gif" title="dreamweaver_23.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_23.gif" alt="dreamweaver_23.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Selanjutnya pilih Show Pop up Menu.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_24.gif" title="dreamweaver_24.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_24.gif" alt="dreamweaver_24.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Setelah mengklik pilihan tersebut, maka akan muncul kotak dialog Show Pop-up Menu yang masih kosong.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_25.gif" title="dreamweaver_25.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_25.gif" alt="dreamweaver_25.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Pada Tab Contents, masukkan nama menu pada kolom Text (misal: Acer).&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_26.gif" title="dreamweaver_26.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_26.gif" alt="dreamweaver_26.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Kemudian masukkan alamat URL pada kolom Link.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_27.gif" title="dreamweaver_27.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_27.gif" alt="dreamweaver_27.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Selanjutnya pada kolom Target, pilih _parent.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_28.gif" title="dreamweaver_28.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_28.gif" alt="dreamweaver_28.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Untuk membuat menu yang baru, klik tanda plus (+) di bagian atas. Kemudian lakukan hal sama seperti pada tahap 6.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_29.gif" title="dreamweaver_29.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_29.gif" alt="dreamweaver_29.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Selanjutnya, klik Tab &lt;strong&gt;Appearance&lt;/strong&gt; untuk mengatur warna teks dan latar belakang pop up menu. Tentukan jenis dan ukuran font yang digunakan. Lalu tentukan pula warna teks dan warna cell ketika mouse berada di atas teks.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_30.gif" title="dreamweaver_30.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_30.gif" alt="dreamweaver_30.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Klik Tab &lt;strong&gt;Advanced&lt;/strong&gt; untuk menentukan lebar, tinggi dan warna border kotak pop up menu.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_31.gif" title="dreamweaver_31.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_31.gif" alt="dreamweaver_31.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Klik Tab &lt;strong&gt;Position&lt;/strong&gt; untuk menentukan posisi pop up menu.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_32.gif" title="dreamweaver_32.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_32.gif" alt="dreamweaver_32.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Setelah selesai klik OK. Untuk melihat hasilnya, klik tombol F12.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_33.gif" title="dreamweaver_33.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_33.gif" alt="dreamweaver_33.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Untuk mengasah keterampilan Anda, buatlah pop-up menu pada tombol lain.&lt;/p&gt; &lt;/li&gt;&lt;/ol&gt; &lt;p align="justify"&gt; &lt;/p&gt; &lt;p align="justify"&gt; &lt;/p&gt; &lt;p&gt;2. &lt;strong&gt;Membuat Rollover Image&lt;/strong&gt;&lt;/p&gt; &lt;p align="justify"&gt;Macromedia Dreamweaver selain menyediakan tool untuk membuat Pop up Menu juga menyediakan tool untuk membuat Rollover Image sebagai tombol. Yang harus Anda lakukan pertama kali adalah menyediakan dua buah gambar yang ukurannya sama tapi warnanya berbeda.&lt;/p&gt; &lt;ol&gt;&lt;li&gt; &lt;p align="justify"&gt;Buatlah duplikasi gambar tombol yang telah ada.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_41.gif" title="dreamweaver_41.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_41.gif" alt="dreamweaver_41.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Kemudian editlah file hasil duplikasi tersebut menggunakan Adobe Photoshop. Pilih menu &lt;strong&gt;Image &gt; Adjustment &gt; Hue/Saturation&lt;/strong&gt;.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_42.gif" title="dreamweaver_42.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_42.gif" alt="dreamweaver_42.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Setelah muncul kotak dialog Hue/Saturation, aktifkan pilihan Colorize. Kemudian geser Slider Hue maupun Saturation sesuai kebutuhan. Setelah selesai klik OK, simpan dokumen tersebut dengan cara menekan &lt;strong&gt;Ctrl+S&lt;/strong&gt;.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_43.gif" title="dreamweaver_43.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_43.gif" alt="dreamweaver_43.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Sekarang kembali ke Macromedia Dreamweaver. Klik gambar About Us.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_44.gif" title="dreamweaver_44.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_44.gif" alt="dreamweaver_44.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Hapuslah objek tersebut dengan cara menekan tombol Del. Selanjutnya pilih menu &lt;strong&gt;Insert &gt; Image Objects &gt; Rollover Image&lt;/strong&gt;.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_45.gif" title="dreamweaver_45.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_45.gif" alt="dreamweaver_45.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Setelah muncul kotak dialog Insert Rollover Image, berilah nama gambar pada kolom Image name kemudian tentukan gambar asli pada kolom Original Image. Untuk mempermudah pencarian file, klik tombol Browse. Tentukan pula file untuk gambar rollover pada kolom Rollover Image.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_46.gif" title="dreamweaver_46.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_46.gif" alt="dreamweaver_46.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Masukkan teks alternat pada kolom Alt, lalu tentukan nama file sebagai link ketika tombol tersebut di klik.&lt;br /&gt;&lt;a href="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_47.gif" title="dreamweaver_47.gif"&gt;&lt;img src="http://slametriyanto.net/wp-content/uploads/2007/06/dreamweaver_47.gif" alt="dreamweaver_47.gif" /&gt;&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;&lt;li&gt; &lt;p align="justify"&gt;Untuk melihat hasilnya, tekan tombol F12.&lt;/p&gt;&lt;/li&gt;&lt;/ol&gt;&lt;br /&gt;Sumber:www.slametriyanto.net&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/8242079819015736657-1422805795683478890?l=moeldy815.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://moeldy815.blogspot.com/feeds/1422805795683478890/comments/default' title='Poskan Komentar'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=8242079819015736657&amp;postID=1422805795683478890&amp;isPopup=true' title='0 Komentar'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/8242079819015736657/posts/default/1422805795683478890'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/8242079819015736657/posts/default/1422805795683478890'/><link rel='alternate' type='text/html' href='http://moeldy815.blogspot.com/2008/03/mengedit-website-dengan-dreamwaver.html' title='Mengedit Website dengan Dreamwaver'/><author><name>Moeldy</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='28' height='32' src='http://4.bp.blogspot.com/_iqLKOgMYxQI/Sa4GZyu0H3I/AAAAAAAAACI/6FZ4uWMvHBE/S220/moeldy2.png'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-8242079819015736657.post-7116819630063549138</id><published>2008-03-30T18:34:00.001-07:00</published><updated>2008-03-30T18:46:53.994-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Programmming PHP'/><category scheme='http://www.blogger.com/atom/ns#' term='HTML'/><title type='text'>Membuat Logo Pada Addres Bar</title><content type='html'> &lt;P&gt;&lt;IMG src="http://h1.ripway.com/ilmuwebsite/img/logo_address.jpg"&gt;&lt;BR&gt;Pernahkan anda melihat logo pada Addres Bar sebuah website? Pastilah menarik bukan? proses pembuatan logo tersebut sangatlah mudah anda cukup&amp;nbsp;menyediakan sebuah logo yang ektensi filenya .ico (misal logo anda.ico). &lt;BR&gt;&lt;BR&gt;&lt;U&gt;Article Last Update on 23 Februari 2008&lt;BR&gt;&lt;/U&gt;&lt;STRONG&gt;&lt;FONT style="BACKGROUND-COLOR: #ffff00"&gt;Link Updated&lt;/FONT&gt;&lt;/STRONG&gt;&lt;BR&gt;Semua File dapat di download di sini &amp;gt; &lt;B&gt;&lt;A href="http://php-photo-shop-ebook-tutorial.ilmuwebsite.com/html/2/Logo-Address-Bar.html" target=_blank&gt;&lt;FONT color=#000000&gt;Membuat Logo Pada Addres Bar&lt;/FONT&gt;&lt;/A&gt;&lt;/B&gt;&lt;/P&gt;&lt;br /&gt;&lt;span style="font-size:9px;"&gt;Sumber dari situs &lt;a href="http://www.ilmuwebsite.com"&gt;Ilmu Website&lt;/a&gt; dalam kategori &lt;a href="http://www.ilmuwebsite.com/html/"&gt;html&lt;/a&gt; dengan judul &lt;a href="http://www.ilmuwebsite.com/detil_html/11/Membuat_Logo_Pada_Addres_Bar/"&gt;Membuat Logo Pada Addres Bar&lt;/a&gt;&lt;/span&gt;&lt;br /&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/8242079819015736657-7116819630063549138?l=moeldy815.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://moeldy815.blogspot.com/feeds/7116819630063549138/comments/default' title='Poskan Komentar'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=8242079819015736657&amp;postID=7116819630063549138&amp;isPopup=true' title='0 Komentar'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/8242079819015736657/posts/default/7116819630063549138'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/8242079819015736657/posts/default/7116819630063549138'/><link rel='alternate' type='text/html' href='http://moeldy815.blogspot.com/2008/03/membuat-logo-pada-addres-bar.html' title='Membuat Logo Pada Addres Bar'/><author><name>Moeldy</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='28' height='32' src='http://4.bp.blogspot.com/_iqLKOgMYxQI/Sa4GZyu0H3I/AAAAAAAAACI/6FZ4uWMvHBE/S220/moeldy2.png'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-8242079819015736657.post-3508440700104102760</id><published>2008-03-30T18:32:00.000-07:00</published><updated>2008-03-30T18:34:32.641-07:00</updated><title type='text'>Windows Blind Noire Skin</title><content type='html'>&lt;p&gt;Tutorial Photoshop kali ini gw mao bikin layout web, terinspirasi dari salah satu skin di Windows Blind, namana "Noire Skin".&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Hehehhe.. kalo mao tau artina, cari di kamus ajah.. kiakkaikakakakakakawww... :D&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Design na mirip ma Windows Vista, cuma ga terlalu lembut, masih mengarah ke sedikit metal, dengan sentuhan smooth snow. hahahahahahahahhahaaa...jangan nanya lu kalo gw banyak ketawa sekarang :D&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin1.png" width="336" height="36"&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Siapinn kanvas, segelas 150 ml kopi, kbetulan suasana bikin na, pas masih pagi (04:00), hehehehee ...&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Sambil udud, bwat garis pembantu (guide line) untuk draft layout na. &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin2.png" width="400" height="331" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Ambil shape rounded rectangle tool, bikin bidang untuk background na.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin3.png" width="400" height="333" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;kasi style na:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin48.png" width="263" height="347" /&gt;  &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin47.png" width="254" height="188" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;ni hasilna................ &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin4.png" width="400" height="333" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;wuki, pencet [CTRL+Click] pada Layer Shape na, untuk bikin seleksi pada area shapping tadi broder....!! &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin49.png" width="196" height="182" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin5.png" width="400" height="331" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;nah lu aktifkan mode seleksi Intersect From Selection,&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin50.png" width="280" height="112" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;tarik area yang akan diambil...dari seleksi shapping&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin6.png" width="400" height="329" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;nah kalo seleksi na dah dapet, tinggal aktifin tool gradient dan bikin layer baru.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;pake gradasi, set ke gini:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin51.png" width="432" height="486" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;bikin gradasi dari bawah ke atas dalam seleksi.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin8.png" width="400" height="96" /&gt;  &lt;/p&gt;&lt;br /&gt;&lt;p&gt;ulangi teknik bikin seleksi na, untuk membwat satu seleksi lagi dibawah header sebelumna.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin10.png" width="400" height="75" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;lanjot ke panel menu, bikin layer dan seleksi baru ke gini, pake Eliptical Marquee Tool &lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/eliptical_marquee_tool.png" alt="eliptical marquee tool" width="25" height="23" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin12.png" width="400" height="312" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;bwat miringin seleksi na, pake transform selection&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Lanjot ke menu Select Invers, bwat ngebalik seleksi.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin13.png" width="400" height="314" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;nah dari seleksi invers yang kbentuk, tken [CTRL+SHIFT+ALT+Click] pada layer gradasi header paling atas (Layer 1). jadi nantina bakal kbentuk seleksi ke gini:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin14.png" width="400" height="325" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;tros kasi gradasi transparent, dengan arah miring dari atas ke bawah:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin16.png" width="306" height="256" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;dalam ukuran aslina: &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin17.png" width="362" height="228" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;woke....tmabahin gradasi dengan teknik yang sama di setengah bagian pada bar menuna...&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin18.png" width="400" height="45" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin19.png" width="400" height="148" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;kurangi opacityna menjadi 57 %&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin20.png" width="325" height="417" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;ambil lagi tool seleksi kotak, bikin di sebelah kiri bar menu, &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin21.png" width="198" height="62" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;lalu pilih menu select &gt; modify &gt; smooth (kasi 2px) &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin22.png" width="282" height="102" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;transform seleksina, gunakan skew transform. tarik ujung kanan bawah ke kiri. lalu enter 2 x.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin23.png" width="212" height="290" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin24.png" width="154" height="82" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;kasi gradasi pada bidang seleksi na:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin25.png" width="152" height="78" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin52.png" width="387" height="164" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;tambahin, logo window yang gw capture dari start menu window xp. kasi text juga yaaaKKK&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin28.png" width="192" height="190" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;naaaah sekarang kita bikin titik-titik hiasan di sebelah kanan object welcome na:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;dengan pencil tool 2px, warna putih, klik 1 x.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin29.png" width="70" height="47" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;duplicate titikna menjadi beberapa titik sehingga terbentuk object ke gini:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin30.png" width="87" height="63" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;lanjot bwat bikin menu na, gw pake rounded rectangle tool dengan radius 4 px&lt;/p&gt;&lt;br /&gt;&lt;p&gt;kasi style na ke gini:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin27.png" width="246" height="208" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin55.png" width="262" height="360" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin56.png" width="260" height="198" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin54.png" width="390" height="99" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;kasi teks menu juga dwonk.. :D&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin33.png" width="312" height="78" /&gt;  &lt;/p&gt;&lt;br /&gt;&lt;p&gt;group aja layer menu na, duplicate menjadi beberapa menu.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin32.png" width="362" height="46" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;sekarang kita bikin logona, ambil salah satu object shape..berbentuk tetesan air..(RainDrop)&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin57.png" width="228" height="178" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;kasi gradasi hejo :) :D .....&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin34.png" width="192" height="178" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;dengan style ke gini:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin58.png" width="262" height="368" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin59.png" width="274" height="208" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin60.png" width="248" height="206" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;bikin dlo seleksi contract 4 px, kasi gradasi transparent untuk bagian atas logo na ...&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin35.png" width="160" height="146" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;duplicat logona, taro di belakang logo pertama .... miringin dikit yak..&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin36.png" width="161" height="124" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;untuk logo yang di duplicate ubah warna gradasi na...&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin37.png" width="178" height="158" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;kasi bayangan di bawah logo na make brush .....&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin38.png" width="162" height="150" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;di sebelah kanan header kasi text na ...untuk hiasan juga, gw kasi background logo overlay samar di belakang text. &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin39.png" width="280" height="166" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;tambahin text nama website&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin40.png" width="396" height="162" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;WOKE sekarang kita bikin bidang untuk side bar na: pake shapping bwat bikin na:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;kasi style na:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin61.png" width="268" height="274" /&gt;  &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin62.png" width="250" height="348" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin63.png" width="264" height="192" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin64.png" width="248" height="198" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin44.png" width="350" height="420" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;di tengah kanan bikin bidang persegi lagi:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;dengan style ke gini:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin65.png" width="264" height="106" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin66.png" width="258" height="192" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin41.png" width="270" height="346" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin43.png" width="342" height="442" /&gt;  &lt;/p&gt;&lt;br /&gt;&lt;p&gt;gw kasiin menu dengan icon folder Windows XP.....&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin45.png" width="337" height="323" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;Terakhir kasi illustrasi text bwat content layout na:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;a href="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin.png" target="_blank"&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/winblind_noireskin46.png" alt="Windows Blind Noire Skin" width="389" height="300" border="0" /&gt;&lt;/a&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;uhuiiiii.... baru aja gw bete ma tmen gw, hahaahhaha.. sekarang gw dah ga bete lagi, design gw dah beres. dinikmatin yak !!! :D :D :D &lt;/p&gt;&lt;br /&gt; &lt;P&gt;&amp;nbsp;&lt;/P&gt;&lt;P&gt;© Copyright 2008 &lt;a href="http://www.dremi.info" target="_blank" title="tutorial Photoshop"&gt;www.dremi.info&lt;/a&gt;&lt;BR&gt;&lt;B&gt;About the Author:&lt;/B&gt; dr.emi is a free man to distribute anything that he was founded. As a Webmaster He was publishing &lt;a href="http://www.dremi.info" target="_blank" title="tutorial Photoshop"&gt;www.dremi.info&lt;/a&gt; to create one community that loves free idealism. Very specialy in Design Category :) &lt;BR&gt;&lt;I&gt;Welcome to love it!&lt;/I&gt;&lt;/P&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/8242079819015736657-3508440700104102760?l=moeldy815.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://moeldy815.blogspot.com/feeds/3508440700104102760/comments/default' title='Poskan Komentar'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=8242079819015736657&amp;postID=3508440700104102760&amp;isPopup=true' title='0 Komentar'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/8242079819015736657/posts/default/3508440700104102760'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/8242079819015736657/posts/default/3508440700104102760'/><link rel='alternate' type='text/html' href='http://moeldy815.blogspot.com/2008/03/windows-blind-noire-skin.html' title='Windows Blind Noire Skin'/><author><name>Moeldy</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='28' height='32' src='http://4.bp.blogspot.com/_iqLKOgMYxQI/Sa4GZyu0H3I/AAAAAAAAACI/6FZ4uWMvHBE/S220/moeldy2.png'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://i175.photobucket.com/albums/w126/hairulazami/Windows%20Blind%20Noire%20Skin/th_winblind_noireskin1.png' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-8242079819015736657.post-632202961442862435</id><published>2008-03-30T18:22:00.000-07:00</published><updated>2008-03-30T18:30:24.665-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='design Grafis'/><category scheme='http://www.blogger.com/atom/ns#' term='Photoshop'/><category scheme='http://www.blogger.com/atom/ns#' term='layout website'/><title type='text'>Memilih Format File yang Tepat untuk Image</title><content type='html'>&lt;div class="entry"&gt;         &lt;h1 style="font-weight: normal;"&gt;&lt;span style="font-size:100%;"&gt;Ketika bekerja dengan Adobe Photoshop, ada beberapa pilihan untuk menyimpan dokumen tersebut dalam berbagai format file dan kompresi.&lt;/span&gt;&lt;/h1&gt;&lt;span style="font-size:100%;"&gt;Bagi para perancang grafik (&lt;em&gt;graphic designer&lt;/em&gt;) pemula, mungkin merasa sulit membedakan antara format yang satu dengan yang lain. Terkadang juga salah dalam memilih format file tersebut, karena masing-masing format file memiliki kelebihan dan kekurangan.Ãƒâ€šÃ‚ Juga memang, masing-masing format file tersebut harus digunakan secara tepat. Sebagai contoh, untuk keperluan web Anda disarankan menggunakan format file jpg, png, maupun gif. Mengapa?&lt;/span&gt; &lt;p&gt;&lt;span style="font-size:100%;"&gt;Baca artikel lengkapnya….&lt;/span&gt;&lt;/p&gt; &lt;p&gt;&lt;span style="font-size:100%;"&gt;&lt;span id="more-17"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;Adobe Photoshop mendukung plugin yang dikembangkan oleh pihak ketiga, dengan cara menginstall filter plugin. Penempatan plugin tersebut adalah pada folder Adobe/Photoshop/Plugin/Filter…. ketika menginstal plugin yang dimaksud. Ada beberapa contoh plugin yaitu: Kai Power Tools, KPT Bryce, KPT Power Goo, Alienskin Eyecandy, Andromeda, Extensis Photoframe, KPT Convolver, dan lain-lain.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;Selain mendukung plugin filter, Adobe Photoshop juga mendukung pertukaran dokumen dari program lain, diantaranya: Adobe Illustrator, Macromedia Freehand, Macromedia Firework, Adobe PageMaker, Adobe After Effect, Corel PhotoPaint, CorelDraw, 3D Studio Max, dan lain-lain. Teknik pertukaran dokumen tersebut dengan cara menyimpan format file yang sesuai dan dapat diterima oleh program-program tersebut di atas. Berikut ini penjelasan beberapa format file untuk menyimpan dokumen pada Photoshop.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;PSD (Photoshop Document)&lt;/strong&gt;&lt;br /&gt;Format file ini merupakan format asli dokumen Adobe Photoshop. Format ini mampu menyimpan informasi layer dan alpha channel yang terdapat pada sebuah gambar, sehingga suatu saat dapat dibuka dan diedit kembali. Format ini juga mampu menyimpan gambar dalam beberapa mode warna yang disediakan Photoshop. Anda dapat menyimpan dengan format file ini jika ingin mengeditnya kembali.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;BMP (Bitmap Image)&lt;/strong&gt;&lt;br /&gt;Format file ini merupakan format grafis yang fleksibel untuk platform Windows sehingga dapat dibaca oleh program grafis manapun. Format ini mampu menyimpan informasi dengan kualitas tingkat 1 bit samapi 24 bit. Kelemahan format file ini adalah tidak mampu menyimpan alpha channel serta ada kendala dalam pertukaran platform. Untuk membuat sebuah objek sebagai desktop wallpaper, simpanlah dokumen Anda dengan format file ini. Anda dapat mengkompres format file ini dengan kompresi RLE.&lt;br /&gt;Format file ini mampu menyimpan gambar dalam mode warna RGB, Grayscale, Indexed Color, dan Bitmap.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;EPS (Encapsuled Postcript)&lt;br /&gt;&lt;/strong&gt;Format file ini merupakan format yang sering digunakan untuk keperluan pertukaran dokumen antar program grafis. Selain itu, format file ini sering pula digunakan ketika ingin mencetak gambar. Keunggulan format file ini menggunakan bahasa postscript sehingga format file ini dikenali oleh hampir semua program persiapan cetak.&lt;br /&gt;Kelemahan format file ini adalah tidak mampu menyimpan alpha channel, sehingga banyak pengguna Adobe Photoshop menggunakan format file ini ketika gambar yang dikerjakan sudah final.Ãƒâ€šÃ‚ Format file ini mampu menyimpan gambar dengan mode warna RGB, CMYK, Lab, Duotone, Grayscale, Indexed Color, serta Bitmap. Selain itu format file ini juga mampu menyimpan clipping path.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;JPG/JPEG (Joint Photographic Expert Group)&lt;/strong&gt;&lt;br /&gt;Format file ini mampu mengkompres objek dengan tingkat kualitas sesuai dengan pilihan yang disediakan. Format file sering dimanfaatkan untuk menyimpan gambar yang akan digunakan untuk keperluan halaman web, multimedia, dan publikasi elektronik lainnya. Format file ini mampu menyimpan gambar dengan mode warna RGB, CMYK, dan Grayscale. Format file ini juga mampu menyimpan alpha channel, namun karena orientasinya ke publikasi elektronik maka format ini berukuran relatif lebih kecil dibandingkan dengan format file lainnya.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;GIF (Graphic Interchange Format)&lt;/strong&gt;&lt;br /&gt;Format file ini hanya mampu menyimpan dalam 8 bit (hanya mendukung mode warna Grayscale, Bitmap dan Indexed Color). Format file ini merupakan format standar untuk publikasi elektronik dan internet. Format file mampu menyimpan animasi dua dimensi yang akan dipublikasikan pada internet, desain halaman web dan publikasi elektronik. Format file ini mampu mengkompres dengan ukuran kecil menggunakan kompresi LZW.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;TIF (Tagged Image Format File)&lt;br /&gt;&lt;/strong&gt;Format file ini mampu menyimpan gambar dengan kualitas hingga 32 bit. Format file ini juga dapat digunakan untuk keperluan pertukaran antar platform (PC, Machintosh, dan Silicon Graphic). Format file ini merupakan salah satu format yang dipilih dan sangat disukai oleh para pengguna komputer grafis terutama yang berorientasi pada publikasi (cetak). Hampir semua program yang mampu membaca format file bitmap juga mampu membaca format file TIF.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;PCX&lt;/strong&gt;&lt;br /&gt;Format file ini dikembangkan oleh perusahaan bernama Zoft Cooperation. Format file ini merupakan format yang fleksibel karena hampir semua program dalam PC mampu membaca gambar dengan format file ini. Format file ini mampu menyimpan informasi bit depth sebesar 1 hingga 24 bit namun tidak mampu menyimpan alpha channel. Format file ini mampu menyimpan gambar dengan mode warna RGB, Grayscale, Bitmpa dan Indexed Color.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;PDF (Portable Document Format)&lt;br /&gt;&lt;/strong&gt;Format file ini digunakan oleh Adobe Acrobat, dan dapat digunakan oleh grafik berbasis pixel maupun vektor. Format file ini mampu menyimpan gambar dengan mode warna RGB, CMYK, Indexed Color, Lab Color, Grayscale dan Bitmap. Format file ini tidak mampu menyimpan alpha channel. Format file ini sering menggunakan kompresi JPG dan ZIP, kecuali untuk mode warna Bitmap yaitu menggunakan CCIT.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;PNG (Portable Network Graphic)&lt;br /&gt;&lt;/strong&gt;Format file ini berfungsi sebagai alternatif lain dari format file GIF. Format file ini digunakan untuk menampilkan objek dalam halaman web. Kelebihan dari format file ini dibandingkan dengan GIF adalah kemampuannya menyimpan file dalam bit depth hingga 24 bit serta mampu menghasilkan latar belakang (background) yang transparan dengan pinggiran yang halus. Format file ini mampu menyimpan alpha channel.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;PIC (Pict)&lt;br /&gt;&lt;/strong&gt;Format file ini merupakan standar dalam aplikasi grafis dalam Macintosh dan program pengolah teks dengan kualitas menengah untuk transfer dokumen antar aplikasi. Format file ini mampu menyimpan gambar dengan mode warna RGB dengan 1 alpha channel serta Indexed Color, Grayscale dan Bitmap tanpa alpha channel. Format file ini juga menyediakan pilihan bit antara 16 dan 32 bit dalam mode warna RGB.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;TGA (Targa)&lt;br /&gt;&lt;/strong&gt;Format file ini didesain untuk platform yang menggunakan Targa True Vision Video Board. Format file ini mampu menyimpan gambar dengan mode warna RGB dalam 32 bit serta 1 alpha channel, juga Grayscale, Indexed Color, dan RGB dalam 16 atau 24 bit tanpa alpha channel. Format file ini berguna untukÃƒâ€šÃ‚ menyimpan dokumen dari hasil render dari program animasi dengan hasil output berupa sequence seperti 3D Studio Max.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;IFF (Interchange File Format)&lt;br /&gt;&lt;/strong&gt;Format file ini umumnya digunakan untuk bekerja dengan Video Toaster dan proses pertukaran dokumentasi dari dan ke Comodore Amiga System. Format file ini dikenali hampir semua program grafis yang terdapat dalam PC serta mampu menyimpan gambar dengan mode warna Bitmap. Format file ini tidak mampu menyimpan alpha channel.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;SCT (Scitex Continous Tone)&lt;br /&gt;&lt;/strong&gt;Format file ini digunakan untuk menyimpan dokumen dengan kualitas tinggi pada komputer Scitex. Format file ini mampu menyimpan gambar dengan mode warna RGB, CMYK, dan Grayscale namun tidak mampu menyimpan alpha channel.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;PXR (Pixar)&lt;/strong&gt;&lt;br /&gt;Format file ini khusus untuk pertukaran dokumen dengan Pixar Image Computer. Format file ini mampu menyimpan gambar dengan mode warna RGB dan Grayscale dengan 1 alpha channel.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;RAW&lt;br /&gt;&lt;/strong&gt;Format file ini merupakan format file yang fleksibel untuk pertukaran dokumen antar aplikasi dan platform. Format file ini mampu menyimpan mode warna RGB, CMYK, dan Grayscale dengan 1 alpha channel serta mode warna Multichannel, Lab Color dan Duotone tanpa alpha channel.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;DCS (Dekstop Color Separation)&lt;br /&gt;&lt;/strong&gt;Format file ini dikembangkan oleh Quark dan merupakan format standar untuk .eps. Format ini mampu menyimpan gambar dengan mode warna Multichannel dan CMYK dengan 1 alpha channel dan banyak spot channel. Format file ini mampu menyimpan clipping path dan sering digunakan untuk proses percetakan (publishing). Ketika menyimpan file dalam format ini maka yang akan tersimpan adalah 4 channel dari gambar tersebut dan 1 channel preview.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;FORMAT KOMPRESI&lt;/strong&gt;&lt;br /&gt;Beberapa program terutama yang berorientasi pada publikasi elektronik dan multimedia selalu memerlukan format file yang berukuran kecil agar ketika dibuka tidak akan lambat. Untuk keperluan tersebut diperlukan kompresi.&lt;br /&gt;Berikut ini format file yang berorientasi publikasi elektronik dan multimedia dengan kompresinya masing-masing.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;RLE (Run Length Encoding)&lt;br /&gt;&lt;/strong&gt;Kompresi ini mampu mengkompres file tanpa menghilangkan detail. Digunakan oleh Adobe Photoshop, TIFF dan sebagian besar program yang terdapat dalam Windows.&lt;/span&gt;&lt;/p&gt; &lt;p&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;LZW (Lemple-Zif-Welf)&lt;br /&gt;&lt;/strong&gt;Sama seperti kompresi RLE, kompresi ini juga mampu mengkompres file tanpa menghilangkan detail. Kompresi ini digunakan oleh TIFF, PDF, GIF, dan format yang mendukung bahasa postscript. Kompresi ini sangat baik untuk mengkompres gambar dengan area besar yang menggunakan 1 warna.&lt;/span&gt;&lt;/p&gt; &lt;p&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;JPG (Joint Photographic Experts Group)&lt;br /&gt;&lt;/strong&gt;Format ini mengkompres file dengan menghilangkan detail. Format file ini sering digunakan oleh JPG, PDF, dan format yang menggunakan bahasa postscript. Kompresi ini sangat baik digunakan untuk gambar dengan continous tone seperti foto.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;&lt;strong&gt;CCIT&lt;br /&gt;&lt;/strong&gt;CCIT merupakan singkatan dari bahasa Perancis yang dalam bahasa Inggris disebut International Telegraph and Telekeyed Consultive Commitee.&lt;br /&gt;Kompresi ini digunakan untuk mengkompres gambar hitam putih, dan mampu mengkompres file tanpa menghilangkan detailnya. Kompresi ini sering digunakan oleh PDF dan format lain yang menggunakan bahasa postscript.&lt;/span&gt;&lt;/p&gt; &lt;p align="justify"&gt;&lt;span style="font-size:100%;"&gt;CATATAN&lt;/span&gt;&lt;/p&gt; &lt;ul&gt;&lt;li&gt; &lt;div align="justify"&gt;&lt;span style="font-size:100%;"&gt;Ketika menyimpan dokumen pada format file yang tidak dapat menyimpan informasi layer, maka Anda harus mengubah gambar tersebut menjadi flaten image terlebih dulu.&lt;/span&gt;&lt;/div&gt; &lt;/li&gt;&lt;li&gt; &lt;div align="justify"&gt;&lt;span style="font-size:100%;"&gt;Format file yang dapat menyimpan mode warna Duotone hanyalah EPS, RAW, dan PSD. Oleh karena itu, ketika ingin menyimpan dalam format lain maka Anda harus mengubah mode warnanya terlebih dulu, menjadi RGB bila dokumen tidak ingin dicetak, karena informasi Duotone-nya akan diuraikan menjadi RGB.&lt;/span&gt;&lt;/div&gt; &lt;/li&gt;&lt;li&gt; &lt;div align="justify"&gt;&lt;span style="font-size:100%;"&gt;Format file yan dapat menyimpan mode warna Lab Color hanyalah PSD, RAW, TIF, PDF, dan EPS. Format file yang dapat menyimpan mode warna CMYK hanyalah PSD, RAW, EPS, TIF, JPG, PDF, dam SCT.&lt;/span&gt;&lt;/div&gt; &lt;/li&gt;&lt;li&gt; &lt;div align="justify"&gt;&lt;span style="font-size:100%;"&gt;Mode warna Indexed Color dapat menyimpan beberapa format file sesuai seting indexed color-nya.&lt;/span&gt;&lt;/div&gt; &lt;/li&gt;&lt;li&gt; &lt;div align="justify"&gt;&lt;span style="font-size:100%;"&gt;Mode warna RGB dapatdisimpan pada semua format file yang ada di Adobe Photoshop.Ãƒâ€šÃ‚ &lt;/span&gt;&lt;/div&gt; &lt;/li&gt;&lt;li&gt; &lt;div align="justify"&gt;&lt;span style="font-size:100%;"&gt;Format yang direkomendasikan oleh para desainer profesional adalah&lt;br /&gt;oÃƒâ€šÃ‚ PSD = untuk dokumen yang masih ingin diedit kembali&lt;br /&gt;oÃƒâ€šÃ‚ EPS = untuk dokumen yang sudah final untuk persiapan cetak&lt;br /&gt;oÃƒâ€šÃ‚ JPG = untuk cetak dengan kompresi di atas 8 bit dan untuk foto dalam web dengan kompresi di bawah 5.&lt;br /&gt;oÃƒâ€šÃ‚ GIF = untuk ilustrasi dan animasi pada halaman web.&lt;br /&gt;oÃƒâ€šÃ‚ TIF = untuk cetak, pertukaran dokumen antar platform serta sequence animasi&lt;/span&gt;&lt;/div&gt; &lt;/li&gt;&lt;/ul&gt;&lt;span style="font-size:100%;"&gt;sumber:www.slametriyanto.net&lt;br /&gt;&lt;span class="post-author"&gt;&lt;br /&gt;&lt;/span&gt;&lt;/span&gt;   &lt;/div&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/8242079819015736657-632202961442862435?l=moeldy815.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://moeldy815.blogspot.com/feeds/632202961442862435/comments/default' title='Poskan Komentar'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=8242079819015736657&amp;postID=632202961442862435&amp;isPopup=true' title='0 Komentar'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/8242079819015736657/posts/default/632202961442862435'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/8242079819015736657/posts/default/632202961442862435'/><link rel='alternate' type='text/html' href='http://moeldy815.blogspot.com/2008/03/memilih-format-file-yang-tepat-untuk.html' title='Memilih Format File yang Tepat untuk Image'/><author><name>Moeldy</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='28' height='32' src='http://4.bp.blogspot.com/_iqLKOgMYxQI/Sa4GZyu0H3I/AAAAAAAAACI/6FZ4uWMvHBE/S220/moeldy2.png'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-8242079819015736657.post-1695819938218422723</id><published>2008-03-30T18:15:00.000-07:00</published><updated>2008-03-30T18:17:21.114-07:00</updated><title type='text'>Green Layout web 2.0</title><content type='html'>&lt;p&gt;hehek..nyengir dah lu...wkwkwkwkw&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Entah knapa beberapa hari ini gw sulit banged dapet inspirasi...bwat ngedisgn ...&lt;/p&gt;&lt;br /&gt;&lt;p&gt;apa ada pengaruh yak dari kerjaan kantor yang bejibun, trosss ga sesuai dengan bidang ...&lt;/p&gt;&lt;br /&gt;&lt;p&gt;hmmm....kata tmen gw sih, kerjain aje...itung2 bwat duit rokok...tapi yaa itu tiap hari makan ati...kerjaannya ...hmmm&lt;/p&gt;&lt;br /&gt;&lt;p&gt;sampe minggu ini gw dapet ngedesign dikit ..sederhana tapi mudah2an mudah dimengerti.... hehek&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_26.png" width="288" height="321" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;siapin dokumen baru ukuran standar web 760px..atow sesuka lu pada.....&lt;/p&gt;&lt;br /&gt;&lt;p&gt;bikin seleksi bwat menu bar diatasna&lt;/p&gt;&lt;br /&gt;&lt;p&gt;bijimane kalo gw pake style web 2.0 ke gini:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_18.png" width="238" height="353" /&gt;  &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_20.png" width="232" height="194" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_19.png" width="400" height="292" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_21.png" width="243" height="195" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;jadi ke gini hasil style na... &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_1.png" width="400" height="269" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;bagian bawah na, kasi kotak, make style ke gini:&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_22.png" width="237" height="348" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_24.png" width="248" height="196" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_23.png" width="387" height="281" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_25.png" width="243" height="194" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;hasilna&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_2.png" width="400" height="71" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;bikin shape di sebelah kiri na, pake rectangle tool &lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/rectangle-shape.png" width="23" height="19" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_3.png" width="154" height="388" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;ambil add anchor point tool &lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/anchor.png" width="22" height="22" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;tambahin  titik untuk bagian bawah ...dan tarik titik na ke atas ... &lt;/p&gt;&lt;br /&gt;&lt;p&gt;tros tarik kedua ujung titik baru ke arah tengah, biar bentuk na ga melengkung&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_4.png" width="161" height="266" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;tambahin satu titik lagi di bagian atas... na, kali ini bikin bentukna menjadi lengkung setengan lingkaran, dengan cara tarik kedua ujung titikna ke luar&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_5.png" width="132" height="297" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_6.png" width="125" height="307" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;woke kasi style untuk shape baru lu....&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_27.png" width="241" height="350" /&gt;  &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_28.png" width="238" height="193" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_29.png" width="388" height="152" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_8.png" width="120" height="299" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Lanjot ke [CTRL+Klik] pada layer shapping lu, tros pilih menu Select &gt; Modify &gt; Contract , kasi 2 px&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_9.png" width="113" height="290" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;ambil marquee tool , dengan mode Substract from selection&lt;/p&gt;&lt;br /&gt;&lt;p&gt;hilangkan setengah seleksi sebelah kanan ... &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_10.png" width="187" height="375" /&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;ambil gradasi tool, kasiiin gradasi kuning ke transparan&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_11.png" width="248" height="314" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;Untuk pusat objek layout, gunakan teknik Photoshop Magic Sphere bwat ngebikin bola kristal na...taro di atas shape lu, ubah mode layerna menjadi overlay&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_12.png" width="118" height="285" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;tambahin text Green Layout di area header&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_13.png" width="362" height="128" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;beberapa variasi bisa lu tambahin juga, jangan lupa bikin menu na, dan kasiin teks style web 2.0 di area kanan shapping lu&lt;/p&gt;&lt;br /&gt;&lt;p&gt;nah ntu bwat badges web 2.0 na  &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_14.png" width="400" height="237" /&gt; &lt;/p&gt;&lt;br /&gt;&lt;p&gt;woke jadi dah web 2.0 layout lu...hehehehe... &lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;a href="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20.png" target="_blank"&gt;&lt;img src="http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/greenweb20_17.png" alt="Green Layout Web 2.0 (Klik bwat ngegedein)" width="400" height="329" border="0" /&gt;&lt;/a&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt; &lt;/p&gt; &lt;P&gt;&amp;nbsp;&lt;/P&gt;&lt;P&gt;© Copyright 2008 &lt;a href="http://www.dremi.info" target="_blank" title="tutorial Photoshop"&gt;www.dremi.info&lt;/a&gt;&lt;BR&gt;&lt;B&gt;About the Author:&lt;/B&gt; dr.emi is a free man to distribute anything that he was founded. As a Webmaster He was publishing &lt;a href="http://www.dremi.info" target="_blank" title="tutorial Photoshop"&gt;www.dremi.info&lt;/a&gt; to create one community that loves free idealism. Very specialy in Design Category :) &lt;BR&gt;&lt;I&gt;Welcome to love it!&lt;/I&gt;&lt;/P&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/8242079819015736657-1695819938218422723?l=moeldy815.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://moeldy815.blogspot.com/feeds/1695819938218422723/comments/default' title='Poskan Komentar'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=8242079819015736657&amp;postID=1695819938218422723&amp;isPopup=true' title='0 Komentar'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/8242079819015736657/posts/default/1695819938218422723'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/8242079819015736657/posts/default/1695819938218422723'/><link rel='alternate' type='text/html' href='http://moeldy815.blogspot.com/2008/03/green-layout-web-20.html' title='Green Layout web 2.0'/><author><name>Moeldy</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='28' height='32' src='http://4.bp.blogspot.com/_iqLKOgMYxQI/Sa4GZyu0H3I/AAAAAAAAACI/6FZ4uWMvHBE/S220/moeldy2.png'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://i175.photobucket.com/albums/w126/hairulazami/Green%20Layout%20Web%202%200/th_greenweb20_26.png' height='72' width='72'/><thr:total>0</thr:total></entry></feed>
