<nav> atau <menu> (HTML5)

102

W3Schools.com dan saya cukup yakin saya ingat melihat status W3C.org yang <menu>harus digunakan untuk menu Toolbar dan daftar perintah kontrol formulir.

Jadi, mana yang harus saya gunakan untuk menu utama saya? Nav, atau Menu? Apakah itu penting?

— Slipp D. Thompson
sumber

38

Anda mungkin ingin membaca w3fools .

— zzzzBov

Apa itu 'perintah kontrol bentuk'?

— Mads Skjern

162

navdigunakan untuk grup tautan internal ( aelemen). Biasanya ini berarti link harus berpindah ke halaman terpisah, atau mengubah konten dalam kasus halaman AJAX. Harapkan semacam perubahan konten saat mengklik navitem.

menudigunakan untuk kelompok kontrol ( a, input, button). Biasanya ini berarti input harus menjalankan fungsi di dalam halaman. Harapkan semacam interaksi javascript saat mengklik menuitem.

nav: navigasi untuk situs.

menu: menu untuk aplikasi web.

— zzzzBov
sumber

8

Fakta menarik: Spesifikasi memungkinkan untuk menyarangkan <li>elemen langsung di bawah <menu>tag, tanpa memerlukan <ul>daftar. Persyaratannya adalah atribut <menu>'s typedihilangkan atau disetel ke "toolbar". Lihat spesifikasi untuk para <li>elemen dan para <menu>elemen .

— tomekwi

Dapatkah seseorang mengarahkan saya ke <menu>salah satu spesifikasi W3C HTML5? Saya menemukannya di versi WHAT WG , tetapi tidak di draf W3C HTML 5.3 terbaru .

— Garret Wilson

10

Berikut adalah posting HTML5Doctornav dengan bagian tentang perbedaannya menu(pada dasarnya, gunakan di aplikasi sebenarnya). Sepertinya Anda mau nav.

— Su '
sumber

1

Dengan <menu>itu biasanya digunakan untuk menu konteks.

MDN memiliki dokumentasi yang bagus tentangnya: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/menu

— Mendongkrak
sumber

1

Tempat terbaik untuk mendapatkan jawaban ini adalah standar HTML 5 itu sendiri.

Menu didefinisikan dalam HTML 5.1 Edisi ke-2 .

Itu, "... mewakili sekelompok perintah."

Nav didefinisikan dalam HTML 5 .

Yaitu, "... bagian dari halaman yang memiliki pranala ke halaman lain atau ke bagian dalam halaman: bagian dengan link navigasi."

Ada catatan untuk nav yang tidak saya sertakan tetapi menurut saya penting, tetapi menurut saya sebaiknya Anda mendapatkan definisinya sendiri dari standar.

Definisi yang ditandai dalam posting ini sebagai jawaban hampir benar tetapi memiliki pernyataan asing di dalamnya yang membuat jawaban itu sendiri salah.

— kevin
sumber

0

<nav>adalah bagian (seperti <section>atau <article>) sehingga akan muncul dalam kerangka dokumen HTML Anda. Karena ini, saya akan menggunakan <menu>99% waktu. Bagi saya, <nav>adalah perpaduan antara <section>dan <menu>, dengan tambahan penyempitan yang <nav>harus digunakan khusus untuk navigasi, sedangkan <menu>bisa untuk apa saja yang disebut menu (termasuk bilah navigasi). Jadi sebagian besar bilah navigasi, terlepas dari kenyataan bahwa itu adalah bilah navigasi, tidak sesuai dengan persyaratan ketat <nav>, dan <menu>lebih sesuai.

Saya tidak pernah dalam karir pengembangan web saya menemukan situasi di mana saya ingin bilah navigasi saya menjadi bagian dari garis besar dokumen.

— Nick Manning
sumber

1

Ini salah Anda sebaiknya jarang (jika pernah) menggunakan <menu>di situs web yang bukan aplikasi web - 99% dari waktu, 'menu' navigasi Anda akan berupa tautan statis ke halaman lain atau bagian lain pada halaman, untuk apa <nav>, menurut sesuai spesifikasi.

— Ivan Durst

@IvanDurst, maksud saya adalah jika Anda hanya membuat daftar tautan statis, navbukanlah pilihan tag yang baik karena navmerupakan elemen bagian sehingga akan menjadi bagian dari garis besar dokumen seolah-olah itu adalah bagian dengan tajuk dan konten. Ini sebenarnya adalah skenario langka di mana Anda ingin Anda navbertindak seperti bagian. menuhanyalah saran sebagai pengganti semantik. Saya tidak melihat apa pun di spesifikasi yang mengatakan bahwa itu tidak dapat digunakan dengan cara ini. Sepertinya cocok. Tetapi jika Anda karena alasan tertentu percaya bahwa menu hanya untuk apa yang Anda definisikan sebagai aplikasi web, maka saya merekomendasikan olatau ulsebagai penggantinya.

— Nick Manning

Menurut tabel kompatibilitas di sini , <menu>masih memiliki dukungan yang buruk saat ini. (Apakah benar bahwa Chrome tidak mendukungnya ??) Selain itu, Anda dapat mencapai semantik yang sama persis dengan memberikan role="menu"atribut ke elemen lain (misalnya div atau nav). Atribut peran menggantikan semantik default untuk elemen apa pun.

— brennanyoung