Pages

Wednesday 26 September 2012

PENGANTAR DESAIN WEB

kita mengenal beberapa istilah tentang web, www, website, web pages, dan homepage.
  • www  (Word Wide  Web) :  merupakan  kumpulan web  server dari seluruh dunia yang berfungsi menyediakan data dan informasi untuk digunakan bersama-sama.
  • Web  adalah adalah fasilitas hypertext yang mampu menampilkan data berupa teks, gambar, suara, animasi, dan multimedia lainnya, di mana di antara data-data tersebut saling terkait dan berhubungan satu dengan yang lainnya. Untuk memudahkan dalam membaca data  tersebut  diperlukan  sebuah  web  browser  seperti  Internet Explorer, Netscape, Opera, maupun Mozilla Firefox
  • Website (situs web) : merupakan tempat penyimpanan data dan informasi  berdasarkan topik tertentu. Diibaratkan web site ini seperti buku yang berisi topik tertentu.
  • Web Pages (halaman web) : merupakan sebuah  halaman khusus dari  situs  web  tertentu.  Diibaratkan  halaman  web  ini  seperti halaman khusus dari buku.
  • Homepage : merupakan sampul halaman yang berisi daftar isi atau menu dari sebuah situs web 
TIPS MEMBUAT WEBSITE PROFESIONAL
Terdapat beberapa point penting  ketika membuat sebuah website yang profesional.
  1. Homepage (halaman utama) situs Anda harus dapat diakses maksimal 8 detik atau dapat diakses melalui koneksi jaringan internet minimal 28,8 kbps. Apabila proses koneksi membutuhkan waktu yang sangat lama, hal ini akan berpotensi hilangnya customer (pengunjung) yang tidak “betah” menunggu terlalu lama. Akhirnya situs kita tidak akan dikunjungi olah para “calon customer”.
  2. Pastikan menyertakan META Tag pada masing-masing halaman website Anda. META Tag adalah kode yang memungkinkan search engine (mesin pencari seperti:   Google) untuk menentukan kata kunci yang relevan dari website Anda.
  3. Pilihlah warna latar belakang (background) yang sesuai, jangan menggunakan warna yang mempengaruhi teks untuk  dibaca. Warna situs menjadi sebuah ekspresi hati Anda. Warna orange melambangkan keceriaan sedangkan warna  ungu atau hitam melambangkan kesuraman. Untuk itu pilihlah warna yang sesuai untuk situs Anda berdasarkan isi yang terkandung dalam situs tersebut.
  4. Gunakan animasi seperlunya, jangan terlalu berlebihan karena dapat  mempengaruhi konsentrasi  pengguna  ketika  sedang membaca informasi. Selain itu, animasi juga dapat menghambat akses  ke  halaman  situs  Anda.  Sebuah  animasi  yang  bagus bukan menjadi jaminan bahwa situs  Anda  menarik perhatian pengunjung.
  5. Halaman Utama situs harus lebih spesifik agar para pengunjung dapat mengetahui produk yang ditawarkan. Sebagai contoh, jika situs Anda merupakan sebuah lembaga       konsultasi maka sebaiknya jasa-jasa konsultasi yang ditawarkan ditampilkan di halaman utama. Jangan sampai pengunjung merasa bingung dengan keberadaan situs Anda yang tidak  jelas produk yang ditawarkan.
  6. Hindari  pemasangan  iklan  (banner)  di  bagian  atas  website Anda. Batasi jumlah banner yang akan ditayangkan, maksimal 2 dan idealnya cukup 1 banner. Semakin banyak jumlah banner, semakin lama proses akses dan akan sangat mengganggu konsentrasi pengguna ketika mengunjungi situs Anda.
  7. Periksa ejaan yang salah dan pastikan gambar dan link terhubung dengan baik sebelum ditampilkan secara on-line. Kesalahan dalam mengetikkan alamat url mengakibatkan halaman tersebut akan “ERROR”. Jika sebuah situs terdapat salah satu atau beberapa halaman yang error menjadikan situs tersebut nampak tidak profesional.
  8. Lengkapilah website Anda dengan tombol navigasi yang mudah dan tersusun dengan rapi pada bagian atas, bawah, kiri, maupun kanan. Jika menggunakan tombol dalam bentuk gambar, perlu diingat bahwa kemungkinan proses akses lebih lama. Mengapa?  Karena gambar memiliki ukuran yang cukup besar, dan seperti kita ketahui. Sebuah halaman situs maksimal berukuran tidak lebih dari 100kb.
  9. Jika terpaksa harus menggunakan Frame, gunakan secara tepat. Pada dasarnya, penggunaan Frame dalam sebuah situs akan berkesan tidak profesional. Hindari halaman yang memerlukan “scroll”, ini mengakibatkan pengujung kurang nyaman untuk mencari informasi sehingga akan cepat-cepat “kabur” dari situs Anda.
  10. Perhitungkan  jumlah  klik  yang  dibutuhkan  untuk  pindah  dari halaman satu ke lainnya. Jika terlalu banyak klik akan sangat membosankan bagi pengunjung. Anda bisa menerapkan sistem navigasi  yang  lebih  nyaman  dengan  menyertakan  logo  pada setiap halamannya.
  11. Jika menggunakan “JAVA” pada website Anda gunakan secara tepat.  Tawarkan  “Java”  atau  “No  Java”  kepada  pengunjung karena  dapat  mempengaruhi  kinerja  masing-masing  browser.
  12. Hindari adanya iklan “pop up” yang akan membuat pengunjung menjadi bosan.
  13. Jangan menambahkan   “autoplay”   suara   ketika   seseorang mengunjungi    situs    Anda.    Sebaiknya    tawarkan,                apakah menggunakan intro beserta audio (suara) ataukah langsung ke halaman utama.
  14. Periksa website Anda dengan beberapa  jenis browser karena masing-masing browser memiliki kemampuan yang berbeda

SOFTWARE DISAIN GRAFIS
Dalam merancang sebuah website, kita tidak bisa lepas dari perangkat lunak untuk mengolah gambar (image) sebagai bagian dari website. Ada beberapa alat disain grafis yang dapat digunakan untuk membantu dalam membuat website yang cantik, diantaranya:
  • Adobe Photoshop (http://www.adobe.com) : software ini sangat populer  dan dapat diandalkan untuk membuat dan mengedit grafik maupun gambar fotografi.
  •  Adobe  Illustrator  (http://www.adobe.com) : software ini digunakan untuk membuat gambar dalam bentuk vektor dan dapat digunakan untuk membuat ilustrasi. 
  •  PaintShop Pro (http://www.jasc.com) : software ini sama dengan  Adobe  Photoshop,  sedikit  lebih  canggih  namun masih kalah populer dibandingkan Adobe Photoshop.
  • Macromedia Fireworks (http://www.macromedia.com) : software ini sangat mirip dengan Adobe Photoshop, namun tool  ini  berbasis  vektor.  Software  ini  mengijinkan  semua elemen dapat diedit kembali dan dapat berintegrasi dengan Macromedia Dreamweaver.
  •  Macromedia   Flash   (http://www.macromedia.com)   : software ini dapat digunakan untuk membuat animasi dan berbasis vektor untuk website.

FORMAT GRAFIS

Grafik/gambar dalam sebuah website dapat memberikan efek visual yang luar biasa terhadap website tersebut, namun bisa menambah waktu koneksi akibat banyaknya gambar yang ditampilkan. Grafik dalam website dapat berupa statik, animasi, dan fotografi.
Agar koneksi ke website kita lebih cepat, perlu memahami beberapa format   file   yang   sering   digunakan   pada   sebuah   website, diantaranya:
  •  GIF : memiliki warna 8-bit, mendukung dalam bentuk transparan, mengkompresi area warna secara solid, mereduksi jumlah warna dan menjalin untuk proses download secara cepat, juga dapat digunakan untuk membuat animasi dalam bentuk grafik (animated graphic).
  •  JPG : memiliki warna 24-bit,menjaga kualitas brightness dan hue yang ditemukan dalam sebuah foto, dapat disimpan dalam format berkualits tinggi maupun rendan (high or low resolution), sebuah             file jpg dapat pula digunakan versi resolusi rendah (low  resolution) dari gambar yang nampak ketika gambar sedang didownload, tidak mendukung transparansi.
  • PNG : PNG-8 mendukung warna 8 bit, mengkompres area warna yang  pekat, menjaga detail ketajaman, mendukung transparansi,   kompresi   lebih   canggih   dibandingkan   gif karena dapat mengkompresi sekitar 10-30% lebih kecil dari format GIF.
Setelah melihat perbandingan beberapa format file grafis untuk web, Anda dapat  menentukan format apa yang akan digunakan sesuai kebutuhan. Pada prinsipnya, semua format file tersebut dapat dijadikan panduan dalam memilih format file yang tepat. Ada beberapa bahan pertimbangan ketika memilih salah satu dari beberapa format file tersebut, diantaranya:
  • Usahakan ukuran file seminimal mungkin
  • Selalu gunakan mode warna RGB
  • Gunakan web pallete (216 web-safe colour)
Jika Anda memilih format file GIF : simpan sedikit warna jika perlu, simpanlah sebagai interlaced .gif, buatlah latar belakang transparan berwarna.
Jika Anda memilih format file JPG : pilih kualitas  yang paling kecil jika perlu, simpan sebagai progresive.
 


 

1 comment: