Kesalahan umum dalam mendesain situs web

21 November 2019 · Design

Kesalahan ini sering dilakukan oleh desainer, baik desainer pemula maupun yang sudah berpengalaman.

Mendesain untuk layar sendiri.

Tidak hanya tingkat fresh graduate, tapi pada level manajer pun pernah saya temui kesalahan ini.

Memang, mendesain memakai ukuran resolusi layar sendiri lebih enak dipandang saat mengerjakannya, tapi pastikan ukurannya sesuai dengan penggunanya.

Tim saya pernah mendesain memakai MacBook Pro terbesar yang saat itu ia setel selebar 1920 pixel. Semua dimensi desainnya disesuaikan dengan ukuran layarnya, misalnya ukuran container untuk mengatur breakpoint (kapan harus responsif), ukuran kolom untuk grid system, hingga ukuran fontnya.

Saat diterjemahkan menjadi kode dan dites di layar para developer (kalau tidak salah 1440 pixel), desainnya malah jadi berantakan. Saat dites di ukuran resolusi layar yang umum dipakai pengguna (saat itu masih zaman 1280 pixel), makin berantakan lagi.

Prinsip yang benar adalah dengan mengikuti ukuran resolusi pengguna, kalau variabel ini tidak diketahui bisa memakai ukuran resolusi yang umum di pasaran. Jadi bukan karena desainer memakai laptop beresolusi 1920 lalu desainnya malah mengikuti ukuran tersebut.

Hanya membuat satu desain.

Masih terkait poin di atas.

Satu desain di sini bukan soal alternatif desain, tapi desain responsif. Desain web sendiri mengenal lima jenis gawai (walau batasan ukuran resolusi layarnya sudah mulai kabur).

  • Mobile phone
  • Phablet
  • Tablet
  • Laptop
  • Desktop

Kalau hanya membuat satu saja (misalnya hanya laptop), bagaimana kalau ada pengguna yang membuka situs webnya dari mobile? Memaksa pengguna membeli laptop?

Desainer harusnya memikirkan skenario ini saat merancang desainnya. Kalau tidak ada waktu untuk membuat kelimanya, membuat dua saja yang paling umum dipakai (mobile dan laptop) sudah cukup sebagai bahan untuk membuatnya responsif.

Tidak menyertakan dokumentasi dan aset.

Developer yang model “kejar setoran” biasanya menggunakan color picker untuk mengambil warna yang dipakai dalam desain, mereka juga asal dalam mengekspor aset(logo, ikon, ilustrasi, dan visual lainnya).

Hasilnya, dalam satu laman bisa ditemukan 10 warna hijau yang berbeda, padahal hanya ada 1 saja. Aset visualnya juga seringkali pecah saat dicoba di ukuran resolusi layar lain.

Hal ini bisa dicegah oleh desainer dengan menyertakan dokumentasi yang jelas (tidak perlu lengkap, yang penting jelas). Untuk aset juga bisa disertakan oleh desainer seperti kapan harus memakai SVG atau ada berapa jenis ukuran PNG/JPG tergantung ukuran resolusi layarnya.

Gak ngobrol.

Ini juga termasuk umum, desainer tidak berdiskusi dengan developer dan tidak melibatkan developer di awal perancangan.

Saat desain diserahkan ke developer, kemungkinannya hanya tiga:

  1. Bisa dikerjakan.
  2. Tidak bisa dikerjakan: mungkin karena developernya tidak punya kemampuan untuk mengerjakannya, atau juga karena tidak ada waktu yang cukup untuk mengerjakannya.
  3. Tidak mungkin dikerjakan: biasanya ini hal-hal teknis macam teknologinya belum ada, atau APInya tidak ada (atau tidak dikasih akses oleh tim lain), atau harus berjuang mati-matian untuk mendapat approval membeli lisensi sesuatu, dan lain-lain.

Kalau hasilnya nomor 1, Alhamdulillah bisa rebahan. Kalau hasilnya malah nomor 2 atau 3, desainernya malah harus kerja dua kali untuk memperbaiki desainnya.

Daripada harus membuat dua kali, lebih baik mencegahnya dengan ngobrol sejak awal.

Tapi juaranya adalah ini: manajemen layer

Layer dibiarkan berantakan, tidak dinamai dan tidak dikelompokkan? Buat apa jadi desainer kalau pekerjaannya malah menyusahkan desainer lain dan para developer?

Marie Kondo commenting on Photoshop's Layers
Marie Kondo kalau melihat layer

Ini kesalahan yang paling umum dilakukan para desainer: tidak melakukan manajemen layer.

Kalau desainer ini bekerja sendiri dan hasil pekerjaannya juga untuk diri sendiri, tidak masalah mau membiarkan layer-nyaberantakan. Tapi kalau pekerjaannya untuk orang lain dan/atau bekerja bersama dalam tim? Menyusahkan sekali para desainer pemalas seperti ini. Ya, pemalas, saya rasa tidak perlu memperhalus istilah untuk golongan ini.


Catatan: Ini adalah salinan jawaban saya di Quora. Saya akan menulis ulang jawaban yang saya suka di Quora ke dalam blog saya.


Have any questions or comments about this post? Contact me using the form on this page or on Instagram at @RifatNajmi.