Tekst nagłówka
Silktide sprawdza, czy każdy nagłówek na Twoich stronach zawiera czytelny tekst. Pusty nagłówek informuje o sekcji, której nie ma, i często ukrywa treść, która miała być tytułem.
W języku nagłówki (od <h1> do <h6>) określają strukturę strony. Puste nagłówki zwykle pojawiają się, gdy szablon renderuje nagłówek, którego treść nigdy nie została uzupełniona, albo gdy nagłówek zawiera tylko obraz bez .
<!-- Problem: nagłówek nie zawiera żadnej treści -->
<h2> </h2>
<!-- Problem: obraz nie ma tekstu alternatywnego, więc nagłówek jest niewidoczny dla czytnika -->
<h2><img src="press.png" alt=""></h2>
Dlaczego to ważne
Osoby korzystające z często przeglądają stronę, przechodząc od nagłówka do nagłówka. Pusty nagłówek jest odczytywany jako „nagłówek poziomu 2” bez żadnej treści po nim — to martwa pozycja w strukturze strony, która zakłóca rytm nawigacji i sprawia, że słuchacz zastanawia się, co ominął. Gdy nagłówek zawiera nieopisany obraz, widzący odwiedzający widzą tytuł, którego użytkownicy nigdy nie otrzymują.
Jak to naprawić
- Jeśli nagłówek powinien zawierać tekst, dodaj go w systemie CMS lub w kodzie.
- Jeśli nagłówek zawiera obraz pełniący funkcję tytułu, dodaj do obrazu tekst alternatywny:
<!-- Naprawiono: tekst alternatywny obrazu staje się tekstem nagłówka -->
<h2><img src="press.png" alt="Informacje prasowe"></h2>
- Jeśli nagłówek nie służy żadnemu celowi — na przykład jest pustym miejscem w szablonie lub jest używany wyłącznie do tworzenia odstępów — całkowicie usuń ten element. Do tworzenia odstępów używaj CSS, a nie pustych tagów.
Jak Silktide to testuje
- Znajduje każdy element nagłówka (od
<h1>do<h6>) na każdej stronie. - Zbiera tekst każdego nagłówka, w tym tekst alternatywny wszystkich obrazów w jego wnętrzu oraz tekst, który komponent internetowy umieszcza w nim za pomocą slotu.
- Zgłasza każdy nagłówek, którego treść nie zawiera liter ani cyfr — dlatego nagłówki zawierające tylko spacje lub znaki interpunkcyjne są uznawane za puste.