Jak sprawdzić szybkość ładowania elementów strony wpływających na SEO?
4 min
Jak sprawdzić szybkość ładowania elementów strony?
4 min
Jak sprawdzić szybkość ładowania elementów strony?
Na skróty
Współczesny internet jest pełen nowoczesnych technologii usprawniających korzystanie ze stron www. W trakcie użytkowania mamy styczność z setkami różnych innowacji i estetycznie zaprojektowanych interfejsów. Aby jednak strona zachęcała do kolejnej wizyty, musi umożliwiać szybkie przełączanie się pomiędzy jej podstronami. Szybkość ładowania elementów strony jest kluczowa dla pierwszego dobrego wrażenia, utrzymania wysokiej pozycji w wyszukiwarce i zadowolenia odwiedzających. Z tego artykułu dowiesz się jak sprawdzić szybkość strony, które elementy mają kluczowe znaczenie oraz poznasz znaczenie tego aspektu w kontekście SEO, o którym więcej możesz przeczytać tutaj.
Wpisanie adresu strony www w pasek adresu i zatwierdzenie swojego wyboru prowadzi do wysłania pewnych żądań. Te są interpretowane przez serwer, po czym w przeglądarce ukazuje się zawartość zwrotna. Z reguły są to dokumenty HTML, skrypty JavaScript oraz pliki graficzne. Na podstawie danych w nich zawartych, renderowana jest strona, której czas ładowania jest zależny od kilkunastu czynników.
Co ma największy wpływ na szybkość strony? Najistotniejszy jest stan samego serwera. Jeśli nie jest on w stanie obsłużyć żądań użytkownika bądź jego przepustowość jest zbyt niska, dochodzi do przeciążenia, co kończy się komunikatem o błędzie lub bardzo powolnym ładowaniem poszczególnych elementów. Kolejnym czynnikiem jest zawartość, która jest pobierana z serwera. Kluczowe znaczenie ma wielkość danych, liczba wykonanych żądań, przekierowania, a także formaty plików. Inne zmienne to sposób ładowania strony (np. z użyciem cache, z powolnym ładowaniem obrazków lub ładowanie po załadowaniu skryptów JS), kompresja plików czy wykorzystanie tzw. systemu CDN. To samo tyczy się komputera, z którego pobierana jest strona. Całość powinna być dostosowana zarówno do sieci mobilnych, jak i kablowych łącz naszych odbiorców (również tych powolnych).
Wejście na stronę i samodzielna ocena jej szybkości nie może być trafna z dwóch powodów. Po pierwsze każde łącze jest inne, co uniemożliwia uzyskanie obiektywnego wyniku. Po drugie nasza przeglądarka zapamiętuje dużą część zawartości w plikach cache, przez co elementy już przy drugim załadowaniu wyświetlają się znacznie szybciej. Sprawdzanie szybkości strony „na oko” jest nietrafnym pomysłem i powinno odbywać się z użyciem dostępnych narzędzi diagnostycznych. Jak dokonać ogólnego przeglądu? Dokładne wyniki uzyskamy korzystając z darmowych narzędzi dla deweloperów. Te są dostępne aż w trzech miejscach: na stronie PageSpeed Insights, w panelu Google Analytics (raport: zachowanie -> szybkość witryny -> przegląd) oraz w przeglądarce Google Chrome (kliknij F12 -> zakładka network -> wybierz typ łącza i przeładuj stronę). Alternatywą jest test oferowany przez GTmetrix i Pingdom. We wszystkich przypadkach otrzymujemy listę z informacjami na temat zasobów, które mają obciążający wpływ na wydajność naszej witryny. Nam jednak chodziło o ogólny test, dlatego patrzmy na liczbę w skali od 0 – 100.
Powolne ładowanie się grafik jest obciążające z punktu doświadczenia użytkownika. Narzędzia takie jak Pingdom czy PageSpeed Insights wskazują, które z nich są najbardziej problematyczne, lecz nie pozwalają na wyłączną analizę szybkości ładowania się grafik. Same informacje na temat plików graficznych uzyskamy korzystając z narzędzia Website Speed Test od firmy Cloudinary. Po przejściu na stronę usługi wpisujemy adres wybranej podstrony i klikamy przycisk „analyze”. Odczekujemy kilkanaście sekund i zaczynamy analizę otrzymanego raportu. Na samej górze wyświetla się litera określająca ogólną wydajność obrazków. Zaraz obok niej widoczne jest porównanie obecnych obrazków do ich optymalnej – skompresowanej wersji. Nieco niżej znajduje się lista wszystkich przeanalizowanych elementów. Znów widzimy symulację tego, jak wyglądałaby sytuacja po wprowadzeniu zmian. Proponowane są nowe formaty, wymiary optymalne dla szablonu strony oraz sposoby kompresji. Dowiadujemy się też czy pliki są odpowiednio przygotowane dla sieci web. Czy zawierają nadmiar metadanych? Czy są w odpowiedniej przestrzeni/głębi kolorów? Warto sprawdzić, bo taka sytuacja może się zdarzyć zarówno gdy korzystamy z obrazków z zewnętrznego źródła lub kiedy pliki zapisaliśmy w programie graficznym w sposób niedostosowany do internetowych standardów.
Kiedy chcemy poprawić szybkość witryny, stajemy przed zadaniem weryfikacji wszystkich jej elementów. Dokonamy tego z użyciem narzędzi, które analizują stronę z uwzględnieniem technicznego punktu widzenia. Najpopularniejszą usługą do mierzenia jest PageSpeed Insights, gdzie dostępne są ogólne dane laboratoryjne (w tym tzw. web vitals), a zaraz pod nimi informacje na temat potencjalnych elementów do poprawy. Narzędzie przeprowadza szereg audytów, po których zaliczeniu (lub nie), otrzymujemy wytyczne do przeprowadzenia samodzielnej diagnostyki. Uwzględniona zostaje wersja na urządzenia mobilne i komputery stacjonarne. Pomimo swojej uniwersalności, nie wszyscy uznają wyniki z PageSpeed Insights za najtrafniejsze. Nie ma tam bowiem możliwości wyboru lokalizacji, przeglądu poszczególnych żądań czy przejrzenia plików z podziałem na wykorzystywane do renderingu domeny. Zapewnia to już test szybkości PingDom, który posiada bardziej przejrzysty interfejs, oferując przy tym całodobowy monitoring z opcją mierzenia up-time’u serwera i szczegółowego wykrywania przyczyn spowolnień. Jest to aktualnie najbardziej rozbudowana aplikacja, czego dowodem jest dedykowana edycja na smartfony, raporty z poszczególnych testów i alerty np. w kwestii opóźnień na podstronie z formularzem kontaktowym.
Spowolnienie Twojej strony może być spowodowane na wiele sposobów. Jeśli masz już dobry hosting i do ładowania plików używasz CDN (np. Cloudflare), a nadal obserwujesz niezadowalające prędkości, to czas przyjrzeć się im bliżej. Przeanalizuj pliki graficzne, ładowane czcionki, liczbę reklam, ilość niepotrzebnego kodu, nadmiar żądań i wykorzystywane technologie. Typowym winowajcą jest złe podejście do kwestii grafiki, gdzie używamy nieoptymalnych formatów, zbyt wysokich rozdzielczości i stronimy od ikon. Częstym problemem jest nadmierna liczba żądań HTTP, którą zredukujemy pozbywając się nadmiernych plików. Przy okazji warto zminifikować pliki CSS i zacząć asynchronicznie ładować JavaScript. Całkiem duży wpływ na szybkość strony ma wykorzystanie pamięci podręcznej (cache), która przy kolejnych przeładowaniach strony zapewni ładowanie tych samych elementów z lokalnego dysku, a nie będzie ich pobierać od nowa z serwera.
SEO, czyli optymalizacja dla wyszukiwarek internetowych to proces, którego celem jest przekonanie wyszukiwarki o tym, że strona jest godna wysokich pozycji. Google wykorzystuje algorytmy bazujące na maszynowym uczeniu się, przez co z czasem zaczyna postrzegać wybrane czynniki jako decydujące przy pozycjonowaniu. Jednym z nich jest właśnie szybkość strony, jednak można uznać go za pośredni. Dlaczego? Chodzi o dobre doświadczenie użytkownika oraz to, co jest w stanie zaoferować konkurencja. Większość serwerów i stron dziś jest na tyle szybka, aby wyświetlić całą stronę w ciągu 2 – 3 sekund. Dłuższy czas ładowania wprawia ludzi w zakłopotanie, co skłania ich do wyjścia ze strony i przejrzenia kolejnego wyniku. Łatwo uświadomić sobie istotę szybkości strony w SEO. Zadowolony użytkownik, który decyduje się pozostać na stronie to dla wyszukiwarki sygnał, aby ta lepiej pozycjonowała stronę.
