Znacznikiem, którego nie należy umieszczać w nagłówku (<head>) dokumentu HTML, jest znacznik nagłówka treści taki jak <h1>, <h2>, <h3>, <h4>, <h5> czy <h6>. Te znaczniki służą do organizacji i strukturyzacji treści widocznej na stronie, a nie do opisu samego dokumentu czy przekazywania przeglądarce informacji o stronie.
Różnica między <head> a <body>
- Sekcja
<head>– zawiera metadane, które nie są wyświetlane użytkownikowi jako treść strony, lecz służą przeglądarce oraz wyszukiwarkom (np. tytuł strony, deklaracja kodowania, opisy meta, linki do arkuszy CSS); - Sekcja
<body>– zawiera całą właściwą treść strony, która będzie widoczna dla użytkownika, czyli teksty, obrazy, listy, paragrafy, nagłówki i inne elementy.
Dlaczego nagłówki <h1>–<h6> nie mogą być w <head>
Znaczniki <h1>–<h6> są przeznaczone do tytułów i podtytułów wyświetlanych w treści strony. Ich zadaniem jest tworzenie logicznej struktury dokumentu, pomagającej użytkownikom i wyszukiwarkom zrozumieć hierarchię i tematykę poszczególnych sekcji. Umieszczanie ich w <head> jest błędem, ponieważ tam nie są interpretowane ani wyświetlane poprawnie.
Przykład nieprawidłowego użycia
<html>
<head>
<h1>Tytuł strony</h1> <!-- BŁĄD! -->
<meta charset="utf-8">
<title>Tytuł w przeglądarce</title>
</head>
<body>
<!-- właściwa treść strony -->
</body>
</html>
Wynik – przeglądarka najprawdopodobniej zignoruje taki nagłówek lub będzie on powodem błędu walidacji HTML, a niektóre narzędzia mogą ostrzegać o nieprawidłowej strukturze dokumentu.
Jak prawidłowo stosować znaczniki nagłówków?
Znaczniki <h1>–<h6> należy umieszczać wyłącznie w sekcji <body> –
<html>
<head>
<meta charset="utf-8">
<title>Tytuł w przeglądarce</title>
</head>
<body>
<h1>Tytuł główny strony</h1>
<h2>Podtytuł sekcji</h2>
<p>Treść sekcji...</p>
</body>
</html>
Co można a czego nie można umieszczać w <head>
Typowe znaczniki dla <head> –
<title>– tytuł wyświetlany na karcie przeglądarki,<meta>– metadane (opis, autor, słowa kluczowe, kodowanie),<link>– odnośniki do plików zewnętrznych (np. CSS),<style>– osadzone style CSS,<script>– skrypty JavaScript (choć zwykle lepiej umieszczać je na końcu<body>).
Nie należy umieszczać w <head> –
- znaczników struktury strony widocznych dla użytkownika:
<h1>,<p>,<div>,<img>,<ul>,<section>, itp.
Znaczenie poprawnego rozmieszczenia znaczników
Poprawna struktura dokumentu HTML zapewnia:
- Lepszą czytelność kodu i łatwiejszą konserwację;
- Poprawne działanie w przeglądarkach oraz narzędziach wspierających dostępność (np. czytniki ekranu);
- Lepszą optymalizację SEO, gdyż wyszukiwarki rozpoznają hierarchię i tematykę treści.
Podsumowanie
Znaczniki nagłówków (<h1>–<h6>) służą wyłącznie do organizacji treści strony i należy je umieszczać wyłącznie w sekcji <body>. Umieszczenie ich w sekcji <head> jest niezgodne ze standardem HTML i może prowadzić do nieprawidłowego działania strony.
