Digital Product Design | October 15, 2018 3:48 am

8 Tips Anti Gagal Agar Website Anda Lebih Responsive 

Perangkat mobile yang makin canggih dan internet yang makin mudah membuat kita semakin mudah mengakses internet. Kini internet tak hanya diakses melalui komputer, namun juga diakses melalui perangkat gerak seperti ponsel dan tablet.

Jika situs Anda tidak bisa dibaca di layar kecil, maka Anda berpotensi kehilangan porsi di perangkat gerak. Nah, kini saatnya Anda menggunakan desain yang lebih responsif.

Artikel kali ini membantu Anda dalam merancang desain situs yang lebih responsif.

1. Pikirkan mobile dulu

Sebelum Anda merencanakan desain untuk layar desktop, pikirkan dulu kenyamanan pelanggan di perangkat mobile. Banyak desainer situs kini lebih banyak fokus pada mobile lebih dulu.

Ini karena perangkat gerak lebih relevan dibanding desktop. Setidaknya 1 dari 5 orang di dunia menggunakan perangkat geraknya untuk mengakses internet. Fokuslah pada bagaimana pengguna berinteraksi dengan situs bila perangkatnya adalah mobile. Jika desainnya sudah jadi, maka bangunlah desain dengan layar lebih besar.

2. Gunakan Media Queries di CSS

Media queries adalah sebuah fitur di CSS yang memungkinkan konten untuk merespon berbeda tergantung pada device yang mengakses. Media queries akan memeriksa resolusi layar, tinggi, lebar, dan orientasi layar.

Kemudian informasi ini digunakan untuk menentukan rule CSS mana yang akan digunakan.

3. Pahami Perilaku Mobile Pengguna Situs Anda

Ada perbedaan antara interaksi dengan smartphone dan desktop. Anda bisa menggunakan Google Analytics untuk mengetahui perilaku pengguna situs Anda saat berkunjung.

Jika ada satu laman tertentu yang banyak dikunjungi melalui perangkat mobile, maka rapikanlah laman tersebut. Jika ada laman yang banyak dikunjungi melalui desktop, maka Anda bisa menambahkan lebih banyak ilustrasi dan embed video Youtube.

4. Kecilkan Gambar

Sebuah penelitian menunjukkan bahwa 48% dari situs responsif diproses mulai dari 4 sampai 8 detik. Semakin cepat sebuah situs, semakin baik. Malah 64% pengguna smartphone mengharapkan situs sudah selesai loading dengan waktu di bawah 4 detik.

Alasan utama di balik situs yang lamban adalah gambar yang terlalu besar. Jika bisa, kecilkan atau kompres gambar di dalam situs Anda. Anda bisa menggunakan tool seperti Adaptive Images dan TinyPNG.

6. Hilangkan Elemen yang Tidak Penting

Hilangkan saja elemen-elemen yang tidak penting, seperti kilauan-kilauan atau lagu. Ini tak hanya untuk meningkatkan kenyamanan pengguna, namun juga meingkatkan kecepatan situs.

Situs akan melambat bila terlalu banyak elemen yang berada di dalamnya. Untuk menghilangkan elemen yang tidak dibutuhkan, Anda bisa menggunakan tool seperti GZIP.

7. Perlukah Menggunakan Hamburger?

Tiga garis yang menyembunyikan menu, sering juga disebut hamburger, adalah sebuah kontroversi. Ada yang menyukainya, ada yang tidak. Jadi sebaiknya pakai atau tidak?

Untuk mendapatkan desain yang responsif, salah satu perspektif yang harus dilihat adalah soal kenyamanan. Jika seorang pengguna harus menekan tombol icon untuk memperlihatkan menu, itu akan melelahkan. Namun memperlihatkan banyak menu juga akan memenuhi layar.

Solusi yang dapat dipertimbangkan adalah memindahkan sebagian menu yang jarang diakses atau yang kurang penting ke dalam hamburger, sementara perlihatkan menu menu yang penting dan sering diakses.

8. Tingkatkan Keterbacaan

Jangan biarkan pembaca Anda repot-repot memperbesar layar, atau mungkin harus menyipitkan mata agar tulisan terlihat lebih jelas. Buat tulisan Anda cukup besar agar bisa dibaca di layar kecil.

Gunakan tulisan sebesar 16 px atau 1 layanan email marketing, atau 12 pt.

Nah, demikianlah 8 Tips Anti Gagal Agar Website Anda Lebih Responsive. Semoga membantu!