ใน HTML5 ฉันรู้ว่า<nav>
สามารถใช้ได้ทั้งในและนอก<header>
องค์ประกอบโฆษณาเสากระโดงของหน้า สำหรับเว็บไซต์ที่มีทั้งลูกศรรองและหลักดูเหมือนธรรมดาที่จะรวมนำทางรองเป็น<nav>
องค์ประกอบภายในโฆษณาด้านบน<header>
องค์ประกอบกับการนำหลักเป็น<nav>
องค์ประกอบภายนอกโฆษณาด้านบน<header>
องค์ประกอบ อย่างไรก็ตามหากเว็บไซต์ไม่มีการนำทางรองดูเหมือนว่าจะรวมการนำทางหลักไว้ใน<nav>
องค์ประกอบภายใน<header>
องค์ประกอบโฆษณาด้านบน
ถ้าฉันทำตามตัวอย่างเหล่านี้โครงสร้างเนื้อหาของฉันจะขึ้นอยู่กับการรวมหรือแยกออกจากการนำทางรอง สิ่งนี้แนะนำการมีเพศสัมพันธ์ระหว่างเนื้อหาและสไตล์ที่รู้สึกไม่จำเป็นและไม่เป็นธรรมชาติ
มีวิธีที่ดีกว่าหรือไม่เพื่อฉันจะไม่ย้ายการนำทางหลักจากภายในสู่ภายนอก<header>
องค์ประกอบด้านบนที่อ้างอิงตามการรวมหรือแยกออกจากการนำทางรอง
ตัวอย่างการนำทางหลักและรอง
<header>
<nav>
<!-- Secondary Navigation inside <header> -->
<ul>
<li></li>
</ul>
</nav>
<h1>Website Title</h1>
</header>
<nav>
<!-- Main Navigation outside <header> -->
<ul>
<li></li>
</ul>
</nav>
OnlineDegrees.orgเป็นเว็บไซต์ตัวอย่างที่ตามรูปแบบด้านบน
ตัวอย่างการนำทางหลักเท่านั้น
<header>
<h1>Website Title</h1>
<nav>
<!-- Main Navigation inside <header> -->
<ul>
<li></li>
</ul>
</nav>
</header>
Keyzo.co.ukเป็นเว็บไซต์ตัวอย่างที่ตามรูปแบบด้านบน
ข้อความที่ตัดตอนมาจากการแนะนำ HTML5 - เพิ่มเมื่อ 02-Feb-11, 7:38 AM
การแนะนำ HTML5โดย Bruce Lawson และ Remy Sharp ได้กล่าวถึงเรื่องนี้:
ส่วนหัวยังสามารถมีการนำทาง สิ่งนี้มีประโยชน์มากสำหรับการนำทางทั่วทั้งไซต์โดยเฉพาะอย่างยิ่งในไซต์ที่ขับเคลื่อนด้วยเทมเพลตซึ่ง
<header>
องค์ประกอบทั้งหมดอาจมาจากไฟล์เทมเพลตแน่นอนว่ามันไม่จำเป็นว่าจะอยู่ใน
<nav>
<header>
หากขึ้นอยู่กับว่าคุณเชื่อว่าการนำทางทั่วทั้งไซต์นั้นอยู่ในส่วนหัวของเว็บไซต์หรือไม่และยังมีข้อควรพิจารณาในทางปฏิบัติเกี่ยวกับการออกแบบที่ใช้งานง่าย
จากประโยคสุดท้ายนั้นบรูซลอว์สันผู้เขียนบทที่ตัดตอนมานั้นยอมรับว่า "การพิจารณาอย่างจริงจังเกี่ยวกับความง่ายในการจัดแต่งทรงผม" ทำให้เกิดการเชื่อมโยงระหว่างเนื้อหาและสไตล์