SEO obrazów: 9 kluczowych elementów do optymalizacji

1. Ogólne uwagi dotyczące SEO obrazów

Często wkładamy cały nasz wysiłek w pozycjonowanie naszych wartościowych dla SEO URL-i w SERP-ach. Jednak, jak wspomnieliśmy wcześniej, optymalizacja obrazów jest ważna, aby pozycjonować się wyżej w wynikach wyszukiwania Google Images i zwiększać nasze możliwości przyciągania ruchu organicznego za ich pośrednictwem.

Boty Google nie mogą "czytać" obrazów. Są przeznaczone do czytania kodu na stronie internetowej, a nie konkretnej animacji lub obrazu. Z tego powodu musimy dostarczyć im te informacje, podążając za prostym zestawem wytycznych SEO. To określi, czy boty mogą interpretować informacje, które staramy się pokazać, oceniać obrazy i pozycjonować je wyżej w sekcji Google Images.

2. Rozmiar i waga obrazu

Dwoma głównymi czynnikami do rozważenia podczas optymalizacji obrazów są ich waga i rozmiar.

Waga:

Używanie ciężkich obrazów na twojej stronie może zwiększyć czas ładowania URL-a, na którym są wdrożone, a tym samym całej witryny. Czas ładowania jest jednym z czynników wpływających na ranking organiczny na desktopie i mobile, czyniąc optymalizację obrazów niezbędną.

Narzędzia do redukcji wagi obrazów:

Istnieje wiele narzędzi, których możemy użyć do redukcji wagi obrazów. Nawet jeśli nie mamy profesjonalnego oprogramowania do edycji obrazów, takiego jak Photoshop czy Illustrator, możemy używać platform online, takich jak:

• ›

  ImageOptim lub TinyJPG, które redukują wagę obrazu bez wpływu na jakość.

• ›

  Website Speed Test Image Analysis Tool umożliwia łatwe pobieranie nowych formatów obrazów.

Rozmiar:

Dodatkowo ważne jest również wdrażanie kilku rozmiarów obrazów dla każdej witryny, aby wyświetlać najodpowiedniejszy w zależności od urządzenia, na którym jest oglądany. Nawet jeśli istnieją wtyczki, które dostosowują rozmiar obrazu, ta opcja może nie być najlepsza w praktyce. Powodem jest, że na przykład obraz 1000px może być przeskalowany do 400px, redukując jego wizualny rozmiar, ale obraz nadal będzie tak samo ciężki jak obraz 1000px, wpływając na wydajność i szybkość twojej witryny.

Narzędzia:

Najważniejszym czynnikiem przy wyborze obrazów jest znajomość platformy, na której będziemy pracować. Jeśli pracujemy na WordPressie, na przykład, możemy użyć SmushIt, wtyczki, która umożliwia zdefiniowanie maksymalnej szerokości i wysokości naszych obrazów przed ich przeskalowaniem, kompresją i przesłaniem na serwer.

Jeśli, przeciwnie, pracujemy z platformą własnego kodu, musimy stworzyć ręczny lub automatyczny proces, który pozwoli na optymalizację obrazów przed przesłaniem ich na serwer.

3. Format obrazu przyjazny SEO

Obecnie najbardziej optymalnym sposobem zapisywania obrazów internetowych jest użycie jednego z następujących czterech formatów:

• ›

  WebP: Może zredukować oryginalną wagę obrazu o 25-35%. Jest to obecnie jeden z najbardziej polecanych formatów; choć niektóre wersje przeglądarek nadal nie mogą ich odczytać, jest to jeden z formatów, który pozwala na większą kompresję bez wpływu na jakość obrazu.

• ›

  PNG: Najlepszy wybór dla obrazów z kilkoma kolorami i przezroczystymi tłami. Jest szeroko stosowany w logo.

• ›

  JPG: Format, który powinien być używany dla fotografii i obrazów ogólnie. Trochę jakości jest tracone podczas kompresji, ale kolory i tony są zachowane takie same.

• ›

  GIF: Używany w animacjach i ruchomych obrazach.

Rekomendacje:

• ›

  Zawsze używaj najodpowiedniejszego formatu obrazu pod względem wagi i kompatybilności.

• ›

  Zawsze kompresuj obrazy, ręcznie lub poprzez automatyczne narzędzie do przetwarzania.

• ›

  Jeśli witryna zawiera kilka ikon, zgrupuj je w jeden obraz poprzez CSS Sprites, aby zredukować liczbę żądań do serwera i poprawić wydajność twojej witryny.

4. Pola SEO obrazu

Każdy obraz przychodzi z zestawem powiązanych pól, aby zapewnić robotom wyszukiwarek (i użytkownikom, oczywiście) lepszą dostępność.

Nazwa obrazu

Nazwa obrazu odnosi się do nazwy pliku. To tytuł obrazu, który używa myślników i podkreśleń między słowami. Zaleca się włączenie słowa kluczowego, na które chcemy pozycjonować nasz obraz wyżej, unikając nietypowych znaków (takich jak "ñ", "?" lub liter z akcentami, "á" itp.)

Wskazane jest również pomijanie przyimków lub innych nieistotnych znaków w nazwie obrazu, aby skrócić URL i uczynić go możliwie najbardziej przyjaznym SEO.

Tytuł

To tekst, który pojawia się po umieszczeniu kursora na obrazie. Polecamy go wypełnić, aby dodać semantyczny tytuł do obrazu, w tym słowo kluczowe, na które chcemy pozycjonować się wyżej.

To może być takie samo jak tekst alt, choć przepisanie tego atrybutu z drobnymi modyfikacjami nie zajmuje dużo czasu.

Atrybut "alt"

To najważniejszy element, ponieważ to ten Google czyta. Musi zawierać główne słowo kluczowe, na które chcemy pozycjonować nasz URL wyżej i powinien zawierać krótkie opisy.

Jego składnia jest następująca:

<img src="LINK OBRAZU" alt="OPIS ALT OBRAZU" />

Przykład zoptymalizowanego obrazu:

Zobaczmy, jak każde pole może być zoptymalizowane dla tego obrazu w oparciu o słowo kluczowe docelowe "ciberseguridad pymes", którego średnia miesięczna wyszukiwań wynosi 90 (w Hiszpanii):

Nazwa pliku:

• ›

  Źle: 04745892595295.jpg

• ›

  Dobrze: ciberseguridad-pymes.jpg

Tytuł: Consejos de ciberseguridad para empresarios y pymes. (Porady dotyczące cyberbezpieczeństwa dla firm i małych przedsiębiorstw.)

Tekst alt: Ciberseguridad para pymes y empresarios: consejos. (Cyberbezpieczeństwo dla małych firm i przedsiębiorstw: wskazówki.)

W ten sposób zoptymalizujemy wszystkie pola i otrzymamy obraz gotowy do walki o najwyższe pozycje. Oczywiście optymalizacja obrazów nie gwarantuje, że pojawią się jako pierwsze, ale to pierwszy krok, aby to osiągnąć :)

5. Kontekst semantyczny

Google uważa, że najbardziej istotne obrazy to te, które idą w parze z otaczającą je treścią. Dlatego zaleca się włączenie powiązanego tekstu. W ten sposób rozszerzymy całkowity kontekst semantyczny w URL-u.

6. Sitemapa specyficzna dla obrazów

Aby pomóc botom Google efektywniej śledzić nasze obrazy, konieczne jest stworzenie ekskluzywnej sitemap.xml z tym rodzajem pliku. Na WordPressie może być automatycznie tworzona za pomocą narzędzi (wtyczek), takich jak Yoast lub RankMath. Jeśli nie pracujesz na WordPressie, możesz użyć alternatywnych narzędzi lub ręcznych narzędzi programistycznych (śledzenie URL-i).

Następnie zobaczysz przykład sitemapy z dwoma obrazami w artykule:

<?xml version="1.0" encoding="UTF-8"?> <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1"> <url> <loc>http://example.com/sample.html&lt;/loc> <image:image> <image:loc>http://example.com/image.jpg&lt;/image:loc> </image:image> <image:image> <image:loc>http://example.com/photo.jpg&lt;/image:loc> </image:image> </url> </urlset>

Niektóre z najczęściej używanych tagów przy tworzeniu sitemapy obrazów to:

→ Tytuł obrazu

→ URL lub ścieżka, w której zapisany jest plik

→ Przypis

→ Typ licencji

→ Informacje geolokalizacyjne

• ›Dokumentacja: Dużo informacji można znaleźć na blogu Google o sitemapach obrazów z przykładami, samouczkami wdrożeniowymi i więcej.

Po zakończeniu wdrożenia będziemy mogli zweryfikować status pokrycia indeksacji w Search Console.

7. Lazy Loading obrazów (ładowanie na żądanie)

Obrazy są jednymi z najczęściej używanych zasobów na stronach internetowych, ponieważ "obraz wart jest tysiąca słów", jak mówią. Dlatego wizualny aspekt każdej strony internetowej jest starannie opracowywany przy użyciu tych elementów multimedialnych. Jednak nieoptymalizowanie ich może mieć negatywny wpływ na doświadczenie użytkownika i czas ładowania witryny. Z tego powodu lazy loading jest wskazany.

Dzięki lazy loading obrazy są ładowane tylko wtedy, gdy pojawiają się na ekranie. Na przykład, jeśli są w niższej części strony, która nie jest jeszcze widoczna na ekranie urządzenia, nie zostaną załadowane, dopóki użytkownik nie przewinie w dół. To znacznie obniża liczbę żądań HTTPS i redukuje czasy ładowania, czyniąc twoją stronę bardziej lubianą przez Google.

Wtyczki do wdrażania Lazy loading na WordPressie

Jeśli zarządzasz stronami na tej platformie oprogramowania, istnieje zestaw wtyczek, które przyciągną twoją uwagę, jeśli chcesz zoptymalizować obrazy poprzez wdrożenie lazy loading. Pamiętaj, aby sprawdzić, czy zainstalowany motyw zawiera tę funkcję. Jeśli nie, oto kilka interesujących:

• ›

  BJ Lazy Load: łatwa do zainstalowania i skonfigurowania, jest jednym z najpopularniejszych narzędzi, z ponad 90 000 instalacji. Dzięki temu uzupełnieniu możesz skalować obrazy, aby dostosować je do różnych rozmiarów ekranów.

• ›

  Lazy Load by WP Rocket: prosta i łatwa do skonfigurowania (zasadniczo dlatego, że nie zapewnia różnych opcji), zaletą tej wtyczki jest to, że nie używa biblioteki JavaScript takiej jak jQuery.

8. Używanie CDN dla obrazów

CDN (Content Delivery Network) to zestaw serwerów rozproszonych na całym świecie, które ułatwiają cachowaną treść witryny w zależności od tego, gdzie znajduje się żądający. Dzięki tej sieci hostingowej ten serwer, który jest bliżej żądającego, dostarczy kopię żądanej witryny.

Dlatego użycie CDN pomaga w szybszym pobieraniu naszych URL-i, redukując czasy ładowania naszej witryny i promując jej ranking organiczny.

Jeśli używamy CDN (na przykład Cloudflare) do pokazywania obrazów, te będą pobierane i wyświetlane szybciej. Ten prosty przepływ bezpośrednio poprawi nasze SEO.

9. Inne uwagi

Wartościowe dla SEO obrazy, czyli te, które chcemy pozycjonować wyżej, muszą być zawarte w kodzie źródłowym URL-a. Te wdrożone jako właściwość tła w CSS nie będą widoczne dla Google, ponieważ nie może on zrozumieć tego typu arkuszy stylów.

Dodatkowo istnieją inne nieodzowne szczegóły do zapamiętania podczas optymalizacji naszych obrazów:

• ›

  Exif: Z każdym obrazem zapisywany jest zestaw atrybutów, takich jak data, w której zrobiono zdjęcie, i inne dane istotne dla profesjonalistów w tej dziedzinie. Jednak ta informacja nie jest wartościowa dla SEO i tylko zajmuje miejsce. Usunięcie tej informacji może pomóc w optymalizacji obrazów i uczynieniu ich mniej ciężkimi.

• ›

  "longdesc": Ten atrybut jest zwykle zapominany, ale może być interesujący do wdrożenia w naszych obrazach. To długi opis obrazu.

• ›

  Linkowanie: Link-building odgrywa fundamentalną rolę w organicznym wzroście naszych stron, ale także naszych obrazów. Te również mogą być linkowane i tym samym osiągać wyższe rozpoznanie w wyszukiwarkach.

Czy brakuje nam jakichś niezbędnych wskazówek? Chętnie cię posłuchamy. Zostaw komentarz poniżej i nie wahaj się podzielić swoją wiedzą!