Leniwy ładujący problem SEO, ROZWIĄZANY!

  1. Problem SEO TL; DR: - opowiadanie : Leniwie załadowane obrazy nie będą indeksowane przez boty wyszukiwania,...
  2. Rozwiązanie nr 1, mapy witryn z obrazami (bez dobrego)
  3. Rozwiązanie # 2, noscript (brak dobrego)
  4. Rozwiązanie nr 3, uciekł fragmenty (działa, ale przestarzały)
  5. Rozwiązanie nr 4, nic nie rób (działa)

Problem SEO

TL; DR: - opowiadanie : Leniwie załadowane obrazy nie będą indeksowane przez boty wyszukiwania, takie jak googlebot!

Długa historia : Celem leniwego ładowania obrazów jest przyspieszenie działania witryny bez konieczności wysyłania dodatkowych żądań HTTP poprzez pełne odświeżenie strony. Celem jest zaoszczędzenie przepustowości użytkowników, którzy mogą nigdy nie przewinąć wystarczająco daleko, aby zobaczyć świeżo załadowany obraz lub użytkowników, którzy nigdy nie przesuwają się po suwaku obrazu itp.

Sposób, w jaki działa leniwe ładowanie, polega na tym, że przy pierwszym uruchomieniu skryptów ładowane jest prawidłowe źródło obrazu, gdy obraz jest widoczny w rzutni odwiedzających, ale googlebot nie indeksuje tych obrazów, ponieważ poprawne źródło obrazu nie jest renderowane na serwerze!

Rozwiązanie

TL; DR: - krótka odpowiedź : ponieważ Google zaczął wykonywać skrypty, nie ma już problemu. Nie musisz nic robić 🙂

Długa odpowiedź : Pierwszą dużą stroną, na której zaimplementowałem leniwe ładowanie, była strona LEGO Starwars. Nowa strona miała dużo obrazów o wysokiej rozdzielczości i wiele suwaków zawierających wezwania do działania z obrazami. Dzięki leniwemu ładowaniu obrazów zaoszczędziliśmy mnóstwo kilobajtów i żądań serwera, dzięki czemu strona ładowała się znacznie szybciej. Jedynym minusem było to, że obrazy nie były indeksowane przez żadnego bota wyszukiwania! Próbowałem różnych podejść:

  • Rozwiązanie nr 1, mapy witryn z obrazami (bez dobrego)

    Utwórz mapę witryny dla każdej strony z leniwymi załadowanymi obrazami:

    <? 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://dinbror.dk/blazy </loc> <obraz: obraz> <obraz: loc> http://dinbror.dk/lazy-load -images-with-bLazyJS.jpg </ image: loc> </ image: image> <image: image> <obraz: loc> http://dinbror.dk/lazy-loaded-image.jpg </ image: loc > </ image: image> </url> </urlset>

    W tym czasie nie mogłem tego zrobić. Moje obrazy map witryn nie zostały zindeksowane, więc zakładam, że obrazy w mapie witryny muszą być obecne w znacznikach, zanim zostaną zaindeksowane. Mapy witryn z obrazami są więc przydatne tylko do dostarczania dodatkowych danych meta do obrazu.

  • Rozwiązanie # 2, noscript (brak dobrego)

    Dodaj tag noscript zawierający obraz dla każdego leniwego załadowanego obrazu:

    <img class = "b-lazy" src = "placeholder-image.jpg" src = "image.jpg" alt = "alt-text" /> <noscript> <img src = "image.jpg" alt = "alt -text "/> </noscript>

    Element HTML <noscript> definiuje sekcję HTML do wstawienia, jeśli typ skryptu na stronie nie jest obsługiwany lub skrypty są obecnie wyłączone w przeglądarce.

    Więc wtedy wymyśliłem genialną teorię (tak jak 1000 innych), ponieważ roboty wyszukujące nie mogły renderować JavaScript, ale indeksowały rzeczy wewnątrz tagu noscript, ale jedyną rzeczą, którą z niego wyciągnęłam, były dodatkowe znaczniki. I oczywiście jeden facet z wyłączoną obsługą JavaScript mógł zobaczyć obrazy.

  • Rozwiązanie nr 3, uciekł fragmenty (działa, ale przestarzały)

    Kilka miesięcy po tym, jak strona zaczęła działać, firma Google wprowadziła zasadę ucieczki fragmentów. Zaproponowali zestaw praktyk, które webmasterzy mogą śledzić, aby zapewnić, że ich aplikacje oparte na AJAX i leniwie załadowane obrazy są indeksowane przez wyszukiwarki. Nie będę wnikał w to, jak to działa, ponieważ został oznaczony jako przestarzały październik tego roku (2015). Możesz przeczytać więcej na ten temat tutaj: https://developers.google.com/webmasters/ajax-crawling/docs/learn-more

  • Rozwiązanie nr 4, nic nie rób (działa)

    Ponieważ boty wyszukiwania, takie jak googlebot, zaczęły renderować JavaScript, mogą teraz wyświetlać i indeksować leniwe załadowane treści. To stosunkowo nowa rzecz. Przetestowałem go na stronie LEGO Starwars i bez niczego obrazy są teraz indeksowane w obrazach google, jak widać na poniższym obrazku:
    Ponieważ boty wyszukiwania, takie jak googlebot, zaczęły renderować JavaScript, mogą teraz wyświetlać i indeksować leniwe załadowane treści

    Więc teraz nie masz żadnego usprawiedliwienia dla nie leniwego ładowania obrazów, ramek, gier i filmów, kiedy ma to sens.

Powiązane artykuły

Encoding = "UTF-8"?