Optymalizacja strony internetowej czyli SEOptimer w praktyce

Badając naszą stronę narzędziem online SEOptimer.com otrzymamy ocenę naszej strony w 5 kategoriach: SEO, użyteczność (usability), wydajność (performance), social media oraz bezpieczeństwo (security). Jest to dobry punkt wyjścia aby poprawić podstawowe elementy na stronie mające wpływ na jakość naszej strony internetowej. W poniższym artykule opiszę jak możemy poprawić pewne punkty samodzielnie, gdzie ich szukać i jak one wyglądają fizycznie w kodzie strony oraz na zewnątrz.

Na pewno sporym ułatwieniem jest strona na WordPressie, ponieważ z poziomu laika część punktów może zostać wdrożona za pomocą dodatkowych wtyczek.

1. SEO – nagłówek HTML, kontent, linki i inne

Na przykładzie strony internetowej StudioLokomotywa.pl wygenerowałem przykładowy audyt. Wyniki są całkiem niezłe ale już na tym etapie widzę, że jeszcze parę elementów można poprawić. Ale po kolei.

HTML Header, czyli tytuł i opis strony

Na pierwszy rzut oka w nagłówku SEO Results czytamy, że nasza strona jest w dużej mierze zoptymalizowana pod kątem wydajności ale tytuł “Title Tag” jest za długi i optymalnie było by go skrócić do maksymalnie 70 znaków.

I faktycznie. Wpisując frazę np. pozycjonowanie Poznań widzimy w naszym przypadku na trzeciej pozycji taki oto efekt uciętego wyrażenia:

Aby zaktualizować lub zmienić tytuł naszej strony/podstrony należy edytować plik na serwerze, którego sprawa dotyczy i zaktualizować treść, która znajduje się pomiędzy < title > … < / title>. W przypadku strony głównej powinien być to index.html / index.php

Inaczej jest na WordPressie –  w większości przypadków jeżeli używamy Yoasta SEO lub innej wtyczki do optymalizacji META to nie musimy edytować plików bezpośrednio na serwerze. Jest to sporym ułatwieniem dla nowicjuszy jak i bardziej zaawansowanych, jeżeli aktualizacji META wymaga duża ilość podstron. Dzięki Yoast SEO edytujemy konkretną stronę i możemy działać:

Podobnie sytuacja dotyczy opisu strony czyli META description. W przypadku ręcznym wyszukujemy taką linijkę: < meta name=”description” content=” OPIS “>

Body Content – nagłówki, nasycenie słowami kluczowymi, ilość treści oraz opis grafik

Nagłówki

W punkcie tym bierzemy za cel optymalizację treści. W mojej ocenie kluczowy element i często jest w nim najwięcej do poprawki. Np. osoby tworzące stronę zapominają, że nagłówek H1 powinien być tylko raz użyty na stronie głównej a pozostałe nagłówki powinny być w odpowiedniej kolejności:

SEOptimer pokazuje tylko czy w ogóle występują nagłówki na stronie, jeżeli tak to jakie i w jakiej ilości. Jeżeli po nagłówku H1 występuje błędnie kilka nagłówków H4 a po nich kilka H2 jest błędne i poprawa tego stanu należy do zadań osoby, która stronę będzie optymalizować tak aby całość była poukładana zgodnie ze sztuką oraz z zachowaniem wizualnego stylu taki jaki pierwotnie widać przed i po optymalizacji.

Nasycenie słów kluczowych

Tutaj moim zdaniem moduł ten nie do końca działa poprawnie aczkolwiek jeżeli pojawi się w nim słowo kluczowe, na którym nam zależy dobrze jest mieć podgląd w jakich częściach strony się pojawia a w jakich brakuje. Dzięki temu nadrobimy zaległości i zadbamy o frazę np. “pozycjonowanie” jak w przypadku Lokomotywy i w tytule, i w META i w nagłówku. Jak się ma optymalizacja tych elementów pod np hasło “jak” czy “nie” – nie mam pojęcia, może kiedyś uda się wypełnić tutaj wszystkie czerwone krzyżyki, zielonym haczykiem

Ilość treści w stosunku do kodu oraz opisy zdjęć “alt”

Dobrze jest jak strona posiada więcej niż 500 znaków na stronie. Słowo kluczowe powinno pojawić się co najmniej raz na akapit a stosunek treści do kodu strony powinien wynosić około 40%. Kod można podejrzeć w źródle strony. SEOptimer nie pokazuje nam konkretnego wyniku w liczbach ale podpowiada zielonym haczykiem, że w tym przypadku jest wszystko ok. W przeciwnym razie albo czeka nas wyrzucenie niepotrzebnych skryptów z kodu strony albo dopisanie kilku zdań przydatnego tekstu. Oczywiście opcja jedna i druga w zależności od sytuacji jest również wskazana, gdyż usunięcie ładowanie nie potrzebnych skryptów.

np. skrypty potrzebne do działania formularza kontaktowego, który używany jest tylko na podstronie kontakt powinny być wczytywane tylko na tej podstronie.

Jeżeli jesteśmy przy tekście warto też opisać odpowiednio swoje grafiki, które poprawiają czytelność i obrazują tekst tak aby wyszukiwarka również mogła sklasyfikować co to za grafika. W tym celu każda grafika w kodzie HTML powinna posiadać dopisany atrybut ALT =”” – a w nim nasz opis np. ALT =”Logo StudioLokomotywa “. W przypadku grafik, które nie posiadają podpisu musimy ten wątek nadrobić i aby było nam łatwiej możemy SEOptimerze po kliknięciu “Show details” sprawdzić o jakie pliki graficznie chodzi konkretnie.

Linki wewnątrz strony oraz linki do strony. Linki przyjazne oraz linki, które nie działają

W tym punkcie mamy wyszczególnione 4 czynniki skupiające się tylko na linkach. Od linków kierujących do naszej strony, linki które znajdują się w strukturze naszej strony, linki które nie działają oraz czy mamy linki przyjazne.

Sama historia linkowania i budowania strategii to osoby, szeroki i bardzo ważny wątek SEO. Jak sprawdzić dokładniej linki przychodzące do naszej strony internetowej można przeczytać na naszym blogu a poniżej zrzut ekranu pokazujący tylko esencję liczbową:

Inne, czyli sitemaps strony oraz połączenie z Google Analytics

Ten punkt z reguły tylko pamięta za mnie żeby utworzyć kluczowe elementy SEO, które ułatwią indeksowanie zmian poprzez dodawanie nowych podstron (sitemapa ze stroną powiązana z Search Console), oraz które potwierdzą, że mamy już Google Analytics do późniejszego monitorowania i analizowania ruchu na naszej stronie.

2. Użyteczność, czyli usability dla innych urządzeń

Wątek jest bardzo indywidualny i w większości chodzi o to aby nasza strona była jak najbardziej przejrzysta, czytelna i łatwa w obsłudze na każdym rodzaju urządzenia. Google wprowadzając kolejne algorytmy i czynniki ocen strony takich jak np. Google Speed Update albo Mobile IndexFirst zwraca uwagę, że strona mobilna i ruch mobilny jest bardzo ważny. W związku z tym tekst musi być zawsze dostosowany i odpowiednio zmniejszany w danej kolumnie, nagłówku czy przycisku – względem wielkości wyświetlacza urządzenia. Najczęstszymi zarzutami z jakimi można się spotkać to elementy są zbyt małe do kliknięcia (nie dostosowują swojego rozmiaru) albo są zbyt blisko siebie przez co utrudniają użytkownikom klikanie.

Oprócz tego w tym punkcie SEOptimera można sprawdzić czy strona używa technologii Flash – co nie jest mile widziane, czy używa ramek na stronie oraz czy posiada FAVikonkę – czyli tą małą grafikę widoczną w karcie naszej przeglądarki.

3. Wydajność (performance), Social media oraz bezpieczeństwo strony internetowej (security).

W tym punkcie tylko wspomnę, że audyt również pokazuję nam obecną kondycję strony w formie wydajności strony internetowej. Sprawdza czas odpowiedzi serwera, jak szybko ładuje się strona oraz jak szybko ładują się skrypty na stronie.

Jeżeli nasza strona internetowa posiada błędy w JavaScript to jest to pierwszy punkt stykowy w którym możemy je wyłapać jeżeli wcześniej nam to umknęło z różnych przyczyn.

Kolejnym czynnikiem jest sprawdzenie kompresji GZip, która jak się okazuje znacznie przyspiesza stronę internetową. Niektóre serwery posiadają tę opcję włączoną domyślnie jednak jak się często okazuje w praktyce nie zawsze.

Ostatnim kluczowym punktem, który znacznie przyspiesza stronę internetową i którą możemy w prosty sposób poprawić to optymalizacja grafik. Optymalizacja ta polega na zmniejszeniu jakości grafiki czy zdjęcia w takiej formie aby sam plik posiadał mniejszą pojemność a sama jakość grafiki była taka sama dla gołego oka. Możemy to robić ręcznie lub za pomocą skryptów, dodatków.

O tym jak przyspieszyć swoją stronę internetową na przykładzie strony zbudowanej na WordPressie pisałem już na Blogu i wówczas przyrównywałem wyniki do narzędzia Google PageSpeed. Poniżej przedstawiam zrzut audytu jak to widać okiem SEOptimera

Punktami ostatnimi w audycie są punkty związane z Social Media – gdzie SEOptimer tylko punktuje czy mamy połączenie z naszymi kontami na: Facebook, Twitter, Google+, Instagram, YouTube czy LinkedIn.

Na zakończenie w punkcie “bezpieczeństwo” – możemy sprawdzić czy mamy aktywny SSL dla domeny, czy są utworzone w związku z tym linki https, czy są włączone monitory antywirusowe na serwerze oraz czy maile wyświetlane na stronie są w formie tekstu. Zaleca się oczywiście aby maile chronić poprzez wyświetlanie ich za pomocą grafiki tak aby roboty nie mogły skopiować naszych adresów.