<h2> to znacznik nagłówka, który zgodnie ze specyfikacją HTML5 stosuje się właśnie w sekcji <body>. Nagłówki od <h1> do <h6> służą do strukturyzowania treści dokumentu, czyli tego, co realnie widzi użytkownik na stronie. W <body> umieszczamy całą zawartość prezentowaną w przeglądarce: teksty, nagłówki, obrazy, formularze, przyciski, listy itd. Moim zdaniem dobrze jest zapamiętać prostą zasadę: wszystko, co jest „treścią strony” dla użytkownika, ląduje w <body>, a wszystko, co jest „informacją o stronie” dla przeglądarki i wyszukiwarki – w <head>. Znacznik <h2> jest semantycznym nagłówkiem drugiego poziomu. Oznacza to, że powinien być używany jako podtytuł lub tytuł sekcji podrzędnej względem <h1>. Przykładowo: <h1>Temat strony</h1>, a niżej <h2>Podrozdział 1</h2>, <h2>Podrozdział 2</h2> itd. Taka struktura pomaga nie tylko użytkownikom, ale też czytnikom ekranowym, SEO i ogólnej czytelności kodu. Dobre praktyki mówią, żeby nie używać nagłówków tylko do „zwiększania czcionki”, ale właśnie do logicznego podziału treści. Do zmiany wyglądu służy CSS. W typowym dokumencie HTML mamy: <html>, w nim <head> z metadanymi i <body> z widoczną zawartością. <h2> musi znajdować się właśnie w <body>, bo jest elementem treści, a nie metadanych. Gdy zaczniesz pisać większe strony, poprawne wykorzystanie nagłówków bardzo ułatwia nawigację, generowanie spisów treści, a także utrzymanie projektu w ryzach, co w praktyce jest naprawdę ważne przy pracy zespołowej czy w dużych serwisach.
W tym pytaniu często myli się dwa podstawowe obszary dokumentu HTML: sekcję <head> oraz sekcję <body>. To jest taki klasyczny błąd początkujących – wszystko wygląda jak „znaczniki HTML”, więc kusi, żeby wrzucać je wszystkie do jednego worka, a jednak każdy ma swoje konkretne miejsce i przeznaczenie. Sekcja <body> służy do umieszczania treści widocznej dla użytkownika: nagłówków, akapitów, obrazów, list, przycisków, formularzy. Natomiast <head> zawiera metadane, konfigurację i informacje pomocnicze dla przeglądarki, wyszukiwarek i innych narzędzi. Znacznik <link> jest elementem typowym dla sekcji <head>. Służy między innymi do podłączania arkuszy stylów CSS (np. <link rel="stylesheet" href="style.css">), ikon strony (favicon) czy innych zasobów powiązanych z dokumentem. Umieszczanie <link> w <body> jest sprzeczne z dobrą praktyką i specyfikacją – przeglądarka zwykle to „przełknie”, ale jest to zły nawyk i może powodować problemy z wydajnością i walidacją kodu. Podobnie <title> to znacznik, który definiuje tytuł strony wyświetlany na karcie przeglądarki oraz używany przez wyszukiwarki. On musi się znajdować w <head>. Nie jest elementem treści, którą widzi użytkownik w samym obszarze strony, tylko opisem dokumentu. Wstawienie <title> do <body> łamie strukturę dokumentu, a część narzędzi i walidatorów wskaże to jako błąd. Znacznik <meta> również należy wyłącznie do sekcji <head>. Służy do przekazywania metadanych, na przykład informacji o kodowaniu znaków (<meta charset="UTF-8">), opisu strony, słów kluczowych, ustawień dla robotów wyszukiwarek czy danych dla mediów społecznościowych (Open Graph). To są dane konfiguracyjne, a nie zawartość strony. Typowym błędnym myśleniem jest traktowanie wszystkich tych znaczników jako „zwykłych elementów HTML, które można dać gdziekolwiek”. W nowoczesnym podejściu kładzie się duży nacisk na semantykę: każdy element ma swoje logiczne miejsce. Dzięki temu kod jest czytelny, zgodny ze standardami W3C, lepiej interpretowany przez wyszukiwarki i narzędzia wspomagające. Dlatego w sekcji <body> powinniśmy umieszczać takie znaczniki jak <h1>–<h6>, <p>, <div>, <section>, <article>, <nav> i inne elementy treści, natomiast <link>, <title> i <meta> pozostają w <head>, bo pełnią zupełnie inną rolę niż widoczna zawartość strony.