Nagłówki HTML

Nagłówki HTML – <h1> do <h6> 🏷️

Nagłówki porządkują treść strony i pomagają użytkownikom oraz wyszukiwarkom zrozumieć strukturę dokumentu.

• <h1> – najważniejszy nagłówek (tylko jeden na stronę!)
• <h2> – podrozdziały
• <h3> – sekcje w podrozdziałach
• <h4> – mniejsze sekcje
• <h5>, <h6> – rzadko używane, do bardzo drobnych podsekcji

Przykład:

Przykład

<h1>Tytuł strony</h1>
<h2>Podrozdział</h2>
<h3>Sekcja</h3>
<h4>Podsekcja</h4>

---

Hierarchia nagłówków

• Zawsze zaczynaj od <h1>
• Używaj kolejnych poziomów zgodnie z hierarchią treści
• Nie przeskakuj poziomów (np. z <h1> do <h4>)
• Nagłówki pomagają w nawigacji po stronie (np. czytniki ekranu)

Przykład hierarchii:

Przykład

<h1>Przepis na ciasto</h1>
  <h2>Składniki</h2>
  <h2>Wykonanie</h2>
    <h3>Krok 1</h3>
    <h3>Krok 2</h3>

---

Nagłówki a SEO i dostępność

• <h1> jest bardzo ważny dla wyszukiwarek (SEO)
• Dobrze opisane nagłówki pomagają osobom korzystającym z czytników ekranu
• Nagłówki dzielą stronę na logiczne sekcje – łatwiej się odnaleźć

---

Dobre praktyki

• Używaj tylko jednego <h1> na stronę
• Zachowuj kolejność nagłówków
• Nagłówki powinny być krótkie i opisywać zawartość sekcji
• Unikaj pustych nagłówków
• Używaj nagłówków do logicznego podziału treści, nie tylko dla większego tekstu

---

Praktyczne przykłady

Przykład

<h1>Moja strona</h1>
<h2>O mnie</h2>
<h3>Hobby</h3>
<h2>Kontakt</h2>

---

FAQ

Czy mogę mieć kilka <h1> na stronie? Nie, powinien być tylko jeden <h1>.

Czy muszę używać wszystkich poziomów nagłówków? Nie, używaj tylko tych, które są potrzebne.

Czy nagłówki muszą być po kolei? Tak, nie przeskakuj poziomów.

Czy mogę stylować nagłówki w CSS? Tak, możesz zmieniać kolor, rozmiar, marginesy itd.

---