Tagi nagłówków H1, h2, h3 na stronach internetowych: użyj do SEO, przykłady

1. Trochę teorii
2. Jak zoptymalizować nagłówki dla SEO
3. Logiczna sekwencja nagłówków
4. Audyt główny
5. Tagi nagłówka HTML5

Techniczna optymalizacja SEO stron wymaga użycia wielu tagów i metatagów: <title>, <meta name = "description">, <link rel = "canonical"> i innych. Właściwe zastosowanie tych tagów, ich atrybutów i zawartości zależy w dużej mierze od tego, czy wyszukiwarka poprawnie rozpozna twoją treść, jak wysoko zostanie uszeregowana, w jaki sposób fragment będzie wyglądał w wynikach wyszukiwania, jaka wersja strony zostanie pokazana użytkownikowi.

Znaczniki nagłówków są również ważnymi znacznikami do optymalizacji pod kątem wyszukiwarek. Dodatkowo, przemyślane nagłówki na stronie sprawiają, że jest to znacznie wygodniejsze dla użytkowników, a także zwrócenie ich uwagi na niezbędne informacje lub naciskanie na celowe działania. W tym artykule przyjrzymy się, jak używać nagłówków, aby „zadowolić” zarówno wyszukiwarkę, jak i użytkowników witryny lub strony docelowej.

Trochę teorii

W HTML jest 6 tagów nagłówka - od <h1> do <h6>. Liczba w znaczniku wskazuje względne znaczenie sekcji następującej po tytule: <h1> jest najbardziej znacząca, podczas gdy <h6> jest najmniej znacząca. Zgodnie z tym domyślnie HTML wyświetla nagłówki różnych poziomów z czcionkami o różnych rozmiarach: <h1> będzie największy, a każdy kolejny będzie nieco mniejszy.

Tagi nagłówka są elementami bloku: są zawsze umieszczane w nowej linii; także z nową linią umieszczane są następujące po nich elementy.

Jak zoptymalizować nagłówki dla SEO

Jednym z najsilniejszych sygnałów dla wyszukiwarek jest nagłówek pierwszego poziomu <h1>. Jest gorszy w stosunku do tagu <title>, jednak zawarte w nim słowa kluczowe mają również silny wpływ na ranking.

Na tej podstawie w agencji Arto Web Agency stosujemy to podejście do kompilacji nagłówków: używając słów kluczowych, umieszczamy najbardziej ważne i ważne klucze w <title>, następnym najważniejszym - w <h1>. Możesz użyć tych samych słów w tych dwóch znacznikach, jednak z punktu widzenia optymalizacji lepiej jest je zmienić: możesz użyć więcej słów kluczowych i ich synonimów.

Nagłówki niższych poziomów (<h2>, <h3> itd.) Są słabszymi sygnałami dla robota wyszukiwania. Mogą zawierać słowa kluczowe o niskiej częstotliwości i mniej ważne. Te klucze, które „nie pasują” w nagłówkach, powinny być używane bezpośrednio w tekście. Przykład TK dla copywriter z nagłówkami skompilowanymi na tej zasadzie, możesz zobaczyć poniżej.

Klaster zapytań, dla których musisz zoptymalizować artykuł. Druga kolumna pokazuje częstotliwość każdego żądania miesięcznie w systemie wyszukiwania Google Ukraine.

Przykład strony z ToR dla copywriter ze strukturą nagłówka artykułu opartą na zapytaniach wyszukiwania

Ważne jest, aby nie „ponownie spamować” nagłówków słowami kluczowymi: pożądane jest, aby w tym samym nagłówku każde słowo kluczowe występowało nie więcej niż raz; jeśli kontekst wymaga użycia go kilka razy, lepiej jest zawrzeć słowo w różnych formach wyrazów.

Wynika to z faktu, że znaczniki tytułu mają ważne znaczenie semantyczne, dlatego nie należy ich lekceważyć i układać jako zwykły tekst za pomocą stylów, jak czasami robią to webmasterzy. Z drugiej strony nie powinieneś używać tagów <h1> - <h6> jako elementów projektu, na przykład, wybierz semantycznie nieistotne elementy strony z tymi tagami: na przykład link do koszyka w sklepie internetowym lub wyrażenie „Nasz blog” w bocznym panelu katalogu produktów.

Upewnij się, że tytuł odnosi się do następującego po nim tekstu, a także jest czytelny i zrozumiały dla użytkowników. To pomoże uczynić treść bardziej wygodną i użyteczną, a tym samym „zdobyć zaufanie” wyszukiwarek. Czasami można zignorować niektóre słowa kluczowe na rzecz czytelności tytułu i przenieść je do tekstu strony.

Ważne jest także, jeśli to możliwe, aby napisy były przywiązane i intrygujące - użytkownik po przeczytaniu tytułu powinien chcieć przeczytać następujący po nim tekst. Dotyczy to artykułów informacyjnych; w przypadku stron komercyjnych nagłówek może również motywować użytkownika do podjęcia ukierunkowanej akcji lub zapoznania się z informacjami, które go do niego popchną.

Logiczna sekwencja nagłówków

Umieszczając nagłówki na stronie, powinieneś upewnić się, że znajdują się we właściwej kolejności hierarchicznej. Zgodnie ze standardami HTML4 nagłówek pierwszego poziomu na stronie powinien być tylko jeden (tę regułę można złamać w HTML5, jak omówiono poniżej). W tekście oznaczonym <h1> może znajdować się kilka sekcji, z których każda zaczyna się od tytułu <h2>; z kolei każdy z nich można podzielić na podsekcje nagłówkami <h3> i tak dalej. Jednak niektóre sekcje mogą nie mieć podsekcji. Na przykład poprawna struktura logiczna nagłówków będzie wyglądać następująco:

I tak - źle:

Nagłówki trzeciego poziomu są mniej popularne niż drugie: w przypadku małego artykułu do 5000 znaków zazwyczaj można użyć znaczników <h1> i <h2>. Nagłówki czwartego i niższego poziomu są rzadko używane. Mogą mieć sens w przypadku dużych tekstów i złożonych struktur - na przykład dokumentacji prawnej lub technicznej, ale takie dokumenty będą często wygodniejsze w przesyłaniu do witryny w formacie PDF, zamiast wybierania dla nich osobnej strony HTML.

Audyt główny

Aby szybko sprawdzić nagłówki w całej witrynie, możesz użyć Screaming Frog SEO Spider lub innej aplikacji do audytu SEO. Po sprawdzeniu będziesz mógł zobaczyć strony, na których brakuje nagłówków pierwszego poziomu lub zduplikowanych, zbyt długich nagłówków itp.

Aby sprawdzić strukturę nagłówków na jednej stronie, wygodnie jest użyć rozszerzenia przeglądarki HeadingsMap : pokazuje, które nagłówki poziomów są obecne na stronie, jaki tekst zawierają i automatycznie tworzy drzewo ich hierarchii.

Przykład wyświetlania struktury strony w HeadingsMap

Oprócz prawidłowej sekwencji znaczników <h1> - <h6> warto pamiętać, że rozmiar czcionki jest zgodny ze znaczeniem tytułu. Zgadzam się, jeśli strona ma na przykład trzy poziomy nagłówków, to jej struktura jest już dość złożona; jeśli nagle okaże się, że nagłówek trzeciego poziomu za pomocą stylów jest wyświetlany większą czcionką niż drugi poziom, użytkownik łatwo pomyli się w tekście.

Tagi nagłówka HTML5

Standard HTML5 wprowadził nowe elementy semantyczne: <section>, <article> i inne. Użycie tych elementów pozwala umieścić w każdej z nich własną hierarchię nagłówków; to znaczy, że strona może teraz mieć więcej niż jeden nagłówek <h1>. Może to być wygodne na przykład w przypadku kanału blogu, gdzie ogólnym nagłówkiem pierwszego poziomu strony będzie na przykład „Nasz blog”, a nagłówki poszczególnych sekcji to tytuły artykułów. Z drugiej strony możesz zachować ogólną strukturę nagłówków dla całej strony. Oznacza to, że obie opcje są dopuszczalne:

Również google argumentować Nie ma nic złego w używaniu wielu nagłówków <h1> na stronie: wyszukiwarka poprawnie rozpoznaje taki znacznik.

Podsumowując to, co zostało powiedziane, istnieje kilka głównych wskazówek.

• Zawsze używaj nagłówka pierwszego poziomu na stronie <h1> (jednej dla całej strony lub osobnej dla każdej sekcji). Użyj innych nagłówków, gdy naprawdę potrzebujesz ich do uporządkowania treści.
• Użyj słów kluczowych w nagłówkach. Im wyższy poziom tytułu, tym ważniejsze i częstsze słowa kluczowe powinny się w nim pojawić. Nie nadużywaj słów kluczowych, aby uniknąć „ponownej optymalizacji”.
• Śledź trafność nagłówków: powinni oni krótko przekazać, o czym jest tekst.
• Postępuj zgodnie z logiczną sekwencją tagów nagłówka.
• Nie używaj nagłówków jako elementów projektu.
• Postaraj się trzymać nagłówki gazet, aby przyciągnąć użytkowników.