Czy Google indeksuje zdjęcia z lazy-load? - Test

Lazy-load to technika umieszczania między innymi zdjęć, która blokuje ich ładowanie do momentu pełnego załadowania strony lub dopiero kiedy będą one widoczne. 18 maja opublikowałem na swoim blogu prosty tutorial, który umieszczał w src placeholder, w data-src przechowywał ścieżkę do właściwego zdjęcia i kiedy użytkownik przewinął do tego zdjęcia, JavaScript podmieniało atrybuty. Prościej się tego zrobić nie da.

Mimo, że istnieje wiele gotowych skryptów do lazy-loadu zdjęć, postanowiłem wdrożyć swoje rozwiązanie w paru linijkach bo należę do osób, które wolą stworzyć sobie własne skrypty od podstaw (rzecz jasna dla nauki), nawet gdyby miałyby być gorsze od dostępnych gotowców i gdyby wymagały jQuery. Nie cierpię na swoich stronach nadmiarowego kodu (jQuerySlim to wyjątek) i instrukcji, które nie wiem jak do końca działają. Zamiast rozumieć czyjeś postępowanie i syntaktykę, wolę do wszystkiego dojść samodzielnie.

Problem indeksowania lazy-load

Największą przeszkodą w stosowaniu lazy-load zawsze była obawa przed tym, że wyszukiwarka nie będzie potrafiła takich zdjęć indeksować. Postanowiłem pójść na całość.

Niektórzy zgodnie z podejściem graceful degradation (nie mylić z progressive enhancement) dodają dodatkowo:

<noscript>

<a href="obrazek.jpg">

</noscript>

Jest to niby taki fallback (gdyby JS nie działał) aby uniknąć sytuacji że zdjęcia się nie ładują. Ja nie dodawałem tego trochę z lenistwa, bo byłoby dużo pracy ze starszymi wpisami lub trzeba byłoby umieszczać w filtrze WordPress wiele regexowych instrukcji. Chciałem też sprawdzić na własnej skórze czy indeksowanie będzie działać.

Wynik testu

Opublikowany wczoraj artykuł o linkowaniu wewnętrznym posiadał wiele dodatkowych ilustracji. Lazy-load działa i (o dziwo) indeksowanie takich zdjęć też. Poniżej zrzut z Google Images:

Dodatkowo, stronka szybko pojawiła się w Google co może być wynikiem lazy-loadu? Tego to już do końca nie wiem, bo dawno nie śledzę statystyk indeksowania.

W każdym razie jeżeli ktoś unika mechanizmu lazy-load w obawie przed tym, że będą problemy z indeksowaniem zdjęć - nie ma się czym przejmować! Nawet w tak prostym rozwiązaniu Google radzi sobie z indeksowaniem zdjęć.

Linki do instrukcji wykonania lazy-loadu i wspomnianego artykułu na którym testowałem indeksowanie zdjęć:

https://mansfeld.pl/seo/linkowanie-wewnetrzne/

https://mansfeld.pl/programowanie/lazy-load-opoznione-ladowanie-zdjec-...