Menu navigasi adalah sebuah link (url) yang digunakan untuk menghubungkan satu halaman website dengan halaman yang lainnya, cara membuat menu navigasi sangatlah mudah dan simple, Yaitu dengan menambahkan kode tag <a> pada HTML. Tag <a> ini memiliki atribut href yang berfungsi untuk mengarahkan kemana lokasi halaman yang dituju, apakah ke beranda atau ke artikel yang lainnya.
Bagaimana Cara Membuat Menu Navigasi Dengan HTML
Pertama, kamu harus punya 2 aplikasi yaitu text editor dan aplikasi browser. Untuk aplikasi edit text kamu dapat menggunakan notepad, notepad++, dream weaper dan sejenisnya. Dan untuk aplikasi browser kamu dapat menggunakan google chrome, opera mini, mozila firefox dan lain-lain.
Kedua, buka aplikasi text editornyadan ketikan markup html dibawah ini. Disini kita akan membuat 3 file, yaitu “menu1.html” (tanpa tanda petik), Terus “menu2.html”, Dan file “menu3.html” (tanpa tanda petik).
File yang pertama yaitu menu1.html (isi dengan markup dibawah ini):
<html> <head><title>ini file menu1.html</title></head> <body> <ul> <li><a href="menu1.html">MENU1</a></li> <li><a href="menu2.html">MENU2</a></li> <li><a href="menu3.html">MENU3</a></li> </ul> <br/> <h3>INI MERUPAKAN FILE KE 1</h3> <h6>ini adalah data cara membuat menu navigasi</h6> </body> </html>
Simpan dan buka dengan aplikasi browser yang kamu punya, hasilnya akan tampak seperti gambar berikut ini :
File yang kedua yaitu menu2.html (isi dengan markup dibawah ini):
<html> <head><title>ini file menu2.html</title></head> <body> <ul> <li><a href="menu1.html">MENU1</a></li> <li><a href="menu2.html">MENU2</a></li> <li><a href="menu3.html">MENU3</a></li> </ul> <br/> <h3>INI MERUPAKAN FILE KE 2 nyaaah</h3> <h6>ini adalah data cara membuat menu navigasi</h6> </body> </html>
Hasilnya akan tampak seperti gambar berikut ini :
File yang ketiga yaitu: menu3.html (isi dengan markup dibawah ini):
<html> <head><title>ini file menu3.html</title></head> <body> <ul> <li><a href="menu1.html">MENU1</a></li> <li><a href="menu2.html">MENU2</a></li> <li><a href="menu3.html">MENU3</a></li> </ul> <br/> <h3>INI MERUPAKAN FILE KE 3 braaaay</h3> <h6>ini adalah data cara membuat menu navigasi</h6> </body> </html>
Lihat hasilnya, akan tampak seperti gambar berikut :
Penjelasan:
Penggunaan kode tag <a href=”lokasi halaman”> akan membuat halaman yang satu terhubung dengan halaman yang lainnya. ada atribut lain dalam tag ini yaitu target. value _blank pada atribut target, akan membuat open in new tab, atau membuka halaman baru pada browser. penulisanya seperti gambar berikut :
<a href=”lokasi_link” target=”_blank”>
Pembahasan Artikel sebelumnya yaitu tentang :
Sekian artikel tentang cara bagaimana membuat menu navigasi dengan html, semoga bermanfaat, jangan ketinggalan update artikel terbaru dari pemrograman dengan terus membaca di website kodewebsite_com.