{"id":5,"date":"2021-11-24T21:40:00","date_gmt":"2021-11-24T14:40:00","guid":{"rendered":"http:\/\/www.rumahweb.com\/journal\/merancang-navigasi-website.htm"},"modified":"2022-08-25T14:42:33","modified_gmt":"2022-08-25T07:42:33","slug":"navigasi-adalah","status":"publish","type":"post","link":"https:\/\/www.rumahweb.com\/journal\/navigasi-adalah\/","title":{"rendered":"Apa Itu Navigasi dan Tips Merancang Navigasi di Website?"},"content":{"rendered":"\n<p>Navigasi website yang ditampilkan pada menu dan link adalah petunjuk bagi pengunjung, untuk mendapatkan informasi halaman-halaman pada website Anda. Tidak hanya bagi pengunjung, navigasi pada website juga sangat penting bagi search engine dalam memahami karakteristik website Anda. <\/p>\n\n\n\n\n\n<p>Pada panduan ini, kami akan menjelaskan kepada anda apa itu Navigasi beserta cara merancang navigasi pada website. Berikut informasi selengkapnya:<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Apa itu Navigasi?<\/h2>\n\n\n\n<p>Secara istilah, navigasi bisa diartikan dengan petunjuk. Sedangkan secara bahasa, nagivasi adalah petunjuk atau arah perjalanan yang menggambarkan sebuah peta wilayah. Pada sebuah website, navigasi dapat berupa menu yang tampil diatas halaman website, hingga menu-menu pendukung yang biasanya tampil di bawah website.<\/p>\n\n\n\n<p>Dengan adanya navigasi pada website, pengunjung akan semakin mudah menemukan halaman-halaman lain, dari menu navigasi yang Anda buat. Berikut adalah contoh navigasi pada website : <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi.png\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"160\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi.png\" alt=\"Menu navigasi adalah\" class=\"wp-image-28897\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi.png 800w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-300x60.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-768x154.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-370x74.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-270x54.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-570x114.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-740x148.png 740w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/a><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-di-footer.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"414\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-di-footer-1024x414.png\" alt=\"contoh nagivasi pada website\" class=\"wp-image-28898\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-di-footer-1024x414.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-di-footer-300x121.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-di-footer-768x310.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-di-footer-370x150.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-di-footer-270x109.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-di-footer-570x230.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-di-footer-740x299.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2022\/04\/menu-navigasi-di-footer.png 1232w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<p>Tidak hanya bagi pengunjung, sistem navigasi pada website juga sangat disukai oleh <em><a href=\"https:\/\/blog.rumahweb.com\/search-engine-adalah\/\" title=\"search engine adalah\">search engine<\/a><\/em>, karena memudahkan sistem mereka untuk melakukan crawling dan mengetahui detail website yang Anda buat. <\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Tips Merancang Navigasi Website<\/h2>\n\n\n\n<p>Berikut adalah tips dari Rumahweb, untuk merancang navigasi website yang baik dan benar :<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rencanakan dengan Baik<\/strong><\/h3>\n\n\n\n<p>Hal yang mutlak dilakukan sebelum mulai membuat sebuah web tentunya adalah pembuatan konsep dari website itu sendiri. Konsep tersebut akan memuat navigasi dasar dalam bentuk &#8220;tree view&#8221; (bercabang dan beranting) dari mulai konten yang bersifat umum hingga konten yang bersifat mendetail. Inilah garis besar navigasi dari situs yang akan dibuat.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Dimana Navigasi diletakkan<\/strong><\/h3>\n\n\n\n<p>Seperti telah dikemukakan di atas, bahwa navigasi akan membawa pengunjung dari hal &#8211; hal yang bersifat umum hingga hal &#8211; hal yang bersifat mendetail. Halaman utama (index) tentu saja akan memuat menu &#8211; menu pokok yang bersifat umum.<\/p>\n\n\n\n<p>Percabangan dari menu &#8211; menu inti tersebut dapat di letakkan pada halaman &#8211; halaman cabang dari index. Alternatif lain, Anda dapat menggunakan <a href=\"https:\/\/blog.rumahweb.com\/javascript-adalah\/\" title=\"javascript adalah\">javascript <\/a>untuk menampilkan menu dan sub-menu sekaligus.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Konsisten<\/strong><\/h3>\n\n\n\n<p>Sebisa mungkin jangan merubah letak menu pada setiap halaman web sehingga pengunjung lebih mudah menemukan menu-menu tersebut. Misalnya menu utama berada di atas, setelah itu pada halaman-halaman yang terdapat dalam menu utama dapat ditampilkan sub-menu di sebelah kiri atau kanan halaman.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Spotty!<\/strong><\/h3>\n\n\n\n<p>Buatlah menu dengan menonjol sehingga pengunjung mudah mengenalinya. Hal ini tentu saja harus di gabungkan dengan unsur estetika sehingga menu &#8211; menu tersebut dapat sejalan dengan konsep desain web yang dibuat.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Singkat &amp; Deskriptif<\/strong><\/h3>\n\n\n\n<p>Kata &#8211; kata yang terdapat dalam menu harus mampu memberikan petunjuk yang jelas dan singkat tentang halaman website di bawah menu tersebut. Gunakan istilah &#8211; istilah yang lazim, singkat, dan mudah dipahami.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Berikan Petunjuk pada Pengunjung<\/strong><\/h3>\n\n\n\n<p>Akan lebih baik jika pada halaman website memuat strukur singkat halaman web yang sedang di tampilkan. Misal : Tentang Kami &gt;&gt; Visi &amp; Misi &gt;&gt;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Berikan Link ke Halaman Utama<\/strong><\/h3>\n\n\n\n<p>Jangan lupa untuk memberikan link ke halaman utama atau link ke halaman dalam &#8220;parent topic&#8221;. Ini akan memudahkan pengunjung jika situs Anda di bangun dalam struktur menu dan submenu yang cukup kompleks.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Sitemap<\/strong><\/h3>\n\n\n\n<p>Buatlah sitemap yang linknya berada di setiap halaman web. Ini akan semakin memudahkan dan mempersingkat proses pencarian halaman-halaman website oleh pengunjung.<\/p>\n\n\n\n<p>Berikut kami sertakan referensi untuk pembuatan sitemap pada website: <br \/>1. <a href=\"https:\/\/www.rumahweb.com\/journal\/cara-membuat-sitemap-di-wordpress-dengan-plugin-google-xml-sitemaps\/\">Cara Membuat Sitemap di WordPress<\/a><br \/>2. <a href=\"https:\/\/www.rumahweb.com\/journal\/bikin-sendiri-sitemap-google\/\">Cara Membuat Google Sitemap<\/a><\/p>\n\n\n\n<p>Jika pengujung merasa nyaman dalam mengunjungi website Anda, maka akan semakin baik pula content website dapat diterima oleh pengunjung.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Navigasi website yang ditampilkan pada menu dan link adalah petunjuk bagi pengunjung, untuk mendapatkan informasi halaman-halaman pada website Anda. Tidak hanya bagi pengunjung, navigasi pada website juga sangat penting bagi search engine dalam memahami karakteristik website Anda. Pada panduan ini, kami akan menjelaskan kepada anda apa itu Navigasi beserta cara merancang navigasi pada website. Berikut [&hellip;]<\/p>\n","protected":false},"author":329,"featured_media":18172,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[1477,33,22],"class_list":{"0":"post-5","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-web-design","8":"tag-navigasi","9":"tag-sitemap","10":"tag-website"},"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/5","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/users\/329"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/comments?post=5"}],"version-history":[{"count":0,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/5\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media\/18172"}],"wp:attachment":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media?parent=5"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/categories?post=5"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/tags?post=5"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}