Trong HTML5, tôi biết rằng <nav>
có thể được sử dụng cả bên trong hoặc bên ngoài <header>
phần tử tiêu đề của trang . Đối với các trang web có cả điều hướng phụ và điều hướng chính, có vẻ như thường bao gồm điều hướng phụ là một thành <nav>
phần bên trong <header>
phần tử tiêu đề với điều hướng chính là <nav>
phần tử bên ngoài <header>
phần tử tiêu đề . Tuy nhiên, nếu trang web thiếu điều hướng phụ, có vẻ như bao gồm điều hướng chính trong một <nav>
phần tử trong <header>
phần tử tiêu đề .
Nếu tôi làm theo các ví dụ này, cấu trúc nội dung của tôi sẽ dựa trên việc bao gồm hoặc loại trừ điều hướng phụ. Điều này giới thiệu một sự kết hợp giữa nội dung và phong cách cảm thấy không cần thiết và không tự nhiên.
Có cách nào tốt hơn để tôi không di chuyển điều hướng chính từ trong ra ngoài <header>
yếu tố tiêu đề dựa trên sự bao gồm hoặc loại trừ điều hướng phụ?
Ví dụ điều hướng chính và phụ
<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 là một trang web mẫu theo mô hình trên.
Ví dụ điều hướng chính
<header>
<h1>Website Title</h1>
<nav>
<!-- Main Navigation inside <header> -->
<ul>
<li></li>
</ul>
</nav>
</header>
Keyzo.co.uk là một trang web mẫu theo mô hình trên.
Trích đoạn giới thiệu HTML5 - Được thêm vào ngày 02-ngày 11 tháng 2, 7:38 sáng
Giới thiệu HTML5 của Bruce Lawson và Remy Sharp có điều này để nói về chủ đề này:
Tiêu đề cũng có thể chứa điều hướng. Điều này có thể rất hữu ích cho điều hướng trên toàn trang web, đặc biệt là trên các trang web hướng mẫu trong đó toàn bộ
<header>
phần tử có thể đến từ một tệp mẫu.Tất nhiên, không bắt buộc phải
<nav>
có trong<header>
.Nếu phụ thuộc phần lớn vào việc bạn có tin rằng điều hướng trên toàn trang thuộc về tiêu đề trên toàn trang và cũng là những cân nhắc thực tế về việc dễ dàng tạo kiểu.
Dựa trên câu cuối cùng đó, có vẻ như Bruce Lawson, tác giả của chương, những đoạn trích đó là từ hồi thừa nhận rằng "những cân nhắc thực dụng về sự dễ dàng trong phong cách" mang lại sự kết hợp giữa nội dung và phong cách.