Liquid Design dalam Membuat Website yang ‘Cross-Resolution’ (bag. 1)

Salam,
Ini posting pertama di blog ini, semoga bisa memberikan sedikit pencerahan yaa. Selamat menikmati! * aammm nyam nyam :-9 *

Liquid design digunakan untuk membuat website lebih enak dikunjungi dan user-friendly. Masalah yang sering dihadapi para pengembang web salah satunya adalah aksesibilitas. Aksesibilitas itu menentukan ‘derajat’ suatu website bagi pengunjungnya. Tujuan utama pemanfaatan liquid design dalam pembangunan website ini adalah membuat website yang enak diakses dan digunakan (baca: dilihat) secara universal.

Apa sih liquid design?
Tau kah kamu apa itu layar monitor?
Yups, layar monitor adalah suatu benda yang menjadi perantara dalam menampilkan informasi, gambar ataupun yang lainnya. Masing-masing monitor memiliki bahan material dan standar resolusi yang tetap. Tapi bagi para desaine website berbeda, layar monitor adalah salah satu masalah yang harus dipecahkan untuk membuat tampilan website yeng enak dipandang dan stabil untuk setiap pengunjung. Karena pengujung tidak mau dipaksa untuk melihat website dengan resolusi tertentu, dan setiap pengunjung punya hak untuk memilih resolusi monitor yang diinginkan.
Di sini lah, liquid design berperan untuk mengatasi masalah tersebut. So, intinya liquid design adalah cara website beradaptasi pada ruang yang disediakan monitor agar terlihat cucok dan yahud.

Liquid design dan masalah tampilan website yang cacat
Seperti yang telah dibicarakan sebelumnya, liquid design berperan dalam adaptasi website terhadap resolusi layar monitor setiap pengunjungnya. Tujuan implementasi liquid design pada website adalah menyediakan pengalaman kunjungan yang serupa untuk setiap pengunjung dan mengurangi kemungkinan tampilan website yang cacat akibat perbedaan resolusi monitor, seperti terlalu banyak ruang kosong (istilah kerennya white space, bukan white house lho 😀 *garing*), bagian website yang penting namun tidak kelihatan karena kurang ruang untuk menampilkannya.
Ada beberapa cara sederhana yang dapa dilakukan dalam implementasi liquid design, seperti yang saya translate dari website www.mardiros.net :

1. Pertimbangkan resolusi yang paling banyak digunakan oleh user internet di dunia.
Dari hasil statistik penggunaan resolusi layar yang saya kutip dari http://www.webmasterworld.com , lebih dari 50% pengguna internet menggunakan resolusi1024×768 pada masing-masing komputernya. Kemudian paling banyak kedua menggunakan resolusi 1280×1024, kemudian 800×600 di urutan ketiga dalam satstistik penggunaan resolusi layar pengguna internet.
Tapi tunggu! Sadari dulu, apakah website yang akan dibuat memiliki target pengguna di seluruh dunia atau lebih sempit? Misalkan kita akan buat website dengan lingkup nasional, seperti website sekolah, perpajakan, dlsb. Website tersebut lebih dominan ditujukan pada pengguna di negara tertentu saja, misalkan di Indonesia. Indonesia merupakan negara berkembang, di mana internet masih terbilang cukup mahal untuk beberapa kalangan. Masyarakat masih ada yang belum faham pentingnya internet sebagai pendukung kemajuan kehidupan. Kebanyakan masyarakat Indonesia masih memanfaatkan warnet dengan fasilitas minimal untuk mengakses internet. Resolusi monitor di kebanyakan warnet di Indonesia adalah 800×600 sehingga resolusi ini juga harus kita pertimbangkan dalam mendesain suatu website yang terget utama pengunjungnya adalah orang Indonesia, terutama kalangan warnet yang masih berspesifikasi komputer ‘minimal’.
Jadi kesimpulannya adalah persiapkan desain website untuk keadaan 3 resolusi yang mungkin masih digunakan saat sekarang, yaitu 800×600, 1024×768 dan yang lebih tinggi dari 1024×768.

2. Implementasi 3 kategori website : Ice Website, Jelly Website, Liquid Website.
1. Ice Website
Sudah terbayang dari namanya, ice = es = keras = kaku. Yups, jadi kategori ini termasuk website yang fixed dalam segi penampilan konten dan desain. Fixed dalam artian dalam resolusi berapapun pada monitor pengunjung, website hanya ditampilkan dalam satu resolusi tetap. Jelas dalam kategori ini, jika dalam resolusi yang lebih rendah dari resolusi website, maka beberapa bagian website akan tidak terlihat, sehingga pengunjung mau tidak mau harus menggeser (alias nyecroll) secara horizontal maupun vertikal untuk melihat konten yang tidak terlihat sebelumnya. Dan dalam keadaan resolusi website lebih kecil dari resolusi monitor yang digunakan pengunjung, maka akan terdapat banyak ruang kosong (white space) pada layar, sehingga menggurangi optimasi monitor dalam menampilkan informasi/konten website.

2. Jelly Website
Jelly website adalah kategori website yang mempertahankan keseimbangan atau disebut juga equilibrium. Kategori website ini menempatkan desain website di tengah layar, sehingga dalam keseimbangan sisi kiri dan kanan website tetap terjaga. Contoh penggunaan kategori ini antara lain desain dari weblog (baca: blog). Walaupun kategori ini lebih baik dari kategori Ice Website dan lebih banyak digunakan saat ini, Jelly Website belum dapat mengoptimalisasikan penggunaan ruang pada monitor.

Naaahh…udah dulu yah, kita sambung di bagian selanjutnya, coz kalo disekaligusin bakalan pusing en jadi males baca. Secara gitu, para internet surfer/browser people cuma suka baca pake metode scanning, so ga suka kalo bacaannya panjang kurang jelas * kayak saya 😀 *.

Oke, akhirul kata…wassalam.

2 thoughts on “Liquid Design dalam Membuat Website yang ‘Cross-Resolution’ (bag. 1)

Leave a Reply

Your email address will not be published. Required fields are marked *