Jak wygląda optymalizacja wewnętrznej struktury strony internetowej? Techniczne SEO on-page od podstaw. O czym pamiętać, aby uzyskać zadowalające efekty pozycjonowania?
iCEA Group
Jeśli kiedykolwiek zastanawiałeś się, jaki kod obsługuje strony internetowe w przeglądarce – dobrze trafiłeś. Dziś przyjrzymy się bowiem kilku ważnym elementom zawartym w kodzie źródłowym, który każdy twórca internetowy powinien dobrze znać.
W tym artykule znajdziesz przydatne wskazówki dotyczące różnych zasad używanych w HTML, CSS i JavaScript. Dzięki temu, tak jak mechanik zagląda pod maskę samochodu, tak i Ty będziesz mógł zajrzeć do wnętrza swojej witryny.
Wyświetlanie kodu źródłowego HTML to dobry sposób na szybkie wykrycie i rozwiązywanie problemów z witryną.
Element ten ważny jest również dlatego, że wyszukiwarki odczytują kod źródłowy, aby przydzielić witrynie odpowiednie miejsce na liście wyników wyszukiwania.
Ponadto jeśli zatrudniasz kogoś, kto prowadzi działania optymalizacyjne w Twojej witrynie, analiza kodu źródłowego pozwoli Ci kontrolować jego poczynania.
W tym krótkim przewodniku dowiesz się, jak wyświetlać i czytać kod źródłowy, a także poznasz sposoby wprowadzania zmian korzystnie wpływających na pozycjonowanie witryny za pomocą właściwych technik programistycznych.
Kod źródłowy jest wynikiem pracy programisty. Przed utworzeniem musi zostać poddany translacji na kod wynikowy. Jego wykonanie jest możliwe m.in. za pomocą kompilatora. Kod ma sprawić, aby działanie programu komputerowego było zrozumiałe i mogło być rozbudowywane o nowe funkcje. Aby wyświetlić kod źródłowy, musisz otworzyć wybraną przeglądarkę internetową i przejść do wybranej strony. Oto skróty klawiszowe, które możesz wykorzystać:
Komputery PC (Microsoft/Windows)
Komputery Mac
Aby znaleźć elementy w kodzie źródłowym, naciśnij CTRL+F. Pozwoli Ci to szybko przejrzeć kod źródłowy pod kątem SEO, projektowania stron internetowych i rozwiązywania ewentualnych problemów.
Podczas badania kodu źródłowego, z uwzględnieniem struktury konkretnego języka, należy spojrzeć na tag tytułu. Jest pierwszym elementem, który użytkownicy widzą w wyszukiwarce Google. Przedstawia on odbiorcom temat danej strony i obrazuje jej zawartość. Tag tytułu ma duży wpływ na współczynnik kliknięć, dlatego warto zadbać o jego optymalizację.
Znacznik otwierający wyznacza początek znacznika tytułu: <title>. Kończy się natomiast tagiem zamykającym: </title>. Tag tytułu znaleźć można w górnej części kodu źródłowego w sekcji <head>.
Treść tagu tytułu zazwyczaj odpowiada nagłówkowi w wynikach wyszukiwania Google.
Jeśli chcesz, aby strona dobrze pozycjonowała się dla określonego słowa kluczowego, musisz mieć ten termin w swoim tytule. Pamiętaj też, że ważne jest posiadanie oryginalnych tytułów. Zduplikowane treści mogą bowiem przynieść efekt przeciwny do zamierzonego.
Aby nieco ułatwić sobie ten proces, możesz skorzystać z bezpłatnej aplikacji Screaming Frog. Program ten skanuje Twoją witrynę i pozwala szybko zidentyfikować ewentualne duplikaty lub wyszukiwać brakujące tagi w ciągu kilku minut.
Meta opisy to swego rodzaju teksty reklamowe. Ich zadaniem jest bowiem zachęcenie użytkowników do kliknięcia w link witryny. Pojawia się jednak problem w postaci ograniczonej liczby znaków w opisie. Trudno bowiem szczegółowo przedstawić temat serwisu, mieszcząc się jednocześnie w przedziale 130–160 znaków.
Istotnym błędem jest również zupełny brak opisu witryny. Google dodaje wówczas ten fragment automatycznie, w wyniku czego zwykle nie jest on zrozumiały i nie ułatwia użytkownikom zrozumienia tematu strony.
Meta opisy są nieco trudniejsze do znalezienia w kodzie źródłowym. Aby poznać swój opis, wyszukaj <meta name=”description”>.
Podobnie jak w przypadku tagów tytułowych, warto zidentyfikować brakujące, zduplikowane lub zbyt długie opisy w automatycznym audycie Screaming Frog.
Tagi H1 to tytuły stron internetowych. Jest to pierwszy element, jaki użytkownik zauważa po otworzeniu witryny. Warto więc upewnić się, że będzie on na tyle zachęcający, że odbiorca zdecyduje się zagłębić w daną treść.
Mimo że HTML5 akceptuje już więcej niż jeden tag H1, pamiętaj, że powinieneś mieć tylko jeden tag H1 na stronę.
Ważne jest również, aby nie przepełniać tagów H1 zbyt wieloma słowami kluczowymi. Będzie to wyglądać bardzo nienaturalnie z punktu widzenia użytkowników i może spotkać się z karą od Google.
Tagi H1 wchodzą w skład kodu źródłowego, możesz je znaleźć, wyszukując <h1.
Istnieje kilka typów linków wyświetlanych w kodzie źródłowym.
NoFollow to atrybut, który dodany do linków wewnętrznych, informuje wyszukiwarki, że łącze nie powinno być indeksowane. Podczas gdy jeszcze kilka lat temu był on używany głównie do generowania PageRank, dziś stanowi ważne narzędzie w zakresie SEO. Linki NoFollow znajdziesz u kodu źródłowego przy rel=nofollow.
Linki generowane przez użytkowników (USG) zostały utworzone przez odbiorców mających dostęp do Twojej witryny. Tego typu łącza są zwykle dodawane do forów mediów społecznościowych, a znaleźć je możesz, wyszukując rel=usg.
Jeśli ktoś zapłacił Ci za dodanie określonego linku do strony, musisz uwzględnić to w kodzie witryny poprzez dodanie rel=sponsored.
Wyżej wymienione aspekty to tylko ułamek wszystkich elementów programu zapisanego kodem źródłowym. Analiza tego obszaru (za pomocą stosowania właściwych technik programistycznych) pozwoli zidentyfikować ewentualne błędy i szybko je rozwiązać, dlatego warto na stałe wpisać ten zabieg w zakres swojej strategii optymalizacyjnej. Należy sprawdzać wydajność generowanego kodu wynikowego, aby cieszyć się sprawną witryną.
Chcesz zobaczyć o czym jeszcze pisaliśmy?
iCEA Group
Magdalena Antoń
Karolina GoćkowskaRozpocznij
od bezpłatnej
konsultacji SEO
Zainwestuj w szczegółową konsultację SEO i dowiedz się więcej na temat wydajności Twojego sklepu internetowego. Przeprowadzimy dla Ciebie kompleksową analizę, dzięki której uzyskasz jasny obraz tego, co należy poprawić.
