Codewawa
Wszystkie kursy
HTML5 / Pierwsze kroki

Semantyka

Nowe znaczniki HTML5

HTML5 to najnowsza wersja języka HTML. Wprowadza ona wiele przydatnych tagów/znaczników, które przedstawię w tym samouczku.

Ale po co to komu?

Dzięki nowym znacznikom nie będziesz musiał non stop używać divów, bowiem zostały dodane tagi zastępujące divy służące do budowania strony. Są to tagi: header, section, article, nav, aside, footer, main. Został także dodany znacznik canvas, który umożliwia rysowanie prosto w dokumencie HTML, a wykorzystuje on elementy JavaScript.

To nagłówek dla naszej strony lub sekcji. Może zawierać znaczniki h1-h6. Nie ma ograniczeń co do ilości takich nagłówków.

<section>

Section to tak jakby konkurencja dla diva. Jednak od diva różni się tym, że w divie znajduje się najczęściej zwykła treść, a section to "pudełko" dla innych znaczników.

W tym znaczniku znajdować się będzie cała nawigacja naszej strony, czyli menu czy spis treści.

<aside>

W aside umieszczamy treść, która nie jest bezpośrednio związana z główną treścią strony, a jest dodatkiem, dygresją.

<main>

Main to odpowiednik div id=container. Główna treść strony, taka, jakiej chce użytkownik.

<article>

Article przypomina funkcjami znacznik main - w nim zamieszczana jest ważna treść na stronie. Jednak article zawiera treść, która powinna być odrębna. Przykłady możliwości użycia tego znaczniku to post na forum/blogu lub komentarz do tychże.

Footer to, jak nazwa wskazuje, stopka. Możemy tam umieścić dane kontaktowe, informacje o autorze czy dodatkowe linki. Można umieścić wiele footerów na jednej stronie.