Trafiłem dzisiaj na filmik Święte Wojny JavaScriptu – ile 'h1′ na stronie i dlaczego Kuba przespał ostatnie 10 lat?, poświęcony nagłówkowi h1.
Punktem wyjściowym dla dyskusji było pytanie o to, ile nagłówków h1 można stosować na stronie. Głównym argumentem, zarówno po jednej, jak i drugiej strony, było pozycjonowanie strony w wyszukiwarkach. Jak już jednak wielokrotnie wspominałem, to, iż nagłówki służą do pozycjonowania, jest jedynie skutkiem ubocznym. Nagłówki służą do tworzenia struktury strony – co, na szczczęście, również zostało wspomniane w dyskusji.
Jednak samo stwierdzenie, iż nagłówki służą do tworzenia struktury strony, jest niewystarczające. Należałoby zapytać, jaki jest tego skutek. Najważniejszym powodem, dla którego należy wykorzystywać poprawnie nagłówki, jest dostępność. jeżeli spojrzymy na wyniki najnowszej ankiety wśród użytkowników czytników ekranowych, zauważymy, iż ponad 67% z nich używa nagłówków do nawigacji po stronie. Dodatkowo aż ponad 85% uważa, iż poziomy nagłówków są pomocne, z czego ponad 52%, iż są bardzo pomocne. Dodatkowo jedna z wcześniejszych ankiet wśród użytkowników czytników ekranowych, przeprowadzona w 2017 roku, zawierała pytanie na temat struktury nagłówków na stronie. Aż 60% osób wskazało, iż najłatwiejsza w nawigacji jest struktura, w której nagłówek h1 zawiera tytuł danej podstrony. Inna ankieta, przeprowadzona wśród małej grupy (35 osób) użytkowników czytników ekranowych, potwierdza te wyniki.
Większość debat dotyczących stosowania więcej niż jednego elementu h1 ma swoje źródło w tzw. algorytmie outline’u, który zakładał, iż dla każdej sekcji na stronie nagłówki będą liczone oddzielnie. Problem polega na tym, iż ten algorytm nigdy nie został zaimplementowany w przeglądarkach. Tym samym stosowanie więcej niż jednego nagłówka h1 na stronie prowadzi do stworzenia płaskiej struktury treści. A taka jest trudniejsza w nawigacji, nie tylko dla użytkowników czytników ekranowych. Przy porównywaniu struktury nagłówków na stronie do spisu treści w książce warto pamiętać o jednym: strona internetowa nie jest odpowiednikiem strony w książce. Każda strona jest raczej odpowiednikiem całego rozdziału. Tak, jak rozdział, ma jeden główny tytuł (nagłówek h1) oraz liczne podrozdziały, podsekcje, itp. (nagłówki h2–h6. Przy takim spojrzeniu o wiele łatwiej dzielić treść przy pomocy nagłówków oraz zauważyć, iż faktycznie jedno h1 ma sporo sensu.
W trakcie dyskusji pada też twierdzenie, iż dokumentacje W3C zwykle zawierają przykłady z jednym h1 i nie są aktualizowane od 10 lat. To twierdzenie jest błędne na kilku poziomach. Po pierwsze, nie istnieje oficjalna dokumentacja HTML-a od W3C, bo W3C nie rozwija już HTML-a. Teraz zajmuje się tym WHATWG. I oficjalna specyfikacja zawiera sporo przykładów, w których jest kilka elementów h1. Takie można znaleźć np. w podrozdziale poświęconym elementowi section. Sama specyfikacja jest z kolei aktualizowana praktycznie codziennie (kiedy piszę te słowa 15 grudnia, specyfikacja była zaktualizowana wczoraj, 14 grudnia 2021 roku).
Istnieje jednak problem ze specyfikacją i nagłówkami: eksperci dostępności od lat powtarzają, iż specyfikacja niepoprawnie opisuje nagłówki, ponieważ zakłada istnienie algorytmu outline’u. A, jak wspominałem wyżej, on w rzeczywistości nie istnieje. Na szczęście MDN (czyli zasób, do którego trafi zdecydowanie więcej osób niż do specyfikacji) zawiera informację, dlaczego należy stosować tylko jeden nagłówek h1.
Nie mogę się zgodzić także ze stwierdzeniem, iż nagłówki powstały w czasach, gdy HTML nie był semantyczny. HTML zawsze był semantyczny, bo semantyka to znaczenie elementów. A każdy element w HTML coś znaczy i zawsze poszczególne elementy miały jakąś przypisaną sobie rolę.
Smuci mnie, iż pewne tematy w webdevie (nie tylko polskim) wałkowane są na nowo i nowo. I za każdym razem dyskusja zaczyna się od zera. A przecież problem z nagłówkami nie pojawił się wczoraj, istnieje od niemal samego momentu powstania HTML5. Przez to, iż mamy do czynienia z tak długo istniejącym problemem, powstało naprawdę sporo materiałów go opisujących oraz mamy odpowiednie dane, by go zanalizować. Skoro takie materiały są dostępne, to wypada zadać sobie pytanie, czemu tego typu dyskusje nie są oparte na źródłach, a prawie zawsze wyłącznie na opiniach osób biorących w nich udział?
