Table of contents
Optymalizacja grafik jest bardzo istotnym elementem w procesie pozycjonowania witryny. Grafiki stanowią część strony internetowej, która zdecydowanie przyciąga uwagę użytkowników i zachęca ich do podejmowania interakcji.
Jednak nie tylko z perspektywy użytkowników optymalizacja grafik ma znaczenie. Obrazy są również brane pod uwagę i analizowane przez roboty wyszukiwarek.
Jak należy o nie zadbać pozycjonując witrynę?
Kilka kroków niezbędnych do optymalizacji grafik na stronie
Nazwa obrazu
Niestety wciąż na wielu serwisach możemy spotkać obrazy, których nazwa składa się z przypadkowych znaków np. “0abkcspodpwfne345.jpg”. Taka nazwa grafiki niczego nam nie mówi i jest nieoptymalna pod kątem SEO. Roboty indeksujące nie są w stanie od razu ustalić co znajduje się na grafice i czy jest ona zgodna z tematyką strony.
Dlatego najlepszym rozwiązaniem jest stosowanie krótkich, konkretnych nazw, składających się ze słów kluczowych i mówiących o tym, co znajduje się na danym zdjęciu czy grafice np. “chlopiec-grający-w-pilke.jpg”.
Należy również pamiętać o niestosowaniu w nazwach plików polskich znaków, spacji oraz znaku podkreślenia. Jako separatora powinno się używać znaku pauzy.
Stosując się do tych zasad ułatwimy robotom indeksującym skanowanie witryny oraz uporządkujemy grafiki dla własnych potrzeb na serwerze.
Format pliku
Dotychczas najbardziej popularnymi formatami grafik były JPG, PNG oraz SVG.
Format JPG jest najstarszym i zdecydowanie najczęściej stosowanym formatem. Jego zgodność z praktycznie każdą przeglądarką sprawia, że jest najbardziej uniwersalny.
Cechą charakterystyczną obrazów PNG jest możliwość zapisu obrazu bez tła, jednak zajmują one dużo więcej miejsca niż inne formaty. Warto wziąć to pod uwagę wybierając grafiki, aby nie obciążać zbytnio strony i nie wydłużać czasu jej ładowania.
Pliki SVG stosuje się zazwyczaj do ikon oraz logotypów na stronach.
Aby przyspieszyć czas ładowania się witryny oraz zadbać o najlepszą jakość prezentowanych obrazów warto używać formatów nowej generacji.
Format WebP jest rozszerzeniem stworzonym i wprowadzonym przez Google w 2010 roku. Łączy on cechy JPG oraz PNG, zapewniając wysoką jakość oraz niewielki rozmiar pliku, który nie obciąża działania strony.
JPEG2000 jest uzupełnieniem formatu JPEG i pozwala na dokonanie bezstratnej kompresji, co oznacza wysoką jakość obrazów. Niestety na chwilę obecną nie wszystkie przeglądarki są kompatybilne z tym formatem, dlatego warto to sprawdzić przed tworzeniem grafik na stronę.
Rozmiar grafiki
Jest to podstawowy czynnik, który determinuje prędkość wczytywania się witryny. Zbyt duże rozmiary grafik znacznie obciążają stronę oraz powodują jej wolne ładowanie się. Ma to wpływ na jakość witryny oraz na wrażenia użytkowników odwiedzających stronę.
Odbiorcy szybko rezygnują z zakupów lub uzyskania informacji ze strony, na której wczytywanie się grafik lub innych istotnych elementów odbywa się z opóźnieniem. Zwiększa to współczynnik odrzuceń oraz wpływa na decyzję zakupową potencjalnych klientów. Ma to szczególne znaczenie w przypadku e-commerce z dużą ilością produktów i grafik.
Aby jak najlepiej zoptymalizować witrynę pod tym kątem należy dostosować wielkość grafik do odpowiednich standardów, nie rezygnując z wysokiej jakości.
Można to uzyskać dzięki bezstratnej kompresji w dedykowanych ku temu aplikacjach lub narzędziach.
Atrybuty alt oraz title
Tekst alternatywny dla grafik, który umieszczamy w kodzie HTML strony jest niezwykle istotny, szczególnie z punktu widzenia robotów wyszukiwarek. Ma on również zastosowanie w przypadku stron, które wczytują grafiki z opóźnieniem lub osób niewidomych korzystających z czytników ekranu oraz pozwala na dopasowanie obrazu do wyników wyszukiwania Google Grafika.
Atrybut “alt” jest jednym z najważniejszych czynników rankingowych, więc jego optymalizacja jest szczególnie ważna. Powinien on zawierać krótką informację o tym, co znajduje się na zdjęciu, uwzględniając frazy kluczowe powiązane z tematem strony.
Podobnie jest w przypadku atrybutu Title. Stanowi on tekst pomocniczy, który wyświetla się po wskazaniu kursorem myszki na daną grafikę. Jest on dobrym miejscem do umieszczenia dodatkowej frazy kluczowej opisującej zawartość podstrony.
Sitemapa plików graficznych
Umieszczenie listy obrazów w istniejącej sitemapie lub stworzenie dedykowanej tylko grafikom jest czymś o czym warto pamiętać. Ułatwia to robotom odczytanie i indeksowanie obrazów znajdujących się na stronie.
Zdjęcia responsywne
Obecnie znaczna część społeczeństwa korzysta z urządzeń mobilnych. Dostosowanie grafik do wielu rozdzielczości jest czymś koniecznym, aby wyświetlały się prawidłowo na różnych typach urządzeń.
Najłatwiejszym sposobem aby to osiągnąć jest użycie mechanizmu responsywnych grafik. Wystarczy dodać w kodzie kilka wariantów danej grafiki, stosując atrybut ‘srcset’. Dzięki temu po identyfikacji rozdzielczości z jakiej korzysta użytkownik, przeglądarka wyświetli przypisaną jej grafikę.
Zdecydowanie wpłynie to na prędkość wczytywania się strony oraz pozytywne wrażenia użytkownika.
Jakie korzyści przynosi optymalizacja grafik?
Obecnie, ze względu na poprawę jakości stron i nacisk na pozytywne wrażenia użytkownika stosuje się coraz więcej grafik, schematów i logotypów. Ich odpowiednia optymalizacja jest więc niezbędna do prawidłowego funkcjonowania witryny.
Jakie konkretnie płyną z tego korzyści?
Pojawienie się w Google grafika
Odpowiednie dobranie treści atrybutów ALT oraz TITLE wpływa na lepsze powiązanie grafik z prezentowaną na stronie treścią. Pozwala to wyszukiwarce Google na dopasowanie grafik pod konkretne zapytania użytkowników.
Dzięki temu nasza strona może znaleźć się w graficznych wynikach wyszukiwania i zwiększyć szansę na przejście użytkownika na stronę.
Większy ruch i interakcja użytkowników
Dostosowanie grafik do potrzeb użytkowników zdecydowanie wpływa na ich interakcje ze stroną. Dużo chętniej przejdziemy na stronę, której grafiki są dla nas atrakcyjne, szybko się ładują a ich tytuły wskazują na interesującą nas tematykę.
Umieszczenie dodatkowych logotypów lub schematów, które nie obciążają dodatkowo strony może również zachęcić użytkowników do dłuższego pozostania na stronie, przejścia na kolejne podstrony serwisu oraz wpływa pozytywnie na ich decyzję zakupową.
Wszystko to przekłada się na większy ruch na stronie oraz wyższe dochody.
Krótszy czas ładowania się strony
Do najczęstszych błędów jakie wskazuje narzędzie do analizy prędkości wczytywania się witryny należą te związane z niepoprawnie zoptymalizowanymi grafikami.
Stosowanie formatów nowej generacji, dopasowanie rozmiaru plików, zmniejszenie ich za pomocą narzędzi do bezstratnej kompresji prowadzi do szybszego wczytywania się witryny, lepszej optymalizacji pod kątem urządzeń mobile oraz zwiększa interakcję użytkownika ze stroną.
Podsumowanie
Optymalizacja grafik jest kluczowa w procesie pozycjonowania witryny. Oprócz wpływu na pozycję przekłada się również na wzrost ruchu na stronie, współczynnika konwersji oraz pozytywnych wrażeń użytkownika.
Wszystkie te czynniki powodują, że klienci spędzają więcej czasu na stronie, wracają do niej po czasie oraz częściej dokonują zakupów.
