Image SEO – optymalizacja plików graficznych pod kątem SEO

Pracując z klientami i wykonując audyty techniczne, widzę dużo różnych błędów czy niedociągnięć w zakresie technikaliów stron internetowych. Jedne powtarzają się częściej, inne rzadziej, ale zdecydowanie prym wiedzie nieprawidłowa optymalizacja plików graficznych pod kątem wyszukiwarek (Image SEO). Choć wiele biznesów nie opiera się na wartości wizualnej swoich usług czy produktów, to jednak znaczna część tak. W przypadku tych drugich – moje serce zawsze krwawi. Nie ma bowiem nic gorszego niż sklep oferujący np. meble, który ma niezoptymalizowane pod SEO zdjęcia i grafiki.

Dlatego w tym artykule powiem Ci czym jest Image SEO, jak optymalizować grafiki i zdjęcia by wejść w łaski wyszukiwarki Google i zwiększyć swoje szanse na znalezienie się w Google Grafika.

Czym jest optymalizacja zdjęć i obrazów (Image SEO)?

Optymalizacja zdjęć i obrazów, znana również jako image SEO, to działania mające na celu zwiększenie widoczności obrazów w wynikach wyszukiwania (np. Google Grafika).

Sprawdź także artykuł: Co to jest SEO?

Optymalizacja ta ma na celu zwiększenie ruchu organicznego na stronie poprzez przygotowanie obrazów w taki sposób, aby były one łatwiejsze do zrozumienia dla wyszukiwarek. Dzięki temu możesz znacznie zwiększyć widoczność Twojej strony w wynikach wyszukiwania, przyciągając więcej ruchu organicznego i potencjalnych klientów za pomocą zdjęć czy grafik.

Dlaczego optymalizacja obrazów jest kluczowa pod kątem SEO?

Pozycjonowanie grafiki ma duże znaczenie w wielu branżach, zwłaszcza tam, gdzie użytkownicy częściej korzystają z obrazów niż z samego tekstu.

Kiedy ludzie szukają produktów do zakupu, takich jak ubrania, dekoracje do domu czy meble, atrakcyjna prezentacja wizualna jest często kluczowa i wpływa pozytywnie na doświadczenie użytkowników (UX). Dlatego też wiele osób korzysta z Google Images, czyli Google Grafika, aby znaleźć interesujące ich przedmioty.

Poprzez optymalizację obrazów możesz poprawić widoczność strony w wynikach wyszukiwania obrazów, z której często korzystają internauci w trakcie podejmowania decyzji o zakupie.

Jakie aspekty wziąć pod uwagę optymalizując grafiki?

Optymalizując pliki graficzne pod wyszukiwarkę Google musisz pamiętać o kilku ważnych elementach.

Nie jest wcale ich tak mało!

Musisz zadbać przede wszystkim o:

• dobór formatu graficznego,
• rozmiar obrazu,
• jakość i oryginalność,
• odpowiednie nazewnictwo
• i atrybut ALT.

Wybór odpowiedniego formatu graficznego

Dobór odpowiedniego formatu pliku jest ważny ze względu na efektywność i szybkość działania strony internetowej.

PNG

Choć format png ma swoje zalety, takie jak obsługa przeźroczystości tła, czy bezstratna kompresji zdjęć, nie jest jednak polecany pod kątem SEO.

JPG

Stosowanie formatu JPG nie jest najbardziej optymalną strategią, ale zdecydowanie lepszą niż wykorzystywanie PNG.Format JPG stosuje stratną kompresję, co oznacza, że można osiągnąć stosunkowo niskie rozmiary plików przy zachowaniu przyzwoitej jakości obrazu. Obsługuje miliony kolorów, co jest istotne dla obrazów z dużą ilością kolorów, takich jak zdjęcia fotograficzne.

Jednak zdecydowanie królem formatów jeżeli chodzi o SEO jest jegomość poniżej.

SVG

Format SVG to format plików graficznych oparty na opisie wektorowym.

Pliki SVG mogą mieć istotne znaczenie dla SEO. Są one formatowane w postaci tekstu, co oznacza, że treść w nich zawarta może być indeksowana przez wyszukiwarki. To pozwala na lepsze zrozumienie kontekstu grafiki przez roboty.

Dodatkowo SVG jest lekkim formatem plików graficznych, co przekłada się na szybsze ładowanie stron, zwłaszcza na urządzeniach mobilnych. Format ten jest także skalowalny, więc obrazy mogą być wyświetlane na różnych rozmiarach urządzeń, co wpływa pozytywnie na responsywność strony.

Format ten stosujemy głównie dla wszelkich ikonek czy logotypów, dlatego nie ostrz na niego zębów. Nie każda grafika może być SVG. 😉

WEBP

Format WebP jest zdecydowanie najbardziej polecany przy optymalizacji pod SEO. Wszystko ze względu na swoją lekkość, doskonałą jakość obrazu i wsparcie ze strony Google oraz innych przeglądarek internetowych.

WebP obsługuje także przezroczystość oraz animacje, co czyni go wszechstronnym formatem do różnych celów.

Dodatkowo, z uwagi na rosnącą liczbę użytkowników korzystających z urządzeń mobilnych, format WebP, który zapewnia szybsze ładowanie stron, jest szczególnie korzystny dla SEO. Jest już rzeczą oczywistą, że Google przywiązuje coraz większą wagę do wydajności stron na urządzeniach mobilnych podczas oceny ich pozycji w wynikach wyszukiwania.

Rozmiar obrazów – czy jest ważny?

Jeszcze jak!

Rozmiar obrazów ma znaczenie w kwestii pozycjonowania z kilku powodów:

• Obrazy o większych rozmiarach wymagają dłuższego czasu ładowania, co może negatywnie wpłynąć na doświadczenie użytkownika. Szybkość ładowania strony jest jednym z czynników ocenianych przez algorytmy wyszukiwarki. Im mniejszy rozmiar obrazu, tym mniej czasu na jego załadowanie potrzeba. Strona działa szybciej i sprawniej!
• Praktycznie już większość użytkowników sieci korzysta z urządzeń mobilnych do przeglądania stron internetowych, gdzie szybkość ładowania jest jeszcze ważniejsza niż w przypadku komputerów. Mniejsze rozmiary obrazów mogą przyczynić się do poprawy wydajności stron na urządzeniach mobilnych i poprawić ich pozycje w wynikach wyszukiwania.
• Strony o długim czasie ładowania i z dużymi rozmiarami obrazów mogą doświadczać wysokich wskaźników odrzuceń. Znudzony czekaniem użytkownik najpewniej opuści stronę. Wysokie wskaźniki odrzuceń mogą negatywnie wpłynąć na pozycje strony w wynikach wyszukiwania, gdyż Google stawia na pierwszym miejscu potrzeby użytkowników i możliwość ich zaspokojenia.

Jeżeli więc jeszcze zastanawiasz się, czy zmniejszyć rozmiar zdjęcia przed wgraniem go na stronę to myślę, że odpowiedź jest jasna: TAK!

Jakość obrazów i zdjęć na stronę internetową

Jakość obrazów czy zdjęć na stronie internetowej powinna być wystarczająco wysoka, aby zapewnić atrakcyjność wizualną, ale nie wpłynąć na pogorszenie wydajności strony.

Wysoka rozdzielczość to wyraźne, dobrej jakości fotografie, które niestety mogą wpłynąć negatywnie na czas ładowania się strony. Powinieneś więc zachować balans na linii obrazy wysokiej rozdzielczości, a użyteczność strony. W tym celu możesz posłużyć się np. narzędziami do kompresji typu TinyPNG, ale o tym powiem troszkę później.

Szybkość ładowania strony a optymalizacja obrazów

Jak pewnie zdążyłeś wywnioskować z dotychczasowej lektury – optymalizacja obrazów na stronie internetowej odgrywa kluczową rolę w poprawie szybkości ładowania strony.

Proces optymalizacji zdjęć obejmuje m.in. redukcję rozmiaru plików przy minimalnej utracie jakości. Dzięki zastosowaniu narzędzi do kompresji oraz odpowiedniego wyboru formatów obrazów, takich jak WebP, możesz znacząco zredukować rozmiar plików i przyspieszyć czas ładowania strony.

Jeżeli chcesz sprawdzić, czy to właśnie niepoprawna optymalizacja grafiki w tym zakresie jest źródłem obniżonej szybkości w Twojej witrynie, możesz wykorzystać kilka narzędzi, takich jak np. GTmetrix czy Google Pagespeed Insights.

Oryginalność zdjęć i grafik

Wyszukiwarki, takie jak Google, cenią sobie unikalność, nie tylko w kwestii contentu, ale także zdjęć czy grafik. W miarę możliwości stawiaj więc na swoje własne fotografie i obrazy. Z pewnością wspomoże to także budowanie wizerunku eksperta wśród Twojej społeczności i pokaże zaangażowanie w temat.

Kompresja obrazów i grafik

Kompresja grafik polega na zmniejszaniu rozmiaru plików obrazów poprzez redukcję ilości informacji w nich zawartych. Istnieje kilka metod kompresji obrazów:

• stratna
• i bezstratna.

Dzięki kompresji zdjęć na stronę internetową możesz wpłynąć pozytywnie na SEO strony i to, jak odbierają ja użytkownicy. Mniejsze rozmiary plików obrazów mogą przyczynić się do zmniejszenia obciążenia sieci, zwłaszcza w przypadku stron o dużej ilości obrazów. To może być korzystne, gdy masz ograniczone możliwości hostingu.

Jeżeli chodzi o kompresję – osobiście najczęściej korzystam z dwóch narzędzi:

• https://imageoptim.com/online

• oraz https://tinypng.com/.

Nazewnictwo plików graficznych

Pracując ze stronami klientów, zauważam wiele błędów w optymalizacji grafik. Tym, który pojawia się nagminnie, jest brak odpowiedniego nazewnictwa plików.

Roboty Google nie widzą, co jest na grafice. Muszą się jednak dowiedzieć tego z innych źródeł, aby algorytm mógł zdecydować, w jakim kontekście ją wyświetlić. W związku z tym pod uwagę bierze nazwę pliku oraz opis atrybutu ALT, ale o tym drugim za chwilkę.

Nazwa pliku powinna być krótka i zwięzła. Najlepiej, aby zawierała także słowo kluczowe adekwatne do tego, co znajduje się na obrazie.

Lepiej używać nazw opisowych, bez polskich znaków, takich jak np. rozowa-sukienka-bez-plecow.jpg

Pamiętaj też o odpowiednim rozdzieleniu słów. Należy rozdzielać je z użyciem myślnika „-„. Nie używaj podkreślnika „_”. Google nie interpretuje go poprawnie.

Atrybut ALT i jego opis (tekst alternatywny)

Nie jest to jednak jedyna jego funkcja. Pomaga osobom korzystającym z czytników ekranowych lub osobom mającym wyłączone obrazy w przeglądarce w zrozumieniu zawartości obrazu. Dzięki temu Twoja strona jest lepiej dostępna np. dla osób z niedowidzących i niewidomych.

Opis atrybutu ALT obrazu powinien krótko, ale precyzyjnie opisywać zawartość obrazu lub przekazywać istotną informację zawartą w obrazie. Jest to również korzystne dla wyszukiwarek internetowych, ponieważ pomaga im zrozumieć zawartość obrazów i osadzić je w kontekście danej podstrony.

W opisach ALT warto używać także ważnych słów kluczowych (jeżeli pasują do grafiki). Pamiętaj jednak, aby nie upychać tam wielu fraz. Keyword stuffing dostaje od nas zdecydowanie „NIE”!

Przykładowe użycie atrybutu ALT mogłoby wyglądać tak:

< img src=”przykladowy-adres-grafiki.jpg” alt=”opis alternatywny przykładowej grafiki” / >

W powyższym przykładzie „opis alternatywny przykładowej grafiki” jest miejscem, gdzie powinien być umieszczony krótki opis obrazu. Ważne jest, aby opis ALT był precyzyjny i adekwatny do zawartości obrazu, aby zapewnić dostępność i zrozumienie dla wszystkich użytkowników strony internetowej (w tym naszych kochanych robotów, o których uwagę tak zabiegamy :)).

Atrybut Title obrazu

Atrybut Title obrazu jest również atrybutem HTML używanym w tagu obrazu.

< img src=”http://domena.pl/przykladowy-obraz.jpg” alt=”przykladowy-alt” title=”przykladowy-title” / >

Oferuje on dodatkową informację, która pojawia się w postaci tekstu w dymku informacyjnym, gdy użytkownik najedzie kursorem myszy nad obrazem.

W kontekście SEO atrybut Title obrazu nie ma bezpośredniego wpływu na pozycjonowanie, ponieważ nie jest on brany pod uwagę przez algorytmy wyszukiwarek w taki sam sposób, jak atrybut ALT. Nadal może mieć jednak pewne znaczenie, ponieważ może być uznany za dodatkowy sygnał kontekstowy przez wyszukiwarki.

Wartość atrybutu Title obrazu może być wykorzystywana w celu umieszczenia dodatkowej informacji lub opisu, która może być przydatna dla użytkowników przeglądających stronę.

Responsive Images – obrazy dostosowane do różnych urządzeń

Częstym problemem jest umieszczanie na stronach internetowych obrazów, które są albo zbyt małe, albo zbyt duże. Aby zaradzić tej sytuacji, stosuje się zabieg, określany jako „responsywne grafiki”.

Głównym celem obrazów responsywnych jest zapewnienie optymalnego doświadczenia użytkownika na różnych urządzeniach, w tym na komputerach stacjonarnych, tabletach (ktoś jeszcze ich używa? :D) i urządzeniach mobilnych.

Polega to na tym, że na stronie dodaje się różne wersje tego samego obrazka w różnych rozmiarach. W kodzie HTML można to osiągnąć poprzez użycie atrybutu srcset, który pozwala na podanie kilku wariantów obrazka. Dzięki temu przeglądarka może wybrać odpowiednią wersję obrazka zależnie od wielkości ekranu użytkownika czy urządzenia, na którym jest wyświetlany. Responsywne obrazy to rzecz obowiązkowa!

Sitemap dla obrazów – mapa strony a indeksacja przez roboty Google

Mapa witryny dla obrazów, zwana również sitemapą obrazów, jest specjalnym rodzajem mapy XML, która zawiera informacje dotyczące wszystkich obrazów znajdujących się na danej stronie internetowej.

Dzięki niej roboty mogą łatwiej indeksować wszystkie obrazy znajdujące się na stronie internetowej, co może zwiększyć ich widoczność w wynikach wyszukiwania obrazów – Google Grafika.

Lazy loading a szybkość ładowania strony internetowej

Lazy loading to technika używana w celu opóźnienia ładowania elementów na stronie internetowej, takich jak obrazy czy inne media, dopóki nie są one potrzebne.

Zamiast ładować wszystkie zasoby od razu, lazy loading umożliwia ładowanie ich dynamicznie, gdy użytkownik zbliża się do obszaru, w którym się one znajdują.

Ta technika ma znaczący wpływ na szybkość ładowania się strony internetowej, ponieważ zmniejsza ilość danych, które muszą być pobrane i przetworzone podczas ładowania strony. Poprzez opóźnione ładowanie obrazów i innych zasobów, strona może szybciej się wyświetlić, co poprawia doświadczenie użytkownika.

Lazy loading zmniejsza także liczbę danych, które muszą być pobrane podczas ładowania strony. Jest to szczególnie korzystne dla użytkowników korzystających z urządzeń mobilnych i ograniczonych planów danych.

Szybki czas ładowania strony i bardziej responsywna strona mogą przyczynić się do poprawy wskaźników zaangażowania użytkowników i dokonania przez nich konwersji.

Google Grafika w Google Search Console

To, jak radzisz sobie w Google Grafika, możesz z powodzeniem śledzić w znanym Ci zapewne Google Search Console (GSC). Dzięki specjalnemu raportowi możesz sprawdzić, czy obrazy na Twojej stronie generują ruch.

1. W tym celu musisz oczywiście zalogować się do swojego GSC. Zakładam, że konto już masz, więc etap jego tworzenia możemy pominąć. 😉
2. Następnie przechodzimy do sekcji Wyniki Wyszukiwania -> Skuteczność.

3. Zmieniamy Typ wyszukiwania na Grafika.

4. Teraz masz dostęp do danych SEO dotyczących zdjęć i obrazów w Twojej witrynie.

Sekcja Zapytania pozwala zobaczyć, na które zapytania otrzymałeś najwięcej wyświetleń i kliknięć.

Sekcja Strony z kolei pokazuje, które strony generują najwięcej wyświetleń i kliknięć ze zdjęć.

Dzięki tym danym możesz zoptymalizować swoje obrazy pod kątem SEO oraz próbować generować więcej ruchu za ich pomocą.

Optymalizacja grafik image SEO – podsumowanie

Gratulacje! Udało Ci się przebrnąć przez cały artykuł. 🙂 Wiesz już więc, czym jest Image SEO i, że pozycjonowanie grafiki w Google może być ważne na Twojego biznesu.

Dobrze zoptymalizowane grafiki i zdjęcia mogą nieść korzyści dla ruchu w Twojej witrynie oraz sprawiać, że ta ładuje się szybciej, a co za tym idzie – jest bardziej przyjazna dla jej użytkowników.

Choć nie zawsze Image SEO będzie priorytetem, to warto uwzględnić w działaniach optymalizację przynajmniej tych najważniejszych zdjęć i obrazów. Nigdy nie wiadomo, być może potencjalny klient krąży gdzieś właśnie po zakamarkach Google Image. 😉

Jeżeli jednak nadal masz trudności w optymalizacji obrazów lub po prostu nie masz czasu na realizację tego typu zadań – skontaktuj się z nami! Pomagamy pozycjonować grafiki w ramach współpracy w zakresie pozycjonowania stron internetowych!