Strona internetowa jest budowana z semantycznych znaczników sekcji języka HTML5. Którym znacznikiem należy oznaczyć sekcję z menu nawigacyjnym strony?
A. aside
B. header
C. nav
D. div
Znacznik <nav> jest właściwym wyborem, ponieważ w HTML5 służy do oznaczania sekcji zawierającej główne lub istotne linki nawigacyjne. Chodzi na przykład o menu główne strony, menu w stopce, nawigację po działach serwisu albo zestaw odnośników prowadzących po podstronach dokumentacji. To nie jest tylko kwestia wyglądu, ale semantyki, czyli znaczenia elementu w strukturze dokumentu. Przeglądarki, czytniki ekranu i inne narzędzia wspomagające mogą dzięki temu rozpoznać, że dany fragment strony jest nawigacją. Moim zdaniem to jedna z tych drobnych rzeczy w HTML, które robią dużą różnicę w jakości kodu. Zamiast budować menu na zwykłym <div>, lepiej użyć <nav>, a w środku umieścić np. listę linków: ul, li oraz a. Jest to zgodne z dobrymi praktykami HTML5, poprawia dostępność, czytelność kodu i ułatwia późniejsze utrzymanie projektu. W praktyce frontendowej semantyczne znaczniki, takie jak header, nav, main, section, article czy footer, pomagają tworzyć stronę, która ma sens nie tylko wizualnie, ale też technicznie.
W tym pytaniu łatwo pomylić znaczniki, bo kilka z nich może wystąpić w pobliżu menu, ale tylko jeden opisuje samo menu nawigacyjne w sposób semantyczny. <div> jest znacznikiem ogólnego przeznaczenia i nie niesie konkretnej informacji o roli zawartości. Da się oczywiście zrobić menu w divie i ostylować je CSS-em, ale z punktu widzenia HTML5 nie jest to najlepsza praktyka, jeśli mamy dostępny znacznik bardziej precyzyjny. Taki kod działa, ale jest mniej czytelny dla człowieka i słabszy dla narzędzi analizujących strukturę strony. <aside> oznacza treść poboczną, uzupełniającą główny temat, na przykład panel z reklamą, linkami powiązanymi, biogramem autora albo dodatkowymi informacjami. Nie służy typowo do głównego menu strony, chociaż czasem w panelu bocznym może znaleźć się jakaś nawigacja pomocnicza. Sam fakt, że coś jest z boku ekranu, nie robi z tego aside w sensie semantycznym, i to jest częsty błąd myślowy. <header> natomiast oznacza nagłówek strony lub sekcji, czyli miejsce na logo, tytuł, wstępne informacje, czasem też może zawierać menu. Ale jeżeli pytanie dotyczy konkretnej sekcji z menu nawigacyjnym, to właściwym znacznikiem pozostaje <nav>. Warto zapamiętać: header może zawierać nav, ale header nie zastępuje nav. Semantyka HTML polega właśnie na dobraniu elementu według znaczenia treści, a nie według tego, gdzie coś leży albo jak wygląda po CSS-ie.