Berbagi Itu Indah

Cara membuat navigasi di html

Navigasi HTML

Halo guys, kali ini saya akan membuat menu navigasi menggunakan  kode HTML beserta penjelasannya. Navigasi sangat penting untuk menghasilkan sebuah website yang responsive. Seseorang mudah tidak akan pergi dan akan tetap bertahan jika kamu membuatnya tampil menarik.

[tab]
[content title="HTML 1"]
Kode HTML  Navigasi Header

<header id="page_header"><h1>Menu</h1><nav>
<ul>
<li><a href="URL">Menu 1</a></li>
<li><a href="URL">Menu 2</a></li>
<li><a href="URL">Menu 3</a></li>
<li><a href="URL">Menu 4</a></li>
</ul>
</nav>
</header>
[/content][content title="HTML 2"]
Kode HTML Navigasi Footer

<footer id="page_footer">
<p>&copy; 2017 Pacetos.</p>
<nav>
<ul>
<li><a href="URL">Home</a></li>
<li><a href="URL">About</a></li>
<li><a href="URL">Terms of Service</a></li>
<li><a href="URL">Privacy</a></li>
</ul>
</nav>
</footer>
[/content]
[/tab]

  • Tag <header> digunakan untuk bagian halaman web yang merupakan header. Tag ini bisa muncul lebih dari 1 kali, tergantung kebutuhan. Bagian atas web dimana kita meletakkan logo dan judul situs adalah tempat terbaik untuk tag <header>.
  • Tag <h1> digunakan untuk membuat heading, selain tag <h1> ada juga <h2> <h3> <h4> dan <h5>.
  • Tag <nav> digunakan sebagai ‘container‘ dari menu navigasi. Sebaiknya digunakan untuk menu utama yang dirasa penting seperti pada bagian header.
  • Tag <ul> digunakan untuk membuat daftar dengan penanda simbol. Tag ini digunakan secara bersamaan dengan tag <li>
      • Type : Digunakan untuk mengubah simbol dari daftar.
      • Value : disc, square, atau circle. Value defaultnya adalah disc.Tag <li> digunakan untuk menambah daftar/isi dari tag <ul>.
  • URL : singkatan dari “Unifrom Resource Locator” yang diartikan sebagai rangkaian karakter menurut format standar tertentu, digunakan untuk menunjukan alamat dari suatu sumber. untuk URL ini di isi link/domain kamu.
  • Tag <Footer> biasannya digunakan pada bagian bawah halaman, dimana kita menampilkan beberapa informasi mengenai website. Walapun penggunaan paling jelas adalah untuk bagian footer halaman (meletakkan copyright, about us, dll), tag ini juga cocok digunakan pada bagian bawah artikel untuk menampung informasi tambahan seperti ‘tentang penulis‘ maupun link untuk share ke sosial media.
  • Tag <p> memiliki fungsi sebagai paragraf. Jadi jika terdapat text atau gambar berada dalam tag <p> dan </p> itu berarti berada dalam sebuah paragraf.
  • Kode &copy; digunakan untuk menampilkan simbol seperti ini [tooltip url="#" title="©"]Ini Adalah Simbol Copyright (Hak Cipta)[/tooltip]
[lock]TAG : cara membuat navigasi di html, membuat navigasi di html, membuat navigasi dengan html, membuat menu navigasi di html, membuat menu navigasi dengan html, kode navigasi html, membuat navigasi html, pengertian navigasi pada html, cara membuat navigasi pada html[/lock]
Terimakasih banyak sekali yang sudah membaca artikel ini ataupun yang hanya berkunjung saja dan semoga bermanfaat. Jangan lupa untuk berkomentar dan share ya guys :)
Demikian dari artikel yang saya buat sendiri ini, jika ada kesalahan kata-kata, ataupun kesalahan lainnya mohon dimaafkan yang sebesar-besarnya. karena setiap manusia tak luput dari kesalahan-kesalahan yang ia lakukan.

Pacetos

Posting Komentar

[blogger][disqus][facebook][spotim]

Joseph Edben

{facebook#https://www.facebook.com/joseph.edben.10} {twitter#https://twitter.com/josben911} {google-plus#https://plus.google.com/113021999851903249318} {youtube#https://www.youtube.com/channel/UCF3jg8BafPQX9dBxeAnbf5g} {instagram#https://www.instagram.com/mrjoseph27}

Formulir Kontak

Nama

Email *

Pesan *

Diberdayakan oleh Blogger.
Javascript DisablePlease Enable Javascript To See All Widget