Jak zoptymalizować witrynę pod kątem podstawowych wskaźników internetowych (Adsense)

Wyścig o poprawę podstawowych wskaźników internetowych nie jest łatwy. Staje się to trudniejsze, jeśli polegasz na programie reklamowym, takim jak Google AdSense, aby zarabiać na swojej witrynie.

Witryny internetowe, w których działa Google AdSense, są 10 razy bardziej narażone na niezaliczenie testu Core Web Vitals niż ta sama witryna bez Google AdSense. Dzieje się tak głównie ze względu na liczbę żądań i zasobów stron trzecich, które Google AdSense dodaje do Twojej witryny. Większość z tych zasobów jest niezoptymalizowana, duża i nieprzyjazna dla użytkownika.

Jeśli poza AdSense i platformami reklamowymi masz dużo niezoptymalizowanych obrazów, JavaScript i CSS, szczególnie w części strony widocznej na ekranie, istnieje duże prawdopodobieństwo, że nie przejdziesz testu Core Web Vitals.

Jeśli masz problemy z zaliczeniem testu Core Web Vitals i ulepszeniem swoich Wyszukiwarka rankingu potencjałów, praktyczne rozwiązania znajdziesz w tym artykule.

Co to są kluczowe wskaźniki internetowe?

Podstawowe wskaźniki internetowe to wskaźniki obsługiwane przez Google Lighthouse, które określają, w jaki sposób witryna zapewnia dobry komfort korzystania ze strony. Chociaż istnieje wiele metryk podczas uruchamiania testu, najważniejsze metryki to największa zawartość treściowa (LCP), opóźnienie pierwszego wejścia (FID) i skumulowane przesunięcie układu (CLS).

Ogłosił Google że od maja 2021 r. wskaźniki te staną się częścią sygnałów rankingowych wykorzystywanych do określania pozycji stron internetowych w wynikach wyszukiwania.

Podsumowując, można powiedzieć, że narzędzie Core Web Vitals nie miało za zadanie straszyć webmasterów, ale miało na celu poprawę komfortu korzystania z witryn internetowych.

Farba o największej zawartości (LCP): LCP mierzy czas potrzebny do załadowania największego widocznego obrazu lub bloku tekstu na stronie internetowej. Jeśli największy widoczny tekst lub obraz ładuje się szybko, uważa się, że pozostałe obrazy i tekst będą ładowały się szybko. Wymagany czas ładowania do zaliczenia to 2.5 sekund.

Opóźnienie pierwszego wejścia (FID): FID mierzy interaktywność strony internetowej. Zależy to od tego, ile czasu zajmuje przeglądarce rozpoczęcie przetwarzania procedur obsługi zdarzeń po kliknięciu Twojej witryny przez użytkownika. Nazywa się to powszechnie pierwszym wrażeniem Twojej witryny. Wymagany czas na zaliczenie to milisekund 100.

Skumulowane przesunięcie układu (CLS): CLS mierzy zmianę układu zachodzącą na stronie internetowej. Kiedy strona internetowa ładuje się, a potem nagle coś pojawia się lub znika, a strona musi dostosować się do rozmiaru większego lub mniejszego, mierzone jest to przesunięcie. Jest to okropne dla doświadczenia użytkownika i zgadzam się. Wynik, który powinieneś zaliczyć, to 0.1.

Jak zoptymalizować witrynę pod kątem podstawowych wskaźników internetowych

Wykonaj poniższe kroki, aby zoptymalizować swoją witrynę:

1. Zacznij od szybkiego hosta internetowego

Jeśli masz usługodawcę hostingowego z okropnym czasem reakcji, każda inna rzecz, którą tutaj wymienię, może nie dać pożądanych rezultatów. Im szybciej serwer odpowiada na żądania, tym lepiej.

Dlaczego hosting internetowy z szybkim czasem do pierwszego bajtu (TTFB) jest ważny? Niektórzy będą twierdzić, że TTFB nie ma znaczenia, ale ma. To jest podstawa wszystkiego innego. Jeśli masz użytkowników w miastach z wolnym internetem, szybkość reakcji Twojego dostawcy usług hostingowych będzie miała znaczenie. Każdy usługodawca hostingowy może działać dobrze, jeśli masz użytkowników głównie z miast z superszybkim internetem.

Spróbuj przetestować, jak Twój usługodawca hostingowy zareaguje na 3G lub 2G zamiast 4G. Ponieważ jeśli wielu użytkowników łączy się za pośrednictwem sieci 3G lub 2G, ma to wpływ na Twój wynik w Core Web Vitals. Liczy się więc każda milisekunda. Różnica między uzyskaniem 100 ms w FID a uzyskaniem 101 ms polega na tym, że przy 100 ms zdałeś, ale przy 101 ms nie zdałeś. Jeśli więc ktoś powie Ci, że 1 ms nie ma znaczenia, może się po prostu mylić.

Wybierając A hostingowego, zawsze upewnij się, że centrum danych znajduje się bliżej większości użytkowników Twojej witryny. Możesz znaleźć ich lokalizacje, przeglądając swoje statystyki. Skąd pochodzi większość Twoich użytkowników? Wybierz centrum danych bliżej nich. Im bliżej, tym lepiej.

Osobiście zauważyłem znaczącą zmianę w danych terenowych podstawowych wskaźników internetowych witryny internetowej po zmianie dostawcy usług hostingowych. Nie zrobiłem nic więcej.

Jeśli szukasz szybkiego usługodawcy hostingowego, istnieje wiele rekomendacji, które kierują się wyłącznie tym Spółki stowarzyszone bez szczerości. Jeśli korzystasz z WordPressa i możesz sobie na to pozwolić, gorąco polecam Kinsta. Są najlepsze dla WordPressa. Jeśli potrzebujesz czegoś tańszego lub nie korzystasz z WordPressa to Cloudways jest również bardzo skuteczny.

2. Użyj lekkiego i zoptymalizowanego pod kątem szybkości motywu

Ta wskazówka jest szczególnie przydatna dla niekodujących, a nawet tych, którzy mają mniej czasu. Zwłaszcza jeśli używasz WordPressa, w którym jest tak wiele opcji, upewnij się, że używasz lekkiego i zoptymalizowanego pod kątem szybkości motywu.

Ponieważ motyw jest jak szkielet Twojej witryny, jeśli szkielet zostanie uszkodzony, wówczas uszkodzona zostanie także treść. To jest to samo.

Istnieje długa lista najlepszych praktyk, których powinieneś szukać w temacie. Niektóre z najczęstszych złych praktyk obejmują nadmierne uzależnienie od JQuery, ładowanie zbyt wielu CSS/JS, gdy nie są potrzebne, duży rozmiar motywu i nie tylko. Zawsze możesz użyć narzędzia takiego jak Żółte laboratoria, aby przetestować wersję demonstracyjną.

Jeśli używasz WordPressa, możesz sprawdzić listę najszybsze motywy WordPress.

3. Zoptymalizuj swoje obrazy

Obrazy są fajne. Sprawiają, że treść jest tak atrakcyjna. Mogą jednak stanowić obciążenie, jeśli nie zostaną zoptymalizowane. Posiadanie dużych obrazów, takich jak 3 MB, z pewnością wpłynie na szybkość. A jeśli te obrazy są widoczne, gdy Twoja witryna jest odwiedzana przed przewijaniem, z pewnością będą miały wpływ na Twoje wskaźniki LCP.

Prawda jest taka, że ​​niezoptymalizowane obrazy zwiększają rozmiar Twojej strony. Im większy rozmiar strony, tym dłużej trwa ładowanie.

Osobiście wolę optymalizować każdy obraz przed jego przesłaniem. Nie korzystam z zewnętrznych usług optymalizacji obrazu. Jeśli jednak używasz WordPressa lub podobnego CMSIstnieją wtyczki oraz rozwiązania umożliwiające automatyczną optymalizację obrazów. Istnieją również rozwiązania w chmurze, niezależnie od tego, z czego korzystasz.

4. Usuń lub zmniejsz rozmiar obrazów tła

Obrazy tła są zwykle bardzo duże. Może też spowolnić czas ładowania, ponieważ należy go najpierw załadować, zanim zostanie wyświetlona znacząca treść.

Możesz całkowicie usunąć obraz tła, aby mieć szybszą witrynę. Jeśli są tak ważne, rozważ optymalizację ich do możliwie najmniejszego rozmiaru lub użycie wzorów zamiast obrazów.

5. Użyj pamięci podręcznej przeglądarki

Jeśli masz wielu lojalnych czytelników, powinieneś rozważyć buforowanie przeglądarki. Gdy użytkownik odwiedzi Twoją witrynę po raz pierwszy, przeglądarka zapisze tę witrynę w pamięci podręcznej. Przy każdej kolejnej wizycie ładuje się natychmiast. Może to znacznie poprawić FID i LCP już od drugiej wizyty.

W przypadku użytkowników WordPressa większość wtyczek buforujących może pomóc w osiągnięciu tego celu.

6. Zminimalizuj JavaScript i odłóż nieużywany JavaScript

Chociaż JavaScript jest niesamowity, często blokuje renderowanie. Oznacza to, że może to mieć wpływ na czas ładowania i ostatecznie na FID.

Spróbuj zminimalizować JavaScript, usuwając białe spacje i komentarze, aby zmniejszyć rozmiar pliku. Upewnij się także, że odłożyłeś niekrytyczny JavaScript. To powinno poprawić Twój FID.

Dla użytkowników WordPressa dostępne są wtyczki takie jak Autoptimize, WP Rocket i inne, które mogą to zrobić za Ciebie.

7. Ustaw atrybut rozmiaru AdSense

Jeśli korzystasz z AdSense w swojej witrynie i zmagasz się z CLS, może to rozwiązać wszystkie Twoje problemy. U mnie to zadziałało i u Ciebie powinno.

Jeśli masz jednostkę reklamową blisko nagłówka, która jest widoczna podczas wizyty użytkownika, jednym z problemów jest to, że reklama może nie zostać załadowana natychmiast. Może się załadować po załadowaniu strony, a kiedy to nastąpi, nastąpi zmiana w układzie. Jest to bardzo częste w przypadku responsywnych jednostek reklamowych. W takiej sytuacji nie da się przejść metryki CLS.

Najlepszym sposobem na poradzenie sobie z tym jest niewielka edycja kodu AdSense. Nie martw się, jest to bardzo uzasadnione. Wystarczy określić atrybut rozmiaru reklamy, zwłaszcza wysokość. Gdy to zrobisz, nie będziesz już zauważać zmiany układu podczas ładowania reklamy.

Poniżej znajduje się przykład responsywnej jednostki reklamowej, której użyłem na moim blog tuż pod nagłówkiem. Zamieniłem identyfikator wydawcy i boks reklamowy na XXXXXX. Zauważyłem, że dodałem atrybut wysokości (min-height: 300px). W chwili, gdy to zrobiłem, wszystkie problemy z CLS zniknęły na zawsze.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Header ad -->
<ins class="adsbygoogle"
     style="display:block; min-height: 300px"
     data-ad-client="ca-pub-xxxxxxxxxxxxxx"
     data-ad-slot="xxxxxxxxxx"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

Polega to na zarezerwowaniu tego rozmiaru na stronie. Zatem za każdym razem, gdy pojawiają się reklamy, nie następuje zmiana układu, ponieważ rozmiar został już ustawiony.

8. Ustaw atrybut rozmiaru dla swoich obrazów i innych multimediów

Podobnie jak w przypadku reklam, obrazy i inne media mogą powodować zmiany w układzie, gdy są ładowane w Twojej witrynie. Być może po prostu coś czytasz, obraz się ładuje i nagle następuje zmiana układu, to, co czytasz, jest poza zasięgiem wzroku i widzisz tylko coś innego lub nawet przez pomyłkę klikasz coś innego.

Możesz tego wszystkiego uniknąć, ustawiając atrybut rozmiaru dla plików multimedialnych. Twój wskaźnik CLS będzie zadowolony, że to zrobiłeś.

9. Leniwe ładowanie obrazów.

Być może widziałeś porady dotyczące PageSpeed ​​Insight odłóż obrazy poza ekranem. Oznacza to po prostu leniwe ładowanie obrazów.

Leniwe ładowanie polega na zmniejszeniu rozmiaru strony, a także skróceniu czasu ładowania strony podczas wizyty użytkownika. Co jest dobre dla wskaźników CWV.

Pomoże to w szczególności ulepszyć LCP.

10. Zoptymalizuj CSS, minimalizując i generując krytyczny CSS

CSS sprawia, że ​​witryna wygląda fajnie, ale duży plik CSS może stanowić duży problem, ponieważ opóźnia renderowanie strony użytkownikowi.

Kiedy użytkownik odwiedza Twoją witrynę, przeglądarka w normalny sposób opóźnia renderowanie Twojej strony internetowej użytkownikowi do czasu załadowania, przeanalizowania i wykonania wszystkich CSS, o których mowa w nagłówku Twojej strony internetowej. Jeśli masz duży plik CSS, może to stanowić duży problem. Spowolni to Twoją witrynę.

Krytyczny CSS może pomóc, ładując tylko ten CSS, który jest niezbędny do załadowania strony. Podczas gdy resztę CSS można ładować asynchronicznie.

Pomocne może być także minimalizowanie CSS poprzez usuwanie białych spacji i komentarzy w celu zmniejszenia rozmiaru pliku.

Możesz również usuń nieużywany CSS. Jeśli usługa, z której korzystasz, wypycha nieużywane CSS, możesz je bezpiecznie usunąć.

Jeśli korzystasz z WordPressa, istnieją wtyczki takie jak WP Rocket, LiteSpeed ​​Cache, FlyingPress i inne, które mogą Ci w tym pomóc.

11. Wdróż inteligentne ładowanie AdSense

Ta metoda może prawie całkowicie wyeliminować wszystkie wyzwania, jeśli za spowolnienie Twojej witryny odpowiada AdSense.

Chodzi o inteligentne ładowanie AdSense. AdSense nie zostanie załadowany, dopóki użytkownik nie wykona jakiejś czynności, np. przewinięcia lub kliknięcia. Spowoduje to znaczne skrócenie czasu ładowania i wszystkich podstawowych funkcji sieciowych, na które ma wpływ AdSense.

Istnieje wiele wtyczek WordPress, które mogą Ci w tym pomóc, przykładami są WP Rocket i Flying Scripts. O ile wiem, ta metoda nie narusza zasad Google AdSense.

Uwaga: Chociaż ta metoda może pomóc poprawić postrzeganą szybkość i wyniki strony, może mieć wpływ na Twoje przychody z AdSense. Polecam przeprowadzić eksperyment i przekonać się czy warto

12. Jeśli możesz, użyj czcionki System Stack

Czcionki wydłużają czas ładowania dowolnej witryny internetowej. W przypadku stron internetowych niezawierających obrazów blok tekstowy może odpowiadać za ocenę LCP. W takim przypadku czcionka będzie miała bezpośredni wpływ na wynik LCP.

Chociaż czcionki Google i Font Awesome są stale udoskonalane, użycie czcionek stosu systemowego zapewnia znaczną poprawę. Chociaż nie tak fantazyjne, w zależności od urządzenia.

13. Użyj CDN

Jeśli masz użytkowników z różnych części świata, użycie a CDN może pomóc poprawić szybkość i pośrednio wskaźniki Core Web Vitals.

CDN w prosty sposób tworzy wiele kopii Twojej witryny i przechowuje je w różnych punktach obecności (POP) w różnych częściach świata. Gdy ktoś zażąda Twojej witryny, wyświetli ona Twoją witrynę z najbliższej lokalizacji.

Na przykład, jeśli Twoja witryna jest hostowana w Stanach Zjednoczonych i masz gościa z Wielkiej Brytanii, zamiast pobierać witrynę ze Stanów Zjednoczonych, CDN będzie obsługiwać Twoją witrynę z Wielkiej Brytanii. Efektem tego będzie szybka dostawa. Prędkość.

Możesz sprawdzić najlepsze sieci CDN tam.

14. Skonfiguruj wstępne pobieranie DNS

Jeśli w zakresie dostarczania swojej witryny korzystasz z usługi zewnętrznej, takiej jak CDN, może być konieczne skonfiguruj wstępne pobieranie DNS aby zminimalizować opóźnienia spowodowane wyszukiwaniem DNS.

Prefetching DNS spowoduje wstępne pobranie DNS przed jego wywołaniem. Aby ładował się natychmiast po ostatecznym wywołaniu.

15. Optymalizuj skrypty innych firm

Sprawdź, czy niektóre usługi, z których korzystasz w Twojej witrynie, nie dodają skryptów innych firm, które mogą spowalniać Twoje witryny.

Możesz zastąpić rozwiązanie żądaniami stron trzecich, spowalniając Twoją witrynę, lepszym rozwiązaniem.

Jeśli chodzi o Google AdSense, kolejny skrypt innej firmy, niewiele możesz zrobić. Najlepszą praktyką jest użycie maksymalnie 3 reklam na jednej stronie. Unikaj dopasowanych treści, ponieważ zapewniają one niski dochód, ale wydłużają czas ładowania.

16. Usuń AdSense znad zagięcia

Ta rada opiera się na eksperymentach. Jeśli wszystkie dane w raporcie konsoli wyszukiwania są dobre, z wyjątkiem LCP, najpierw upewnij się, że obrazy i czcionki są zoptymalizowane. Jeśli są zoptymalizowane, a Ty nadal nie udaje Ci się LCP, przyczyną może być AdSense.

Jeśli możesz sobie na to pozwolić, usuń AdSense z górnej części strony na miesiąc i zobacz, czy problem zniknie.

Jeśli nie chcesz go usunąć, możesz opóźnić go ręcznie lub za pomocą wtyczki takiej jak Flying Scripts.

17. Przełącz na AMP

AMP oznacza przyspieszone strony mobilne. Ideą AMP jest optymalizacja stron internetowych, aby ładowały się szybciej na urządzeniach mobilnych. I oczywiście AMP open source projekt został rozpoczęty przez Google.

Chociaż AMP był pierwotnie przeznaczony do przyspieszania stron mobilnych, może również przyspieszać strony na komputery stacjonarne.

Strony AMP są niezmiennie szybsze niż strony mobilne lub stacjonarne, czasami o ponad 100%, zgodnie z naszymi obserwacjami.

Jeśli jedyną strategią zarabiania na Twojej witrynie jest Google AdSense, możesz rozważyć przejście całej witryny na AMP. Osobiście zauważyłem, że na blogu, którego jestem właścicielem, AdSense na stronach AMP czasami generuje więcej konwersji niż na urządzeniach mobilnych i komputerach stacjonarnych!

Podsumowanie

Podstawowe informacje o sieci Web mogą pomóc Ci ulepszyć Twoją witrynę internetową dla użytkowników, nie tylko dla Google. Bardzo często zdarza się, że masz dobry wynik testu laboratoryjnego, ale zły wynik danych terenowych.

Dzieje się tak ze względu na charakter Twoich użytkowników. Jeśli większość Twoich użytkowników pochodzi z miejsc o wolnym Internecie, być może wykonałeś dobrą robotę optymalizując, ale nadal nie udaje Ci się uzyskać danych terenowych.