Tagi nagłówków: prosty (ale kompletny) przewodnik po tagach nagłówków HTML H1, H2 i H3 dla SEO
Opublikowany: 2020-08-25
To jest kompletny przewodnik po tagach nagłówka w 2021 roku.
W tym nowym przewodniku dowiesz się dokładnie, jak używać tagów od H1 do H6 do zwiększania pozycji w wyszukiwarkach, nawet jeśli nie znasz tagów nagłówka SEO lub dałeś się nabrać (Google) na myślenie, że tagi nagłówków nie Praca.
Za chwilę nauczysz się wszystkiego, co kiedykolwiek musisz wiedzieć o elementach nagłówków HTML, od tego, czym są (w prostych słowach) po zaawansowane strategie nagłówkowe, o których udowodniono, że zwiększają zasięg i zaangażowanie Twoich treści.
Oto krótki przegląd tego, co zostało omówione:
- Czym są tagi nagłówków i jak ich używać
- Różnica między tagami H1, H2 i H3 i kiedy należy używać każdego typu
- Pięć powodów, dla których tagi nagłówków są teraz niezbędne
- Anatomia doskonale zorganizowanej hierarchii tagów nagłówka
- Jak tworzyć tagi od H1 do H6, które zapewniają wyższą pozycję w rankingu (i sprzedaż)
- Dużo więcej
Zacznijmy.
POBIERZ: Bezpłatna lista kontrolna, która pokaże Ci dokładnie, jak wdrożyć wskazówki dotyczące optymalizacji tagów nagłówka zawarte w tym poście.
Czym są tagi nagłówków? Definicja bez żargonu
W prostych słowach:
Tagi nagłówków to elementy HTML używane do definiowania nagłówków strony.
Odróżniają nagłówek <h1> i podtytuły od <h2> do <h6> od reszty treści.
Liczba od 1 do 6 określa znaczenie i pozycję nagłówka w ogólnej hierarchii struktury nagłówka.
Podobnie jak w przypadku większości terminów SEO, istnieje wiele synonimów, które są używane zamiennie do opisu nagłówków:
Tagi nagłówka, nagłówki HTML i tagi H to kilka innych sposobów na opisanie tego samego.
Więc jeśli słyszałeś już te terminy SEO, teraz wiesz, co one oznaczają.
Wszystkie są tylko tagami nagłówków o różnych nazwach.
Z drugiej strony „ nagłówek HTML ” to sekcja kodu między elementem <header> na stronie internetowej.
Jest to kontener na treści wprowadzające, takie jak nawigacja, logo, informacje o autorze i szczegóły nagłówków.
Innymi słowy, jest to kontener, który może zawierać Twoje tagi nagłówków (między innymi).
NIE należy również mylić tagów nagłówków z elementem < head > kodu HTML.
< head > to kontener na metadane (dane o danych) i jest umieszczany pomiędzy tagiem < html > a tagiem <body> na Twojej stronie internetowej. Jego zawartość nie jest renderowana na stronie, ale ma kluczowe znaczenie dla SEO.
Jest to miejsce w kodzie, w którym znajduje się tytuł strony, opis meta i skrypty, takie jak Google Analytics.
Nadal ze mną?
Świetnie, kontynuujmy.
Co to jest znacznik H1?
Załóżmy, że nic nie wiesz o H1.
Podzielę się z tobą naprawdę prostą definicją:
H1 to tag HTML, który wskazuje główny nagłówek na stronie internetowej.
Rozpakujmy to.
- Jest to element HTML, co oznacza, że tag H1 znajduje się w kodzie Twojej witryny.
- Przyzwyczaja się do oznaczania głównego nagłówka, zazwyczaj pierwszego widocznego nagłówka na stronie.
Aby wyróżnić tekst, tag H1 jest zwykle wyświetlany w większym i bardziej widocznym miejscu niż reszta tekstu na Twojej stronie lub poście.
Najłatwiejszym sposobem na zrozumienie, w jaki sposób można użyć tagu Nagłówek 1, jest wyobrażenie sobie, że piszesz zarys dokumentu.
Głównym tytułem twojego dokumentu powinien być Twój <h1>.
Powinien reprezentować ogólny temat dokumentu i być wyświetlany na początku dużą czcionką.
Przykład tagu H1:
Korzystając z powyższego przykładu z Smart Passive Income, tag H1 ma wartość „Naucz się etycznego marketingu afiliacyjnego”.
Podczas przeglądania w HTML tag H1 wygląda następująco:
<h1>Learn Ethical Affiliate Marketing</h1>Oczywiście strony Twojej witryny mogą wymagać więcej niż jednego nagłówka.
Tutaj wkraczają inne tagi nagłówków.
Co to jest znacznik H2?
Mając na uwadze, że tag H1 jest używany w głównym nagłówku dokumentu ;
Twoje główne punkty są zawarte w podtytułach znanych jako H2.
Innymi słowy:
Tag <h2> definiuje nagłówki drugiego poziomu na Twojej stronie internetowej.
Ale tagi nagłówków nie kończą się na h2.
Punkty podrzędne poniżej tagów <h2> używają tagów nagłówków <h3>:
A punkty podrzędne poniżej tagów <h3> używają tagów nagłówków <h4>.
Ta sekwencja może być kontynuowana aż do znaczników <h6>, które są najmniej ważne w hierarchii znaczników nagłówka.
Jednakże:
Rzadko zdarza się, że napiszesz treść wystarczająco głęboką, by potrzebować tagów H4, H5 i H6.
(Chyba że treść jest bardzo długa i techniczna).
Podobnie jak ten dotyczący SEO obrazu, większość moich postów na blogu ma ponad 5000 słów.
Mimo to moje podtytuły składają się tylko z H2 i H3:
Podsumujmy więc tagi H2:
Tagi podtytułów H2 są używane do dzielenia treści i uczynienia jej możliwymi do zeskanowania i łatwymi do odczytania.
H2 są używane do podkreślenia ważnych informacji i nagłówka podsekcji na Twojej stronie.
W razie potrzeby możesz użyć tagów H3 jako nagłówków dla podpunktów poniżej Twoich H2.
Korzystając z powyższego przykładu, tak wygląda tag H2 w kodzie HTML:
<h2>How To Claim Your Business On Google</h2>Rozumiem? Dobry.
Następnie zagłębimy się w tagi nagłówków i sposób ich kodowania w HTML.
Tagi nagłówków w HTML: i znaczenie H1
Znaczniki nagłówka, aw szczególności znacznik H1, pełnią istotną funkcję w strukturze HTML.
Pozwól mi wyjaśnić:
Plik HTML można zdefiniować jako kombinację węzłów, przy czym tag nagłówka jest punktem początkowym, z którego rozgałęziają się inne węzły.
Plik HTML powinien zatem (teoretycznie) mieć tylko jeden nagłówek H1.
Czemu? Ponieważ znacznik H1 jest korzeniem, od którego zaczynają się wszystkie inne węzły.
W przeciwieństwie do tego, nagłówki niższe w kolejności (od H2 do H6) mogą być używane tak często, jak jest to pożądane.
Powinni jednak zachować logiczną hierarchię – o tym później.
Z punktu widzenia kodu, tagi nagłówka służą wyłącznie do wyświetlania tekstu.
W związku z tym formatowanie nagłówków powinno być określone w plikach CSS, aby oddzielić format od treści.
Przykłady tagów nagłówków i sposób ich kodowania w HTML
To, co sprawia, że tag nagłówka jest nagłówkiem w kodzie witryny, to dwa proste tagi HTML:
Otwierający <h> i zamykający </h> tag.
Wewnątrz tych dwóch tagów znajduje się tekst nagłówka, który chcesz wyświetlić:
Linie kodu dla nagłówka z dwoma podtytułami wyglądają tak:
<h1>This is a heading</h2> <h2>This is a sub-heading</h2> <h3>This is a third sub-heading</h3>Oczywiście kod Twojej witryny nie będzie wyświetlał tylko nagłówków.
Będzie zawierać kopię treści i inne elementy.
Oto jak wygląda kod HTML z serią nagłówków ORAZ dołączoną kopią treści:
<h1>This is a heading</h1> <h2>Summary</h2> <p>Some text here...</p> <h2>Examples</h2> <h3>Example 1</h3> <p>Some text here...</p> <h3>Example 2</h3> <p>Some text here...</p> <h2>See also</h2> <p>Some text here...</p>Nie ma nic więcej w elementach kodu niż to.
Tylko pamiętaj:
Każdy tag nagłówka zaczyna się otwierającym tagiem <h> i musi być zamykany końcowym tagiem </h> .
Hierarchia znaczników (1-6) jest określana bezpośrednio po „h” i powinna być zdefiniowana zarówno w znacznikach otwierających, jak i zamykających.
Twoja treść tekstowa jest zapisana między dwoma elementami znaczników.
Z tym wszystkim, co powiedziałem:
O ile nie tworzysz niestandardowego kodu strony internetowej (NIE jest to coś, co generalnie polecam), kod HTML Twoich tagów nagłówka będzie obsługiwany przez Twój system zarządzania treścią.
Jak dodać tagi H1 do H6 w WordPress
WordPress to najpopularniejszy system zarządzania treścią w sieci.
Według WordCamp, obecnie istnieje ponad 75 milionów witryn korzystających z WordPressa .
To około 30% wszystkich witryn w sieci WWW.
To, co sprawia, że WordPress jest tak popularny, to jego przyjazność dla wyszukiwarek i łatwość użytkowania.
Dodanie funkcji SEO, takich jak niestandardowe tytuły stron i permalinki, hiperłącza i zoptymalizowane obrazy, jest bardzo proste w WordPress.
Podobnie jest z dodawaniem tagów nagłówków do strony lub posta.
Istnieją dwa główne sposoby dodawania tagów nagłówków w WordPress; Pokażę wam oboje:
(a). Dodawanie tagów H1 do WordPressa za pomocą edytora
Najprostszym sposobem dodawania nagłówków jest użycie edytora. Jeśli używasz już edytora bloków Gutenberga, kliknij przycisk „+” i wybierz „Nagłówek”;
Stamtąd możesz wybrać nagłówek, który chcesz dodać.
Jeśli nadal używasz klasycznego edytora, to też jest proste.
Upewnij się tylko, że jesteś na karcie wizualnej edytora i przejdź do menu rozwijanego stylu tekstu.
Następnie po prostu wybierz „Nagłówek 1” lub „Nagłówek 2” … lub dowolny inny nagłówek z menu rozwijanego.
Spokojnie, co?
Następną opcją dodawania tagów H1 do H6 w WordPressie jest użycie HTML.
(b). Dodawanie tagów H1 do WordPressa za pomocą edytora
Jeśli masz ochotę, możesz również dodawać nagłówki w WordPressie za pomocą HTML.
Jestem pewien, że śledzisz, więc znasz już kod HTML dla <h1>, <h2>, <h3> itd.
Zaczyna się od otwierającego <h> i kończy zamykającym </h> tagiem z tekstem nagłówka wciśniętym pomiędzy:
Aby dodać tagi <h1> do <h6> w WordPressie za pomocą klasycznego edytora, musisz być na karcie tekstowej:
W edytorze bloków musisz przełączyć się na edycję jako HTML.
Aby to zrobić, kliknij trzy pionowe kropki na pasku narzędzi bloku. Następnie wybierz opcję Edytuj jako HTML.
Tak jak:
W dowolnym edytorze po prostu skopiuj/wklej tag nagłówka, którego chcesz użyć z poniższych , zaktualizuj tekst nagłówka i gotowe.
<h1>This is an H1 heading</h1> <h2>This is an H2 sub-heading</h2> <h3>This is an H3 sub-heading</h3> <h4>This is an H4 sub-heading</h4> <h5>This is an H5 sub-heading</h5> <h6>This is an H6 sub-heading</h6>Zwróćmy teraz naszą uwagę na Shopify.
Jak dodać (lub zmienić) tagi H1 na H6 w Shopify?
Odkąd pojawił się na scenie, Shopify szybko stał się ulubioną platformą e-commerce.
Według Trybunału ds. Hostingu prawie pół miliona stron internetowych korzysta z Shopify.
Podobnie jak WordPress, to, co sprawia, że Shopify jest najbardziej atrakcyjne, to jego zorientowanie na użytkownika.
Zarządzanie produktami, dodawanie i usuwanie stron oraz postów jest niezwykle proste.
Podobnie jest z dodawaniem <H2> do tagów nagłówków <H6>.
W edytorze stron lub postów wystarczy kliknąć kartę formatowania:
Następnie wybierz żądany tag nagłówka:
Podobnie jak w przypadku WordPressa i innych systemów zarządzania treścią, Shopify zapewnia również edytor kodu.
Aby dodać nagłówki do Shopify za pomocą edytora kodu, kliknij przycisk <> w oknie edytora i dodaj kod nagłówka:
Dość proste!
Z drugiej strony, jeśli chcesz dodać i zoptymalizować tagi <H1> i <H2> na innych stronach sklepu Shopify, takich jak strona główna lub strony produktów…
Będziesz musiał edytować pliki motywów Shopify.
Na szczęście Daniel Sim z Plugin Useful przygotował tutaj przydatny przewodnik na ten temat.
Dlaczego warto korzystać z nagłówków?
Omówiliśmy więc „jak” dodawać tagi nagłówków.
Ale nadal możesz się zastanawiać „dlaczego” w ogóle używać nagłówków?
Zwłaszcza, gdy Google określiło użycie nagłówków dla SEO jako przereklamowane:
Pomimo tego, co mówi Google, istnieje (w rzeczywistości) kilka ważnych powodów , dla których warto używać tagów nagłówków:
1. Tagi nagłówków poprawiają dostępność – co zwiększa zasięg Twoich treści
Jeśli chcesz, aby Twoje treści były dostępne dla wszystkich, w tym czytelników niedowidzących, tagi nagłówków są niezwykle przydatne.
Technologia czytania ekranu wykorzystuje H1 i inne tagi nagłówków, aby pomóc użytkownikom nawigować po zawartości, skanować i przeszukiwać stronę.
Jak już wiesz, nagłówki są osadzone w HTML, co oznacza:
Czytnik ekranu może używać kodu HTML do identyfikowania struktury treści i odczytywania nagłówków na głos.
To z kolei pomaga osobom niedowidzącym i niewidomym zorientować się, o czym jest artykuł (bez konieczności słuchania słowo po słowie).
Następnie mogą zdecydować, czy przeczytać artykuł w całości.
Co więcej:
Czytniki ekranu oferują skróty do przechodzenia z jednego nagłówka do drugiego.
Innymi słowy, tagi nagłówków są również używane przez osoby niedowidzące do nawigacji .
2. Google używa H1 zamiast tagów tytułu (tam, gdzie ma to znaczenie)
W niektórych (nie tak) rzadkich przypadkach;
Na przykład, gdy Google nie może znaleźć lub przetworzyć Twojego tagu tytułu.
Google może zdecydować się na wyodrębnienie tytułu z następnej najbardziej odpowiedniej części strony.
W większości przypadków będzie to tag nagłówka 1, ponieważ jest to najbardziej widoczny dostępny element tekstowy.
Pod pewnymi względami znacznik H1 strony pełni podobną funkcję jak znacznik tytułu.
Powinna spełniać intencje wyszukiwania, informować czytelników, czego mogą oczekiwać od strony, i zachęcać użytkowników do dalszego czytania.
Teraz wiesz, że Google może wybrać wyświetlanie Twojego H1 w SERP; upewnij się, że stworzysz przekonujący, godny kliknięcia nagłówek.
Podpowiem, jak to zrobić później.
3. Nagłówki są używane w polecanych fragmentach
Sprawdź ten polecany fragment.
To fragment listy, który zawiera najlepsze blogi w mediach społecznościowych na rok 2020.
Jak myślisz, skąd pochodzi ten tekst?
Zgadłeś. Nagłówki strony rankingu:
Jeśli chcesz pojawiać się w rosnącej liczbie polecanych fragmentów, kluczowe znaczenie ma umieszczenie nagłówków na swojej stronie.
Co prowadzi mnie do kolejnego powodu:
4. Google używa nagłówków do interpretacji treści (i zwiększa ich ranking).
Zwrócę się do tego z dwoma oświadczeniami od Google.
Najpierw od Johna Muellera, starszego analityka trendów dla webmasterów w Google, który mówi:
„Używamy tagów H, aby lepiej zrozumieć strukturę tekstu na stronie”.
Po drugie, od Matta Cuttsa, byłego członka zespołu Google ds. jakości wyszukiwania.
„Google analizuje wiele różnych rzeczy. Przyglądamy się ponad 200 rzeczom, PageRank to tylko jedna z nich. Za każdym razem, gdy oceniamy rzeczy, używamy rzeczy w tytule, w adresie URL, nawet ty znasz rzeczy, które są podświetlone, takie jak tagi h1 i takie tam”.
Matt Cutts, Google
Aby rozwinąć to dalej:
Google używa nagłówków stron, aby (lepiej) interpretować treść.
Ponieważ nagłówek powinien zwykle poprzedzać blok treści:
Google wyświetli nagłówek, aby dowiedzieć się o następującej treści: tekst, obraz lub wideo.
Jeśli Twój nagłówek i treść są ze sobą zgodne, Google może mieć większą pewność, że Twoje treści zapewnią odpowiednie odpowiedzi na zapytania (dotyczące treści).
A z kolei otrzymasz niewielki wzrost rankingu.
A więc przejdźmy do mojego piątego powodu używania nagłówków.
5. Używanie nagłówków jest skorelowane z wyższymi rankingami
Prawie każde badanie korelacji SEO, jakie kiedykolwiek widziałem , wykazało niewielką, ale pozytywną korelację między wyższymi pozycjami w rankingu a nagłówkami na stronie.
Weź ten z SEM Rush:
Okazało się, że artykuły o dobrej strukturze (przy użyciu tagów H2 i H3) są bardziej skuteczne.
A ten z Moz:
Badanie czynników rankingowych Moz wykazało, że strony ze słowem kluczowym zawartym w tagu nagłówka H1 mają większe szanse na wyższą pozycję w rankingu.
Podczas gdy waga przypisywana tagom nagłówka w tych badaniach jest tylko umiarkowana, oraz;
Niektórzy SEO będą (słusznie) argumentować, że korelacja tagu nagłówka z wyższymi rankingami nie dowodzi, że powodują one wyższą pozycję w rankingach , jestem pewien, że się ze mną zgodzisz:
Korzystanie z dobrze zoptymalizowanych tagów nagłówków jest tego warte.
Albo to jest?
Czy tagi H1 naprawdę działają (eksperyment SEO)?
Każdy przewodnik SEO oferuje te same porady:
Ale nie wszystkie blogi przestrzegają tych tak zwanych najlepszych praktyk SEO, a Moz jest jednym z nich.
Moz.com to jedna z najbardziej zaufanych (i często odwiedzanych) stron internetowych na temat SEO, a jednak:
Blog Moz nie ma tagu H1 i zamiast tego używa tagu H2 w głównym nagłówku.
Po zauważeniu, że blog Moz używał tagów H2 jako nagłówków (zamiast H1), Craig Bradford z Distilled skontaktował się z Cyrusem Shepardem z Moz.
Craig i Cyrus postanowili wspólnie przeprowadzić eksperyment, który, miejmy nadzieję, raz na zawsze określi , czy tagi H1 wpływają na rankingi wyszukiwarek.
Aby to zrobić, opracowali test podziału 50/50 nagłówków bloga Moz za pomocą SearchPilot; narzędzie do testowania podziału SEO A/B.
W eksperymencie połowa nagłówków Moz została zmieniona na H1, a druga połowa została jako H2.
Następnie zmierzyli wszelkie różnice w ruchu organicznym między obiema grupami.
Jak myślisz, co się stało, gdy główne nagłówki zostały zmienione z nieprawidłowego tagu nagłówka (H2) na prawidłowy nagłówek (H1)?
Odpowiedź:
Niewiele!
Po ośmiu tygodniach zbierania danych ustalili:
Zmiana nagłówków postów na blogu z H2 na H1 nie spowodowała żadnej statystycznie istotnej różnicy.
Co możemy z tego wywnioskować?
Po prostu Google jest w stanie określić kontekst strony w równym stopniu, jeśli główny nagłówek jest zawinięty w H1 lub H2.
Czy to oznacza, że powinieneś porzucić najlepsze praktyki i pozbyć się H1?
Zupełnie nie.
Struktura nagłówka: anatomia doskonale zorganizowanej hierarchii tagów nagłówka
Jak już wspomniałem:
Nagłówki informują o organizacji treści na Twojej stronie.
I spraw, aby Twoje treści były bardziej przystępne dla czytelników.
Tak więc, mimo że Google stwierdził, że nawet bez „tagów nagłówka”, mogą określić, co jest godne uwagi na stronie…
Korzyści SEO wynikające z używania tagów nagłówków i prawidłowej ich struktury sprawiają, że każdy dodatkowy wysiłek jest większy niż nieużywanie ich w ogóle…
Powstaje wtedy pytanie:
Jak ustrukturyzować tagi nagłówków: prosta (logiczna) hierarchia dla strony internetowej
Jeśli chodzi o układanie nagłówków, należy przestrzegać kilku prostych zasad:
- Zagnieżdżaj nagłówki według ich rangi (lub poziomu)
- Najważniejszy nagłówek ma najwyższą pozycję (<h1>)
- Najmniej ważny nagłówek ma najniższą rangę (<h6>)
- Nagłówki o tej samej lub wyższej randze rozpoczynają nową sekcję
- Nagłówki o niższej randze rozpoczynają nowe podsekcje, które są częścią sekcji o wyższej randze
Stosując te zasady, należy pamiętać o użytkowniku.
Po pierwsze, wizualny użytkownik, który będzie skanował twoją stronę;
Czy hierarchia tagów sprawia, że struktura strony jest bardziej widoczna i łatwiejsza do skanowania?
Po drugie użytkownik niedowidzący;
Czy Twoja hierarchia tagów przedstawia każdą sekcję (i stronę jako całość), pozwalając niewidomym użytkownikom przejść bezpośrednio do części, która ich najbardziej interesuje?
Gdybyś miał czytać na głos tagi nagłówka, czy użytkownik dowiedziałby się (dokładnie), jakie informacje zawiera Twoja strona i jak jest zorganizowana?
Jeśli odpowiesz „nie” na którekolwiek z tych pytań, twoja struktura wymaga ponownego przemyślenia.
Posłużmy się przykładem:
<h3>Quick Links</h3> <h3>Photography Tutorials</h3> <h1>Setting the Exposure Manually on a Camera</h1> <h3>Set the ISO</h3> <h4>The effect of ISO on image quality</h4> <h4>High ISO cameras</h4> <h3>Choose an aperture</h3> <h4>The effect of aperture on depth of focus</h4> <h4>Vignetting</h4> <h4>Diffraction</h4> <h3>Choose a shutter speed</h3> <h4>Shutter speed limitations for hand-holding a camera</h4> <h4>Long exposures</h4>W powyższej strukturze:
Konspekt zaczyna się od dwóch nagłówków <h3>, a nie od <h1> i żaden z tych nagłówków nie jest głównym nagłówkiem strony internetowej.
Zamiast tego są częścią struktury nawigacji wokół nagłówka w szablonie.
Co więcej, po rozpoczęciu treści konspekt przeskakuje z poziomu 1 na poziom 3, bez nagłówka poziomu 2 pomiędzy.
Jak możesz sobie wyobrazić;
Użytkownik skanujący te nagłówki (na przykład na urządzeniu do czytania ekranu) byłby nieco zdezorientowany.
Załóżmy, że treść nie jest tym, czego szukają;
Kliknij przycisk Wstecz i przejdź gdzie indziej.
Zgubiony gość!
Jestem pewien, że teraz rozumiesz, dlaczego odpowiednia struktura nagłówków jest niezbędna?
Pozostając przy tym samym przykładzie…
Oto jak powinna wyglądać struktura nagłówków w odpowiedniej kolejności:
<h1>Setting the Exposure Manually on a Camera</h1> <h2>Set the ISO</h2> <h3>The effect of ISO on image quality</h3> <h3>High ISO cameras</h3> <h2>Choose an aperture</h2> <h3>The effect of aperture on depth of focus</h3> <h3>Vignetting</h3> <h3>Diffraction</h3> <h2>Choose a shutter speed</h2> <h3>Shutter speed limitations for hand-holding a camera</h3> <h3>Long exposures</h3>Każdy poziom nagłówka, od <h1> do <h3>, wskazuje związek między jedną częścią treści a innymi częściami.
Treść pod nagłówkiem logicznie odnosi się do nagłówka nad nim.
Podobnie treść w bloku treści <h2> znajduje się logicznie pod poprzedzającym go <h1>.
W ten sposób struktura nagłówków porządkuje zawartość dokumentu hierarchicznie.
I bardzo jasno wyjaśnia, co jest ważne.
Bingo!
Sprawdzanie tagu H1: jak przeprowadzić audyt pozycji
Więc teraz wiesz, jak uporządkować nowe strony w swojej witrynie, prawda!
Ale co z twoimi istniejącymi stronami?
Jak sprawdzić, czy używają właściwych tagów nagłówków?
Cóż, jest kilka sposobów:
Najpierw możesz sprawdzić kod źródłowy swojej witryny .
Aby to zrobić, przejdź do strony internetowej, którą chcesz sprawdzić za pomocą przeglądarki Google Chrome.
Następnie kliknij „Widok”, następnie „Programista”, a następnie „Wyświetl źródło”.
Następnie 'Control F', aby uruchomić funkcję wyszukiwania na stronie, a następnie '<h1', aby znaleźć otwierający tag HTML H1:
Ten proces można powtórzyć dla H2 za pomocą wyszukiwania „<h2” i tak dalej.
Możesz także przeglądać tagi nagłówków za pomocą rozszerzenia przeglądarki, takiego jak SEO Quake.
Po zainstalowaniu SEO Quake otwórz stronę, którą chcesz sprawdzić, przejdź do zakładki „Diagnoza” w SEO Quake, a następnie przewiń w dół do sekcji Nagłówki.
Wyświetli całkowitą liczbę tagów nagłówków na każdym poziomie, a następnie wyświetli listę tagów nagłówków w hierarchii, w której są wyświetlane.
Szybki przegląd powyższej strony pokazuje, że używa ona znaczników H1, H2 i H3, a znaczniki są zorganizowane w logiczną hierarchię.
Ale może być problem.
Strona zawiera dwa nagłówki h1.
Tagi H1: Ile elementów H1 jest zalecanych na jednej stronie
Jak wspomniałem wcześniej, strona powinna mieć tylko jeden tag H1 .
Dzieje się tak, ponieważ znacznik H1 jest węzłem głównym, z którego wywodzą się wszystkie inne nagłówki.
A mając tylko jeden tag H1, Twoje działania SEO skupiają się na jednym głównym temacie – z wieloma (kompleksowymi) podtematami pod nagłówkami, które używają H2 i H3.
To idealna struktura do rankingu w dzisiejszych czasach.
Ale co z przypadkami, w których Twoja strona ma więcej niż jedno H1?
A może w ogóle nie ma H1?
Według badania przeprowadzonego przez SEMRush, ogromny odsetek stron internetowych zawiera problemy z tagami H1:
Ale według Google nie jest to powód do obaw:
Zwłaszcza, że HTML5 może używać H1 do nagłówka wielu sekcji na tej samej stronie.
Więc co polecam?
Jeśli korzystasz już z HTML5, który może mieć odrębne sekcje na tej samej stronie, użycie tagów H1 dla każdej sekcji jest jak najbardziej w porządku.
Jeśli jednak używasz kodu sprzed HTML5, gdzie jedna strona zwykle oznacza jeden główny temat – trzymaj się zasady jeden h1/jedna strona!
Jak stworzyć Killer H1 do H6 Tagi. Pięć wskazówek dotyczących pisania nagłówków
Następnie podzielę się dokładnie tym, jak napisać nagłówek, który zmniejsza współczynnik odrzuceń, wydłuża czas spędzony na stronie i ostatecznie prowadzi do wyższych pozycji w wyszukiwarkach i konwersji w Twojej witrynie.
Wskoczmy:
1. Daj im to, po co przyszli – opanowanie intencji wyszukiwania za pomocą H1s
Google twierdzi, że używanie słów kluczowych w nagłówkach nie pomoże ci w lepszym rankingu.
Nie mają racji!
Zgadzam się, że słowa kluczowe w nagłówkach mogą nie być bezpośrednim czynnikiem w rankingu , ale mimo to pomagają z czasem uzyskiwać wyższą pozycję.
Dlaczego?
Dwa małe słowa; zamiar wyszukiwania.
Wyobraź sobie przez chwilę, że szukałeś czegoś w Google, kliknąłeś odpowiedni wynik i skończyłeś na stronie docelowej.
W scenariuszu A odwiedzana strona ma wyraźnie wyartykułowany nagłówek, który idealnie pasuje do wyszukiwanego hasła.
W scenariuszu B nagłówek strony w ogóle nie pasuje do wyszukiwanego hasła.
Na której stronie pozostajesz?
Strona A, oczywiście.
Algorytm uczenia maszynowego Google, znany jako RankBrain, wykorzystuje tę koncepcję jako czynnik rankingowy, mierząc czas przebywania użytkowników.
Długi czas przebywania na stronie (czyli czas spędzony na stronie) jest miarą zadowolenia wyszukiwarek.
Jeśli użytkownik spędza dłuższy czas na stronie internetowej – w przeciwieństwie do pogo-przyklejania się od razu do wyników wyszukiwania – Google zakłada, że użytkownik znalazł to, czego szukał.
A z kolei zwiększ pozycję strony w rankingu.
Mówiąc prościej:
Maksymalizacja czasu przebywania i minimalizacja przyklejania się pogo ma obecnie kluczowe znaczenie dla wyższych rankingów.
Jednym z najważniejszych czynników wpływających na czas przebywania jest to, co widzą użytkownicy, gdy po raz pierwszy trafiają na stronę. Innymi słowy, nagłówek.
Jak wszyscy specjaliści od płatnych wyszukiwań powiedzą Ci, jeśli kierujesz reklamy na słowo kluczowe „kije hokejowe”, Twoja strona docelowa powinna zawierać ten termin (lub bardzo zbliżoną odmianę) w nagłówku. To samo dotyczy bezpłatnych wyników wyszukiwania.
Kluczową rzeczą jest tutaj; docelowe słowo kluczowe lub zbliżoną odmianę .
Oczywiście możesz podać dokładne słowo kluczowe, jeśli chcesz, ale nie jest to konieczne.
Najważniejsze jest, aby dopasować intencję wyszukiwania użytkowników, co pozwala używać odmian i synonimów, aby nagłówek był bardziej naturalny i atrakcyjny.
Tak czy inaczej, odzwierciedlenie wyszukiwanego hasła w nagłówku powie użytkownikowi „znalazłeś to, czego szukasz”, co zwiększa szanse, że pozostanie w pobliżu.
Zilustrujmy to przykładem:
Glen Allsopp z Detail.com napisał ten post na temat budowania linków.
Jest skierowany na słowo kluczowe „zaawansowane budowanie linków”.
Aby ułatwić postowi zaspokojenie intencji wyszukiwania, Glen umieszcza swoje słowo kluczowe w tytule strony postów:
I znowu w nagłówku strony.
Dla każdego, kto szuka „zaawansowanego budowania linków”, post Glena będzie miał to, czego szuka.
Może to tylko pomóc w skróceniu czasu przebywania posta Glena i uspokoić algorytm RankBrain Google.
2. Użyj techniki „Co z tego” i zamień swoje nudne nagłówki skoncentrowane na funkcjach w haki oparte na korzyściach
Zamiast pisać tylko krótkie, skoncentrowane na funkcjach podtytuły.
Wprowadzam korzyści do co najmniej 50% moich H2:
Dlaczego to robię?
Korzystając z korzyści, podpowiadam, w jaki sposób moje informacje pomogą moim czytelnikom w ich roli jako SEO.
Na przykład:
W tym poście o eksperymentach SEO mogłem po prostu napisać „Użyj linków wychodzących” jako H2.
Ale zamiast tego zawarłem istotną korzyść pokazującą problem, który informacje te rozwiążą.
Jeśli jesteś SEO i masz ten sam problem, prawie na pewno przeczytasz dalej.
Jak więc tworzyć nagłówki oparte na korzyściach?
Zapytaj: „I co z tego?” wiele razy.
Pokażę ci przykład, który zaczerpnąłem z Enchanting Marketing:
Funkcja: Piekarnik szybko się nagrzewa.
Więc co?
Szybko można zacząć gotować lasagne.
Więc co?
Twoje jedzenie znajdzie się na stole wcześniej.
Więc co?
Życie jest mniej stresujące. Mniej kręci się po kuchni, czekając, aż piekarnik się przygotuje. I nie musisz się martwić; możesz zapomnieć o podgrzaniu piekarnika.
Twój nagłówek, który zaczynał się jako „Funkcja podgrzewania wstępnego”
Może teraz stać się:
„Oszczędzaj czas i zmniejsz stres dzięki tej wyjątkowej funkcji podgrzewania”
Co jest bardziej prawdopodobne, że będziesz przyklejony do strony?
3. Spraw, by Twoje nagłówki wyróżniały się czcionką i kontrastowymi kolorami
Udało Ci się trafić na swój tekst, a nagłówki doskonale spełniają cel wyszukiwania, co dalej?
Aby ułatwić czytelnikom nawigację po treści, powinieneś wyróżnić nagłówki i podtytuły.
Innymi słowy, Twoje nagłówki powinny „wyskakiwać” na stronie.
Rozróżnialność może wiązać się z wizualnym zróżnicowaniem pod względem koloru, rozmiaru, czcionki lub efektu.
LUB kombinacja tych wszystkich.
Rzućmy okiem na kilka przykładów:
Blog Ahrefs wykonuje świetną robotę w rozróżnianiu ich nagłówków:
Używają innego rozmiaru czcionki i subtelnie przechodzą od czerni do szarości w miarę przechodzenia w dół hierarchii nagłówków.
Aby uzyskać punkty bonusowe, używają również niestandardowej czcionki opracowanej wyłącznie dla ich marki.
Innym dobrym przykładem jest Single Grain Erica Siu, który używa kontrastującego pomarańczu w swoich nagłówkach blogów.
Chcesz, aby Twoje nagłówki się wyróżniały, aby różniły się wizualnie od innych elementów na stronie – zwłaszcza wezwania do działania .
Zbyt duże nakładanie się elementów wizualnych może skutkować mniejszą liczbą gałek ocznych w wezwaniach do działania, co prowadzi do niższych konwersji.
Z tym, na moją czwartą wskazówkę
4. Wykorzystaj te sprytne techniki copywritingu, obniż współczynnik odrzuceń i zwiększ sprzedaż
Jeśli to nie sprawi, że poważnie podejdziesz do pisania nagłówków, nic nie będzie:
To stwierdzenie podkreśla wagę nagłówka i dlaczego decyduje o skuteczności całego utworu.
Krótko mówiąc, im lepszy nagłówek, tym większe masz szanse na pokonanie średnich i przeczytanie tego, co napisałeś.
Dotyczy to nie tylko nagłówka głównego (H1), ale także podtytułów (od H2 do H6).
Za każdym razem, gdy następuje przerwa w treści, czytelnik ma dwie możliwości;
Albo się zatrzymują, albo czytają dalej.
Dlatego tak ważne jest, aby w nagłówkach (od H1 do H6) używać kuszących tekstów.
Nie jestem ekspertem od copywritingu, więc zostawię to Nevile Medhora KopyWriting Course, aby podzielić się kilkoma wskazówkami dotyczącymi pisania nagłówków.
5. ZATRZYMAJ czytelników w ich ścieżce, wstawiając te elementy nagłówka do treści
Używanie grafiki jest doskonałe.
Używanie nagłówków jest doskonałe.
Ale kiedy połączysz je ze sobą, pojawia się prawdziwa magia.
Jak już omówiliśmy:
Poprawa czasu spędzanego przez użytkownika na stronie poprawia wyniki w rankingu.
Długi czas przebywania mówi Google, że Twoi użytkownicy są zadowoleni – a z kolei Twoje treści zyskują wyższą pozycję w rankingu.
Aby poprawić czas spędzony na stronie, jest jedna rzecz, na której powinieneś się skupić przede wszystkim;
Zwiększanie czytelności treści .
Oprócz;
- Krótkie akapity
- Obrazy i multimedia
- Cytat bloki
- Punkty kulowe
- Quizy
Jest jeszcze jeden przerywający element treści, który powinieneś wstawić obok swoich podtytułów, który z pewnością zatrzyma „skimmery treści” na ich śladach:
Niestandardowa grafika nagłówka
Rzuć okiem na to podsumowanie dotyczące lokalnego SEO na blogu SEO Sherpa.
Oprócz tagów nagłówka H2 dodałem niestandardową grafikę, która przedstawia każdą podsekcję posta.
Nie tylko sprawiają, że post wygląda DUŻO bardziej imponująco.
Ale pomagają wydłużyć czas spędzony na stronie do przyzwoitej średniej 4-minutowej:
Co jest znacznie powyżej średniej dla witryny:
Stworzenie tych grafik było łatwe, ponieważ mam szczęście, że mam do dyspozycji dwóch projektantów na pełen etat.
Ale jeśli nie jesteś gotowy na zbudowanie własnego zespołu projektowego, nadal istnieje wiele opcji
- Canva – narzędzie do edycji obrazu (bezpłatne)
- PicMonkey – twórca projektów graficznych (bezpłatny)
- 99 wzorów – projektanci freelancerzy (low-cost)
- Upwork – platforma freelancerska (niskokosztowa)
Niezależnie od wybranej trasy.
Następnym razem, gdy będziesz pisać długi fragment treści SEO, dodaj grafikę nagłówka i obserwuj, jak rośnie Twój czas spędzony na stronie (i rankingi).
Więc masz to, wszystko, co musisz wiedzieć o tagach nagłówka io tym, jak z nich korzystać, aby ulepszyć optymalizację pod kątem wyszukiwarek.
Teraz to koniec dla Ciebie!
Jak zastosować te techniki w praktyce na swojej stronie?
Zrobiłem bezpłatną listę kontrolną nagłówków, która pomoże Ci wykorzystać te techniki do poprawy wydajności Twojej witryny.
Przedstawia – krok po kroku – dokładnie, jak wykorzystać strategie, o których mówiłem we wpisie.
Gdy pobierzesz go poniżej , daj mi znać w komentarzach, która jest twoją ulubioną wskazówką dotyczącą pisania nagłówków. Chciałbym wiedzieć.
