9 Tips Penggunaan Gambar Pada Web Desain

Seringkali para desainer web pemula menggunakan gambar yang berlebih dalam mendesain, akibatnya web tersebut akan terasa lambat saat di load oleh browser. Walaupun secara grafis web tersebut bagus namun dalam mendesain sebuah halaman web desainer harus memperhatikan isi (content) dari web tersebut, jangan sampai anda mengalahkan fungsi dari web sebenarnya hanya karena tampilan grafis.

Pemakaian grafis harus dapat mengatasi kebutuhan dan fungsi dari situs, misalkan komposisi warna dan bentuk, dan kesan yang akan ditonjolkan dari web tersebut, apakah untuk tujuan komersial? situs pribadi? perusahaan? pemerintah? ataukah tempat galeri online? dan masih banyak lagi.

Pemakaian grafis atau gambar yang kurang tepat pada sebuah web dapat mengakibatkan anda akan kehilangan pengunjung yang sebenarnya anda butuhkan.

Berikut ini adalah daftar bagian dari web yang biasanya memakai gambar namun banyak juga desainer web yang menggunakan teks untuk bagian tersebut,

1. Tombol Navigasi


Tombol navigasi mutlak diperlukan dalam sebuah web, dengan pengaturan tombol navigasi yang jelas akan membantu pengunjung menemukan informasi yang diinginkanya. Berberapa hal yang perlu diperhatikan dalam membuat tombol navigasi adalah Tulisan atau Teks harus dapat dilihat dengan jelas dan mudah dibaca.

2. Logo

Baik itu logo perusahaan, organisasi atau logo pribadi sering menggunakan gambar. Logo berfungsi sebagai gambar identitas dari perusahaan, logo yang bagus dapat meningkatkan brand name suatu perusahaan atau organisasi.

3. Sitemap


Penggunaan sitemap secara gambar memang dapat memudahkan pengunjung dalam mencari informasi namun penggunaan gambar dalam site map harus di pilih benar apakah web anda menjadi terlalu lambat atau tidak.

4. Bullet

Bullet banyak digunakan untuk penekanan point-point tertentu pada dokumen.

5. Banner


Banner yang dipasang di website dengan tujuan untuk memperbaiki komposisi bentuk, warna dan informasi penting (Hot Items) sering digunakan dalam website, dengan grafis yang menarik pengunjung akan tertarik untuk mengklik banner tersebut.

6. Garis Batas

Garis batas antar menu, bagian web, pemisah footer, header dan isi web baik horizontal maupun vertical layak digunakan karena biasanya garis batas mempunyai ukuran file yang kecil.

7. Gambar Background


Bagian ini digunakan untuk memberikan ciri khas, dan komposisi isi dan background pada web yang akan dibuat, asalkan file gambar yang digunakan tidak terlalu besar. gambar Background layak digunakan.

8. Headings

Alasan gambar digunakan untuk heading yang paling sering adalah karena beberapa tipe text tidak terdapat pada computer client, karena itulah digunakan file gambar sebagai gantinya.

9. Photo


Foto kegiatan atau bagian kegiatan yang menonjolkan spesifik dari website sangat diperlukan. Dengan foto yang jelas diharapkan pengunjung langsung dapat mengerti milik siapa, untuk apa website itu dibuat, dan kategori apakah web site tersebut. Penggunaan foto sering dipakai untuk memperjelas item produk pada website e-commerce.

Beberapa hal yang perlu diperhatikan dalam pemilihan dan pemakaian gambar atau grafis agar tampak serasi pada web yang anda buat adalah,

  • Warna semua grafis harus serasi, baik itu antara menu, logo perusahaan atau orgonasisasi, header, footer dan background yang digunakan

  • Warna dalam teks tombol navigasi harus dapat dibaca dengan jelas, perhatikan ukuran teks yang akan dimasukkan pada tombol navigasi, apakah terlalu kecil? apakah sudah enak dibaca? biasanya warna teks dalam tombol navigasi disesuaikan (tidak harus sama) dengan warna Logo atau Judul utama website

  • Jangan gunakan terlalu banyak kombinasi warna, sebab kombinasi warna yang berlebihan akan terkesan norak dan memperlambat proses download browser, cukup gunakan dua sampai 4 kombinasi warna dalam website, kecuali maskot atau ikon tertentu

  • Perhatikan ukuran website anda terhadap setiap penambahan gambar atau grafis, ukuran paling umum adalah 40 sampai dengan 70 K, dengan rata-rata koneksi modem 28.8 Mbps

  • Pisahkan gambar yang mempunyai warna berbeda, hal ini terjadi pada bagian grafis yang terdapat degradasi warna atau dua warna lebih.lebih baik usahakan untuk memotong perbagian warna yang berbeda, hal ini dapat mempercepat proses download gambar pada browser

  • Pilihlah jenis file yang benar, kapan anda menggunakan file gambar JPEG dan kapan menggunakan GIF. Pemilihan jenis file gambar yang tepat akan mempercepat proses download browser

Ingat pemakaian grafis jangan sampai menjadikan fungsi utama website tidak terpenuhi, apabila terlalu besar ukuran website anda akibat banyaknya file gambar, gantilah background, garis pemisah, bullet, heading dan dengan HTML.

Semoga bermanfaat.

Penulis: Johan Felisitas
Sumber: http://www.ilmugrafis.com/artikel.php?page=tips-penggunaan-gambar-pada-web-desain

18 Komentar:

Ladida Cafe mengatakan...

logo / maskot sebuah web kalo pake karakter kartun keren loh, ehehee :D

yg penting gambarnya ttp jelas dan ringan dimuat yah, makasih infonya mas ;)

Unknown mengatakan...

yup..yang penting jelas dan ringan dimuat :)

Mbah Qopet mengatakan...

mantap masbro buat refensi , review blog ane dong :D

Unknown mengatakan...

okay..mas bro, ane review!

Ary Wibowo mengatakan...

gw pikir lo yg buat artikelnya ul... koq tiba2 temen gw jd pinter bahasa Indonesianya. biasa kan bahasa Parung. wkwkwkwk :P. tau2nya copas. piss ah

Unknown mengatakan...

hheee .. besok2 sumbernya warna font pake putih ajalahh biar ga ketauan :)

Mbah Qopet mengatakan...

gimana masbro ? udah pas belum pemakaian warnanya

Adittya Regas mengatakan...

sumpah keren nih tips desain blognya :D jadi betah dimari hhe. salam kenal ya bro.

Alprablog™ mengatakan...

saya suka desain logo header blog ini :D

Unknown mengatakan...

Mbah Qopet: warna background-nya gw rasa ganggu itu, terlalu rame -.-"

Adittya Regas: hee..semoga dapet pahala, salam kenal juga :D

Alprablog™: makasih banyak kak dah ,mampir :)

usaha sukses mengatakan...

blog ane gak pake pernak pernik mas. Apa terlalu simpel yah?

Unknown mengatakan...

usaha sukses: overall bagus kok, nyaman buat orang berlama-lama mampir, buat masukan paling ditambahin grafis yang minimalis aja di headernya tp tetep overall dah bagus :)

IT-Soft Center mengatakan...

woooww...............mantab artikelnya.....lumayan buat nambah ilmu saya...
nice post gan...:)

Unknown mengatakan...

terima kasih kakak..semoga dapet pahala :D

Toing mengatakan...

postingan yang sangt keren, :) wajib di amalkan, makasih gan

Unknown mengatakan...

semoga dapet pahalan gan :)

Anjang mengatakan...

Keren bro tips nya.. Salam kenal ya

Unknown mengatakan...

okay .. salam kenal juga kakak :D

Posting Komentar