Langkah Membuat Navigasi Website yang Lebih Baik
- Muhammad Rezqi Pratama
- Feb 20, 2023
- 5 min read
Updated: Mar 2, 2023

Navigasi menu ada untuk membantu kami menemukan konten dan itu harus sederhana dan intuitif. Saat melihat website, harapan kami adalah menavigasi dengan mudah dan memiliki pengalaman yang luar biasa, tetapi sayangnya, tidak setiap situs dirancang sebaik yang seharusnya. Bagian dari peran saya sebagai desainer web senior adalah memastikan bahwa pengguna tahu di mana mereka berada, di mana mereka berada, dan ke mana mereka pergi! Merancang sistem navigasi yang solid tanpa pertanyaan adalah salah satu aspek terpenting dalam mendesain website. Mudah-mudahan di bawah ini akan menjelaskan dasar-dasar navigasi, gaya populer dan mengapa penting untuk mengikuti konvensi web.
Perencanaan Navigasi
Dalam hal desain web dan khususnya navigasi menu, titik awalnya adalah mencari tahu fitur apa yang ditawarkan website dan hierarki di mana informasi harus ditampilkan. Menu website pada tahap awal biasanya disebut sebagai 'peta situs' dan ini biasanya disatukan sebagai diagram atau spreadsheet untuk menunjukkan tingkat informasi yang berbeda. Anda juga bisa membuat menu berdasarkan kategori untuk membuat website lebih efektif. Tidak ada yang benar atau salah dalam membuat peta situs, bahkan kami mendorong klien kami untuk bekerja dengan format apa pun yang mereka rasa nyaman digunakan.
Bahasa Ramah Pengguna
Sangat penting untuk mempertimbangkan bahasa navigasi menu dan pelabelan. Dengan begitu banyak persaingan di web dengan domain com murah yang ada, tidak mengherankan jika kami mencoba berkreasi dengan copywriting kami, tetapi terkadang hal ini mengorbankan kejelasan. Situs Anda mungkin khusus industri, namun penting untuk tidak melupakan pengguna dan bagaimana mereka menafsirkan atau memahami apa yang Anda lakukan. Misalnya jika Anda memberi label area toko 'Marketplace', ini bukan istilah yang akrab bagi pengguna dan karenanya meninggalkan celah untuk interpretasi.
Tautan apa pun yang membutuhkan lebih dari satu detik untuk mencari tahu atau bahasa yang memaksa pengguna untuk mengklik untuk menemukan apa yang tersedia membahayakan pengalaman pengguna. Jika Anda ingin melihat kata mana yang akan bekerja lebih baik untuk navigasi utama Anda, Anda dapat melakukan beberapa pengujian A/B ke tempatnya. Lebih sering daripada tidak, yang terbaik adalah menjaga navigasi utama Anda tetap sederhana dan mudah dipahami dan jika Anda ingin menambahkan personalisasi, mengapa tidak mencobanya dengan pop-up dan notifikasi?
Jangan Menemukan Kembali Roda (Gunakan Konvensi Web)
Alasan mengapa konvensi ada adalah karena mereka didasarkan pada ide-ide yang berhasil. Begitu sebuah ide diketahui berhasil, ini biasanya menghasilkan banyak pengikut sehingga kemudian menjadi bahasa yang umum. Konvensi desain bekerja dengan sangat baik sehingga Anda dapat melihat website dengan domain murah anda dalam bahasa yang sama sekali berbeda dan masih menavigasi sebagian jalan Anda. Satu-satunya saat Anda harus keluar dari konvensi adalah jika Anda memiliki cara yang lebih baik dalam melakukan sesuatu, misalnya jika Anda memiliki situs kampanye, mungkin lebih tepat untuk melakukan sesuatu yang tidak konvensional dengan menu.
Navigasi Utama
Navigasi utama harus menonjol dan konsisten di seluruh situs. Biasanya, menu utama akan berada di sepanjang bagian atas halaman di tengah atau disejajarkan ke kiri atau kanan halaman. Cara lain untuk mengidentifikasi menu utama adalah cara memperlakukannya: menu utama biasanya dirancang untuk kontras dengan yang lainnya sehingga mata Anda mudah tertuju padanya.
Tautkan Logo Kembali ke Beranda
Ini mungkin tampak jelas, namun tidak jarang menemukan situs yang gagal menerapkan fungsi ini. Konvensi umum untuk penempatan logo adalah sudut kiri atas atau dipusatkan di sepanjang bagian atas dan logo juga dikenal sebagai tautan kembali ke beranda. Ini adalah konvensi yang paling baik diikuti karena diterapkan secara luas.
Navigasi Responsif
Desain responsif dianggap sebagai salah satu cara terbaik untuk membuat website dengan domain Indonesia Anda terlihat bagus di perangkat apa pun dan bagian dari tren ini adalah penggunaan gaya navigasi ringkas yang disebut 'menu hamburger'. Ikon ini terdiri dari tiga garis horizontal yang sedikit terpisah dan disamakan dengan hamburger karena saat Anda mendekonstruksi elemen utamanya, Anda akan mendapatkan dua potong roti dan daging di tengahnya. Memang ini adalah simbolisme yang cukup abstrak jadi jika Anda tidak bekerja di ruang digital maka Anda mungkin tidak akan terbiasa dengan istilah ini tetapi Anda akan terbiasa dengan ikon itu sendiri.
Seluruh alasan munculnya menu hamburger adalah karena perlu ada cara untuk bernavigasi di perangkat seluler tanpa menghabiskan terlalu banyak ruang. Ikon hamburger menjadi solusi berkat ukurannya yang ringkas dan dapat diselipkan di pojok kanan atas atau kiri. Fungsionalitas menu hamburger dapat bervariasi dari satu situs ke situs lainnya, tetapi pada dasarnya berfungsi dengan menggeser ke dalam, menggeser ke bawah, atau muncul ke atas. Karena ikon hamburger telah menjadi konvensi terkenal, Anda mungkin mulai memperhatikan beberapa situs yang tidak mau mengubah gaya ini di desktop. Anda tidak akan menemukan ini di situs konten berat tetapi Anda mungkin mulai melihat ini di seluruh agen butik atau situs kampanye.
Saat mendesain menu hamburger, penting untuk mendesain level menu dengan jelas agar pengguna tidak bingung cara menavigasi. Ini bukan masalah di desktop namun begitu Anda melihat menu seperti ini di ponsel, navigasi bisa menjadi sedikit membingungkan. Rekomendasi kami untuk menu yang menelusuri hingga empat level adalah dengan menggunakan panah yang terlihat seperti tombol sehingga pengguna dapat mengetuk item menu atau mengetuk tombol panah untuk memperluas.. Warna dan indentasi teks juga dapat digunakan untuk membedakan tingkat navigasi.
Navigasi Lengket
Navigasi lengket atau tetap pada dasarnya adalah menu website yang sudah register domain yang dikunci pada tempatnya sehingga tidak hilang saat pengguna menggulir halaman ke bawah. Anda dapat menerapkan menu lengket untuk website apa pun, tergantung apakah itu cocok untuk tujuan desain dan navigasi atau tidak. Secara pribadi saya cukup suka ketika situs dengan peta situs kecil menggunakan menu lengket - namun saya juga cukup terkesan dengan cara ING Direct mengintegrasikan menu lengket ke dalam desain website mereka.
Tunjukkan di Mana Anda Berada
Itu selalu merupakan pengalaman yang baik jika Anda dapat melihat di mana Anda berada di dalam situs apakah menu disorot, remah roti terlihat atau gambar spanduk utama menampilkan judul halaman. Saya cukup penggemar perawatan menu yang disorot; itu sederhana dan jelas tanpa meninggalkan ruang untuk kebingungan.
Kapan Menggunakan Menu Mega
Menu mega adalah panel navigasi besar yang biasanya jatuh atau terbang keluar dari bilah navigasi global. Meskipun tidak sesuai untuk setiap situs, menu mega dapat menciptakan pengalaman navigasi yang luar biasa bagi pengguna jika dilakukan dengan baik. Manfaat utama dari menu mega adalah memfasilitasi tampilan banyak pilihan sekaligus. Menu mega dapat menggunakan ikon dan gambar serta hierarki tipografi untuk memudahkan pemindaian. Jadi kapan mereka berguna? Menurut pendapat saya, menu mega bekerja dengan baik untuk situs ritel di mana daftar kategorinya cukup besar dan tidak akan terlihat bagus di menu dropdown standar. Mereka juga bekerja dengan baik untuk situs yang memiliki banyak daftar layanan seperti Virgin Australia atau ING misalnya. Butterfly telah merancang beberapa situs yang menggunakan menu mega, namun pendekatan ini hanya dilakukan jika dianggap tepat.
Kesimpulan
Navigasi menu adalah bagian integral dari desain web dan penting untuk membuat solusi yang dipikirkan dengan matang berdasarkan kebutuhan klien Anda. Untuk meringkas tip-tip panas, berikut adalah daftar periksa untuk desain web dengan domain 10rb Anda berikutnya:
Rencanakan peta situs Anda secara menyeluruh di awal proyek
Aturan menyeluruh - pengguna harus tahu di mana mereka berada, ke mana mereka pergi, dan ke mana saja mereka sebelumnya!
Menyediakan berbagai opsi navigasi
Ikuti konvensi web
Jangan takut untuk menampilkan menu hamburger di situs desktop jika sesuai
Gunakan istilah ramah pengguna yang sederhana
Comments