Tuesday, March 8, 2016

3 Jenis Desain Layout Website yang Harus di Ketahui Sebelum Membuat Website

Jenis-Jenis Desain Tata Letak Website yang Harus di Ketahui Sebelum Membuat Website

Dikutip dari situs wikipedia,
Perancangan web (web design) adalah istilah umum yang digunakan untuk mencakup bagaimana isi web konten ditampilkan
Dari kutipan diatas, dapat disimpulkan bahwa dalam perancangan sebuah website, dibutuhkan layout atau tata letak (dalam bahasa indonesia)untuk mengatur dan membagi bagaimana isi dari sebuah website.

Tampilan website dapat mempengaruhi pengguna dalam mencari informasi. Jika tampilan awal sudah membingungkan, dalam hitungan detik pengunjung akan meninggalkan situs web dan akan menyebabkan turunnya traffik website.

 Berikut ini sedikit ulasan beberapa rancangan layout website yang dipakai dalam pembuatan website

Daftar isi

  1. Fixed Layout Web Design
  2. Liquid Layout Web Design
  3. Responsive Layout Web Design
3 Jenis Desain Layout  Website yang Harus di Ketahui Sebelum Membuat Website
3 Jenis Desain Layout  Website yang Harus di Ketahui Sebelum Membuat Website

Fixed Layout Web Design

Fixed web design adalah suatu situs web yang dirancang dengan ukuran tertentu(biasanya menggunakan satuan pixel) dan bersifat tetap. Situs yang menggunakan layout tipe ini biasanya menggunakan pembungkus(wrapper)yang memiliki lebar tetap sehingga website jenis ini tidak memperdulikan resolusi layar yang dimiliki pengunjung. Contoh website yang menggunakan tipe layout ini adalah CNN indonesia(http://www.cnnindonesia.com/). Berikut beberapa kelebihan dan kekurangan desain web dengan layout fixed.

Kelebihan

  • FIxed width layout lebih mudah di desain(biasanya bagi pemula yang baru belajar akan menggunakan jenis desain ini)
  • Mengurangi kerumitan dalam penyesuaian gambar, form, video, dan konten lainhya

Kekurangan

  • Tata letak yang menggunakan fixed-width dapat membuat ruang putih berlebihan bagi layar yang memiliki resolusi yang lebih besar
  • Jika di akses melalui layar yang memiliki resolusi rendah misalkan handpone, akan memerlukan scroll bar tergantung lebar layout yang telah di tetapkan


Liquid/Flexible Layout Web Design

Berbeda dengan Fixed layout, Liquid/flexible Layout Web Design memiliki kemampuan untuk menyesuaikan ukuran lebar layout sesuai dengan jendela browser(biasanya di desain menggunakan satuan persentase %). Jadi jika browser di set sebesar 80%, maka jenis website yang menggunakan layout ini akan meresize lebar website selebar ukuran lebar website*80%. Konsep ini banyak disukai oleh perancang web karena website akan tetap konsisten dalam berbagai resolusi monitor pengguna yang melihat halaman web. Di sisi lain, beberapa web desginer tidak menggunakan desain dengan teknologi ini karena berbagai macam alasan. Konsep layout ini merupakan cikal-bakal dari layout responsive yang akan dibahas sebentar lagi.

Kelebihan

  • Website akan terlihat user friendly karena dapat menyesuaikan ukuran resolusi browser yang biasanya berbeda-beda
  • Akan menghilangkan scroll bar jika diakses melalui layar resolusi kecil(misal:Handphone, Smartphone dll)

Kekurangan

  • Para Web Designer kurang memiliki kontrol atas apa yang dilihat oleh user
  • Ketika lebar jendela browser di set terlalu kecil, tampilan website akan kacau
  • Dalam beberapa kasus, perlu mengatur kembali gambar, video dan konten lainnya agar dapat menyesuaikan resolusi layar yang berbeda


Responsive Layout Web Design

Responsive Web Design atau dikenal dengan istilah RWD pertama kali diciptakan oleh seorang desainer dan pengembang web Ethan Marcotte. Layout Responsive sangat menarik karena layout jenis ini memiliki kemampuan untuk barganti layout dalam resolusi tertentu. Hal ini bisa terjadi karena kehadiran CSS3 media Query. Untuk mendesain jenis layout ini, kita harus memperhitungkan berbagai macam aspek seperti bagaimana web akan tampil di smartphone, tablet dan PC.

Kelebihan

  • Lebih menarik secara visual, karena website akan tempil berbeda sesuai dengan resolusi browser dan pengaturan @media query
  • Website akan terlihat user friendly karena dapat di akses melalui perangkat yang berbeda-beda


Kekurangan

  • Kode program lebih banyak karena kompleksitas dan banyaknya yang harus di setting
  • Menggangu penempatan gambar,video dan berbagai jenis konten lainnya yang bersifat tetap
Seteah mengetahui berbagai jenis layout web design, saya harap kalian bisa menentukan jenis layout apa yang yang akan kalian buat sesuai dengan kemampuan dan permintaa.