Nagłówki są jednym z podstawowych elementów tworzących strukturę stron internetowych. Pomagają w logiczny sposób zorganizować treść danej strony i ustalić związki pomiędzy jej poszczególnymi częściami. Dzięki nim możliwe jest łatwiejsze przeglądanie strony w celu szybkiego odnalezienia konkretnej informacji. Elementy nagłówkowe często służą osobom niewidomym do nawigacji, a zatem szczególnie ta kategoria użytkowników „traci” najwięcej przy nieprawidłowej strukturze nagłówków.
———————————————–
Sprawdź nasz artykuł o regulacjach prawnych stron internetowych dla osób niepełnosprawnych
https://stronawcag.pl/dostepnosc/regulacje-prawne-stron-internetowych-on/
———————————————-
Nagłówki są jednym z podstawowych elementów tworzących strukturę stron internetowych. Pomagają w logiczny sposób zorganizować treść danej strony i ustalić związki pomiędzy jej poszczególnymi częściami. Dzięki nim możliwe jest łatwiejsze przeglądanie strony w celu szybkiego odnalezienia konkretnej informacji. Elementy nagłówkowe często służą osobom niewidomym do nawigacji, a zatem szczególnie ta kategoria użytkowników „traci” najwięcej przy nieprawidłowej strukturze nagłówków.
Czym są nagłówki?
Nagłówki to podstawowy sposób porządkowania treści na stronie, odpowiednik spisu treści. W języku HMTL istnieje sześć stopni nagłówków: <h1>, <h2>, <h3>, <h4>, <h5> i <h6>. Najwyższy z nich <h1>, zazwyczaj opisuje tytuł głównego tekstu na stronie (określa zawartość strony), natomiast pozostałe, hierarchicznie niższe służą do oznaczania sekcji umieszczonego na stronie tekstu. Nagłówkami <h2> określa się główne sekcje np. menu główne, artykuły, wyszukiwarkę. Nagłówkami <h3> tytuły artykułów. Nagłówkami <h4>, <h5>, <h6> kolejne mniej istotne elementy. Zazwyczaj, na większości stron wystarczy użycie nagłówków trzech pierwszych poziomów.
Dlaczego nagłówki są ważne z punktu widzenia dostępności?
Każda strona serwisu powinna posiadać strukturę nagłówkową, która oddaje hierarchię informacji zawartych na tej stronie. Nagłówki są konieczne szczególnie dlatego, że ułatwiają nawigację osobom niewidomym i niedowidzącym. Brak nagłówka zmusza ich do wyobrażania sobie układu i całej zawartości strony, co znacznie wydłuża czas dotarcia do interesujących ich informacji.
Główne zasady związane z nagłówkami i ich działaniem na rzecz dostępności:
Hierarchia nagłówków
Nagłówki powinny być ustawione hierarchicznie – ważne, by nagłówek <h1> był używany do oznaczenia najważniejszego tytułu, a kolejne nagłówki — <h2>-<h6>, do oznaczenia odpowiednio mniej ważnych tytułów. Ułatwia to osobie niewidomej określić, które elementy na danej stronie są dla niej ważniejsze, a które mniej ważne.
Nagłówek poziomu pierwszego powinien określać temat strony
Każda strona serwisu powinna zawierać nagłówek <h1>, opisujący treść tej strony. W wyjątkowych sytuacjach, gdy jest to uzasadnione, można umieścić na stronie dwa nagłówki h1.
Elementy nagłówkowe tylko do oznaczania nagłówków
Elementy nagłówkowe powinny być stosowane tylko do oznaczenia nagłówków. Nie należy ich wykorzystywać do formatowania tekstu. Dla uzyskania wyróżnień wizualnych tekstu (typu pogrubienie, kursywa, wielkości czcionki itp.) najlepiej zastosować arkusze CSS.
Nie należy omijać poziomów nagłówków
Kolejne poziomy nagłówków muszą zawsze występować w logicznej kolejności i bez przeskoków między poziomami. Struktura zawsze zaczyna się od <h1>, potem <h2> itd. Błędem jest użycie nagłówka <h3> bez wcześniejszego zastosowania nagłówka <h2>.
Przykład poprawnej struktury: <h3><h4><h5><h3><h4><h5>
Przykład niepoprawnej struktury: <h3><h5><h4>
Nieprawidłowa hierarchia nagłówków może w sposób istotny zmienić znaczenie informacji przedstawionej na stronie z perspektywy osób niewidomych i niedowidzących.