Membuat Background Halaman Web dari Foto (1)
| Membuat Background Halaman Web dari Foto (1) |
| |
| |
|
| | Anda dapat menggunakan sebuah foto sebagai gambar background untuk sebuah halaman web. Sayangnya sebuah foto full-color akan cukup memakan bandwidth untuk download ketika proses akses berlangsung. Disini anda akan saya ajarkan bagaimana menggunakan Adobe® Photoshop® Elements 2.0 untuk membuat sebuah gambar background monochromatic yang menarik untuk halaman web, dengan ukuran yang kecil sehingga proses download jauh lebih cepat. | | | | Software : Adobe Photoshop 5.5 | |
|
|
|
|
|
|
|
| 1 |
| | Buka file foto warna anda di photoshop | | File > Open. Buka foto warna yang akan anda gunakan sebagai gambar background. Atur ukurannya atau crop jika memnungkinkan. Image > image size Untuk gambar yang dimasukan kedalam halaman web, sebaiknya ukurannya 680 sampai 800 pixels wide dan 480 sampai 600 pixels high. Hati-hati dengan detail dalam foto yang anda pilih. Sebuah gambar background dengan terlalu banyak detail [resolusi warna tinggi] mengurangi kemampuan membaca seseorang pada halaman web anda. | | | | Sekarang anda akan memberikan warna pada foto anda, kemudian mengurangi ukuran file lewat sebuah proses yang disebutnya pengoptimalan [optimizing]. | | | | | |
|
|
| 2 |
| | Pewarnaan Foto. | | Klik Image > Adjust Color > Hue/Saturation. Select the Colorize option. Gunakan sliders Hue, Saturation, dan Lightness untuk mengatur warna dan penerangan [lightness] dari foto anda. Yakinkan bahwa kotak kecil Preview option sudah dalam keadaan Hue/Saturation di dialog box jadi anda dapat preview pengaturan dalam dokumen window. | | | | | |
|
|
| 3 |
| | Buatlah foto tsb dalam subtile [spt kotak jubin] | | Lakukan eksperimen dengan warna-warna lain dan saturasi [saturation] gambar anda, tetapi usahakan dalam batas yang mudah dibaca untuk. Warna gelap [dark], saturated background colors dapat mengurangi kejelasan daripada teks atau mudah dibaca[legibility of text]. Dimanapun warna soft, warna netral biasanya membantu tampilan desain web nampak jauh lebih bagus. | | | | Ketika anda sudah merasa puas dengan pewarnaan foto tsb, klik OK. | | | | Sekarang anda optimalkan background foto anda agar ukuran file background sekecil mungkin. | | | 
| Membuat Background Halaman Web dari Foto (2) |
| | | |
| 4 |
| | Optimalkan pewarnaan gambar anda | | Klik File > Save for Web. Kemudian pilih format gambar GIF atau JPEG dari pop-up menu pada waktu anda klik Save For Web di dialog box. Dalam contoh ini saya menggunakan format JPEG. Walaupun format GIF tampaknya bisa lebih kecil ukuran filenya daripada JPEG. Format JPEG lebih bagus untuk mencegah warna yang terlalu "ramai" [ dithering] dan mempertahankan detail warna dalam sebuah gambar foto yang continuous-tone. Jika anda memilih format JPEG, aturlah pengoptimalan dengan menunjuk Low untuk sebuah ukuran file kecil. Tak ada gunanya gambar dengan higher quality jika gambar tsb hanya digunakan sebagai background. Anda dapat preview gambar yang sudah optimal dalam dialog box. Klik OK untuk mengoptimalkan gambar anda. | | | | Sekarang gambar foto anda siap untuk digunakan sebagai sebuah halaman background web. Anda bisa menggunakan program seperti Adobe® GoLive® atau HTML code dan set up halaman web anda. | | | | | |
|
| | 5 |
| | Tambahkan elemen lain ke halaman web anda (pilihan). | | Anda bisa menambahkan elemen seperti teks, buttons, dan graphic ke halaman web anda. Elemen ini seharusnya melengkapi gambar background yang sudah anda buat. Jika format background images dalam bentuk tile—batasi contents halaman web anda dengan ukuran sesuai tile yang pertama. Pengguna tidak dipaksa untuk scroll ke tile berikutnya untuk melihat semua content. | | | | . | | Selesai. Selamat mencoba | |
| | |
Tidak ada komentar:
Posting Komentar