Speed ​​Kills: Jak skontrolować i poprawić szybkość i wydajność witryny

Opublikowany: 2017-10-17

Więc zrobiłeś to wszystko SEO i optymalizację konwersji na swojej stronie WordPress.

Otrzymujesz linki zwrotne, Twoje treści są świetne, Twoje strony są zoptymalizowane, przyciągasz recenzje, masz przekonujące wezwanie do działania i masz wiele dokładnych wykazów firm. Twoja strona jest wspaniała. Dzieło sztuki, naprawdę!

...ale igła się nie porusza. Czemu? Wyjaśnienie może być prostsze niż myślisz. Twoja witryna prawdopodobnie działa wolno.

Niska prędkość witryny jest w rzeczywistości bardzo powszechna. Nawet zespół tutaj w Vendasta doświadczył tego problemu z pierwszej ręki. Od jakiegoś czasu borykamy się z problemami z szybkością naszej witryny i poczyniliśmy postępy... ale o tym wszystkim opowiem później.

Cały czas widzę ten problem wśród marketerów i agencji marketingowych. To my mamy „ogarnąć” i być pierwszymi, którzy stosują najlepsze praktyki, takie jak optymalizacja szybkości strony internetowej. Jednak narzędzie Google PageSpeed ​​Insights Tool mówi inaczej o wielu naszych wspaniałych, zoptymalizowanych pod kątem SEO, wypełnionych treścią witrynach internetowych.

Wszyscy musimy działać lepiej.

Dlatego teraz to czytasz, więc przejdźmy do rzeczy!


Spis treści

Co to jest szybkość strony?

Jak określić szybkość i wynik strony

Dlaczego szybkość strony ma znaczenie?

1. Szybkość zabija UX

2. Szybkość zabija SEO

3. Szybkość zabija konwersje

Jak sprawić, by Twoja witryna ładowała się szybciej? 8 Taktyka

4 Studia przypadków dotyczące szybkości witryny

Jak przeprowadzić audyt i optymalizację szybkości witryny

1. Uzyskaj linię bazową do wykresów wyników

2. Wykonaj 8 kroków

3. W razie potrzeby wezwij pomoc

4. Bądź zaangażowany w rozwój szybkości witryny

Jak wykorzystać szybkość witryny do zwiększenia sprzedaży


Co to jest szybkość strony?

Szybkość strony to czas potrzebny do pełnego załadowania zawartości strony internetowej. W świecie, w którym ludzie oczekują natychmiastowych rezultatów, szybciej znaczy lepiej.

Jak wynika z ankiet przeprowadzonych przez Akamai i Gomez.com, prawie połowa użytkowników sieci spodziewa się, że witryna załaduje się w ciągu 2 sekund lub mniej, i ma tendencję do opuszczania witryny, która nie ładuje się w ciągu 3 sekund.

Powiązana lektura: 58 upiornych statystyk dla stron internetowych

Tak więc 3 sekundy to minimalna prędkość, którą tolerowałby przeciętny użytkownik. Czy typowa strona internetowa sprosta temu zadaniu? Firma Pingdom wykorzystała swoich własnych klientów jako źródło danych i stwierdziła, że ​​dla nich odpowiedzią było stanowcze NIE.

Wśród klientów Pingdom średni czas ładowania stron 3Mb wynosił 5 sekund. Zdecydowanie za wolno.

Standardy, których wiele osób używało do czasu ładowania strony, pochodzą z badania przeprowadzonego przez Geoffa Kenyona, w którym porównuje szybkość witryny z resztą sieci:

  • jeśli Twoja witryna ładuje się w 5 sekund, jest szybsza niż około 25% sieci
  • jeśli Twoja witryna ładuje się w 2,9 sekundy, jest szybsza niż około 50% sieci
  • jeśli Twoja witryna ładuje się w 1,7 sekundy, jest szybsza niż około 75% sieci
  • jeśli Twoja witryna ładuje się w 0,8 sekundy, jest szybsza niż około 94% sieci

Jak więc określić, w jaki sposób Twoja witryna się układa?


Jak określić szybkość i wynik strony

Oto jak zmierzyć, jak Twoja witryna wypada w porównaniu z obecnymi oczekiwaniami użytkowników, o których mówiliśmy powyżej:

  1. Przejdź do raportów Google Analytics dotyczących szybkości witryny w Twojej witrynie. Dzięki temu dowiesz się, jak działała Twoja witryna w różnych okresach i jak szybko wczytywała się każda z Twoich stron.
  2. Wprowadź adres URL swojej witryny w narzędziu Google PageSpeed ​​Insights. Otrzymasz w ten sposób kartę raportu dotyczącą szybkości działania Twojej witryny na urządzeniach mobilnych i komputerach. Raport zawiera kilka zalecanych działań, które możesz podjąć, aby poprawić szybkość swojej witryny.
  3. Sprawdź test szybkości witryny Pingdom, aby dowiedzieć się, jaka jest prędkość, pozycja i procent szybciej niż średnia testowanych witryn Pingdom
  4. GTMetrix zapewni kompleksowy wgląd w stan optymalizacji szybkości Twojej witryny.

Uwaga: Nie zastanawiaj się, gdy widzisz różne czasy prędkości w Pingdom i Gtmetrix. Ponieważ Pingdom pokaże Ci czas ładowania (Czas potrzebny do wyświetlenia pierwszego wyniku Twojej witryny - to liczy się Google i Ty też powinieneś), a GTmetrix pokaże Ci pełny czas ładowania (Czas potrzebny do wyświetlenia pełnej strony z jej zapełnieniem) działająca funkcjonalność). Aby lepiej zrozumieć, zawsze dobrze jest zobaczyć wodospad prędkości z obu narzędzi.

W ramach audytu szybkości witryny (bardziej szczegółowo omówię to poniżej) użyjesz tych narzędzi do śledzenia postępów w optymalizacji.

Powiązane lektury: Jak przyspieszyć witrynę mobilną WordPress


Dlaczego szybkość strony ma znaczenie?

Wypełnienie luki między oczekiwaniami użytkowników (2 sekundy) a średnim czasem ładowania witryny (5 sekund) to cel optymalizacji szybkości strony i taktyki, którą przedstawimy później. Ale dlaczego dokładnie szybkość strony ma znaczenie? Sprowadza się to do 3 głównych powiązanych ze sobą powodów:

1. Szybkość zabija UX

Doświadczenie użytkownika jest prawdopodobnie najważniejszym powodem, dla którego powinieneś dbać o szybkość witryny, więc zaczniemy tutaj.

Ludzie nie mają już cierpliwości do wolno ładujących się stron internetowych. Na początku samo połączenie z Internetem wymagało tolerancji, która już nie istnieje.

Czy jesteś wystarczająco duży, aby pamiętać ten słodki dźwięk?

Obecnie ludzie są cały czas online i masz maksymalnie 3 sekundy na wyświetlenie swojej strony, w przeciwnym razie ich nie będzie. Więcej niż 3 sekundy powoduje złe wrażenia użytkownika, a poprzeczka będzie się tylko podnosić w przyszłości.

W swoim wystąpieniu na temat „10 złotych zasad odnoszących sukcesy aplikacji internetowych” przedsiębiorca i bloger Fred Wilson zauważa, że:

„Szybkość jest najważniejszą cechą. Jeśli twoja aplikacja jest powolna, ludzie nie będą jej używać. Widzę to bardziej w przypadku zwykłych użytkowników niż w przypadku zaawansowanych użytkowników. Myślę, że zaawansowani użytkownicy czasami mają trochę życzliwego spojrzenia na wyzwania związane z tworzeniem naprawdę szybkich aplikacji internetowych i być może są gotowi z tym żyć, ale kiedy patrzę na moją żonę i dzieci, to oni są moim głównym nurtem świat. Jeśli coś działa wolno, po prostu ich nie ma”.

Najprostszym sposobem, aby o tym pomyśleć, jest sposób, w jaki poruszasz się po stronach internetowych i jakie są Twoje oczekiwania wobec większości witryn. Czy siedzisz tam i tolerujesz wolne czasy ładowania? Jakie jest Twoje wrażenie na temat witryny, która ładuje się w nieskończoność?

Powiązana lektura: Przyjazny dla Noobów 10-etapowy przewodnik po tworzeniu witryn internetowych dla małych firm

2. Szybkość zabija SEO

Doświadczenie użytkownika jest w rzeczywistości siłą napędową wpływu szybkości witryny na SEO.

Edwin Toonen z Yoast wyjaśnia,

„Najnowsze badania Google pokazują, że szansa na odrzucenie wzrasta o 32%, gdy czas ładowania strony zmienia się z 1 s na 3 s. Od 1 do 5 sekund zwiększa szansę do 90%, a jeśli ładowanie witryny trwa do 10 sekund, szansa na odrzucenie wzrasta do 123%. To jest niesamowite. Dla wyszukiwarek lepsze wyniki i wydajność są oznaką zdrowej witryny, która podoba się klientom i dlatego powinna być nagradzana wyższym rankingiem”.

Chociaż Google nie spieszy się z oficjalnym ujawnieniem, czy powolne strony internetowe zostaną obniżone w rankingu, wydaje się, że te dni nadchodzą. Musisz upewnić się, że Twoja witryna i witryny, którymi zarządzasz, są gotowe.

3. Szybkość zabija konwersje

Wpływ szybkości Twojej witryny na konwersje jest tym, co powinno naprawdę przykuć Twoją uwagę. Jak możesz przenosić ludzi przez lejek, jeśli każdy krok trwa wieczność? Twoi super-fani to zrobią, ale ci nowi, niezdecydowani ludzie, którzy mają skłonność do wyrzutów sumienia, odbiją się.

Na przykład firma SOASTA niedawno przeprowadziła badanie na jednym ze swoich klientów mPulse, wiodącym sklepie internetowym, który cieszy się znaczną (4,5 mln sesji) ruchem mobilnym.

Oto ich kluczowe ustalenia:

  1. Jeśli chodzi o konwersje, najlepszy wynik w zakresie wydajności wyniósł 2,4 sekundy
  2. Strony, które były tylko o sekundę szybsze, odnotowały wzrost współczynnika konwersji o 27%.
  3. Po 4,2 sekundy średni współczynnik konwersji spadł poniżej 1%
  4. Po 6 sekundach współczynnik konwersji z urządzeń mobilnych zaczyna spadać

Wykres przedstawiający konwersje z mobilnego studium przypadku

Źródło obrazu: SOASTA

Implikacje są dość jasne. Powolne ładowanie strony obniża współczynnik konwersji. Tak więc rozumowanie dedukcyjne w stylu Sherlocka wskazywałoby, że skupienie się na zwiększeniu szybkości witryny powinno zwiększyć współczynnik konwersji!

Zobaczmy, czy możemy to zrobić.


Jak sprawić, by Twoja witryna ładowała się szybciej? 8 Taktyka

Przyspieszenie witryny niekoniecznie będzie proste. Jeśli masz małą, lekką witrynę, być może będziesz musiał wypróbować kilka taktyk z tej listy.

Jednak duże, starsze witryny z dużą ilością kodu i treści mogą wymagać pewnej wytrwałości i wdrożenia kilku taktyk z poniższej listy.

Oto od czego zacząć:

przekładnia prędkości

1. Wykorzystaj pamięć podręczną przeglądarki:

Podczas odwiedzania witryn przeglądarka często zapisuje strony w pamięci podręcznej, aby przyspieszyć ładowanie.

Pamięć podręczna przeglądarki przechowuje pliki zasobów strony internetowej na komputerze lokalnym, gdy użytkownik odwiedza stronę internetową, więc wykorzystanie pamięci podręcznej przeglądarki polega na instruowaniu przeglądarek, jak należy obchodzić się z ich zasobami.

Sytuacja może ulec spowolnieniu, gdy odpowiedź z serwera nie zawiera nagłówków buforowania lub jeśli określono, że zasoby mają być buforowane tylko przez krótki czas.

Wykorzystanie buforowania znacznie przyspieszy ładowanie stron dla stałych użytkowników, podobnie jak inne strony, które współużytkują te same zasoby.

Uwaga: Maddy Osman, strateg ds. treści SEO, zauważa, że ​​„W3 Total Cache świetnie się do tego nadaje, ale jest zablokowany na niektórych hostach (takich jak GoDaddy). Konfiguracja wymaga fachowej ręki, aby nie zepsuć witryny”.

Oto jak to zrobić

przekładnia prędkości 2. Zoptymalizuj obrazy:

Jeśli obrazy ładują się szybciej, Twoja witryna ładuje się szybciej, kropka. Google zauważa, że ​​„... obrazy często stanowią większość pobranych bajtów na stronie. W rezultacie optymalizacja obrazów może często przynieść jedne z największych oszczędności bajtów i poprawę wydajności”.

Oznacza to, że możesz uzyskać znaczną poprawę, gdy obrazy na Twoich stronach można zoptymalizować, aby zmniejszyć rozmiar pliku bez znaczącego wpływu na ich jakość wizualną.

Oto jak to zrobić

przekładnia prędkości

3. Minifikuj HTML, CSS i JavaScript:

Minifikacja usuwa wszelkie niepotrzebne znaki, które nie są wymagane do wykonania kodu.

Źródła nadmiarowych danych, które można usunąć, obejmują komentarze do kodu i formatowanie, usuwanie nieużywanego kodu, stosowanie krótszych nazw zmiennych i funkcji oraz wiele innych.

Oto jak to zrobić

przekładnia prędkości

4. Włącz kompresję gzip:

Kompresja Gzip drastycznie zmniejsza rozmiar plików wysyłanych z Twojego serwera, gdy ktoś odwiedza Twoją witrynę. To znacznie przyspieszy sprawę.

Według GTMetrixa,

„Powodem, dla którego gzip działa tak dobrze w środowisku internetowym, jest to, że pliki CSS i HTML zawierają dużo powtarzającego się tekstu i mnóstwo białych znaków. Ponieważ gzip kompresuje typowe ciągi znaków, może to zmniejszyć rozmiar stron i arkuszy stylów nawet o 70%!”

Oto jak to zrobić

przekładnia prędkości

5. Skróć czas odpowiedzi serwera:

Czas odpowiedzi serwera to czas potrzebny serwerowi WWW na odpowiedź na żądanie przeglądarki. Jest to kluczowa kwestia do rozwiązania, ponieważ jeśli czas odpowiedzi serwera jest długi, strony będą wyświetlać się wolno, bez względu na to, jak zoptymalizowane są strony pod kątem szybkości.

Google mówi, że powinieneś skrócić czas odpowiedzi serwera poniżej 200 ms. Więc jak to zrobić?

Oto jak to zrobić

przekładnia prędkości

6. Unikaj przekierowań na strony docelowe:

Twoja witryna może naprawdę zwolnić, gdy masz więcej niż jedno przekierowanie z podanego adresu URL na ostateczną stronę docelową. Uruchamia to pętlę przekierowań, której przetworzenie wymaga czasu.

Oto kilka przykładów przekierowań, które mogą spowolnić działanie:

example.com → m.example.com/home — kara za przejazd w obie strony dla użytkowników mobilnych.
example.com → www.example.com → m.example.com — bardzo wolne działanie na urządzeniach mobilnych.

Oto jak to zrobić

przekładnia prędkości

7. Nadaj priorytet widocznym treściom:

To jest dokładny komunikat, jaki otrzymasz z narzędzia Google PageSpeed, gdy do wyrenderowania zawartości strony w części widocznej na ekranie wymagane są dodatkowe połączenia sieciowe w obie strony.

Ta zawartość „na ekranie” jest tym, co widzisz na komputerze lub urządzeniu podczas odwiedzania strony. Dlatego nadanie priorytetu widocznym treściom jest zaleceniem, aby priorytetowo traktować najważniejsze elementy strony (i szybko) wczytujące się dla użytkowników oraz odkładać drugorzędne elementy strony, takie jak wtyczki udostępniania społecznościowego, javascript analityczny itp.

Oto jak to zrobić

przekładnia prędkości

8. Wyeliminuj JavaScript i CSS blokujące renderowanie w treści widocznej na ekranie:

Zasoby JavaScript i CSS często uniemożliwiają wyświetlenie strony, dopóki nie zostaną w pełni załadowane. Często jest to dobry pomysł, ponieważ przedwczesne wyświetlenie treści powyżej strony zakładki może wyglądać dość groteskowo.

Jest to jednak powszechna wiadomość, którą otrzymasz od Google na temat szybkości witryny, a zajęcie się nią może naprawdę przyspieszyć Twoją stronę o kilka stopni.

Oto jak to zrobić

Uwaga: jest to najtrudniejsza rzecz do naprawienia dla większości ludzi. Istnieją wtyczki wordpress, które po prostu to robią, ale mogą sprawić, że Twoja witryna będzie wyglądać jak Frankenstein przy każdym ładowaniu.


Studium przypadku: przyspieszenie bloga Vendasty

Ikona Vendasty Piszę więc ten post o szybkości witryny, mimo że Vendasta ma 44/100 dla prędkości mobilnej (aktualizacja: mamy 77/100 trzy miesiące później!) i 60/100 dla szybkości komputera.

Zaufaj mi, zdaję sobie sprawę, że tutaj może pojawić się pytanie o wiarygodność ulicy. Jednak w naszej historii jest coś więcej, niż powie ci narzędzie analityczne Google.

W Vendasta włożyliśmy dużo pracy w szybkość naszej witryny, ale najwyraźniej wciąż nie jesteśmy tam, gdzie chcemy. Wprowadziliśmy wiele ulepszeń, ale mamy dużą witrynę z mnóstwem treści, więc nie osiągnęliśmy jeszcze naszego celu 80/100 zarówno dla urządzeń mobilnych, jak i komputerów stacjonarnych.

Jednak nie tylko my borykamy się z szybkością witryny! Wiele znanych witryn internetowych ma takie same wyzwania jak my. W rzeczywistości nawet HubSpot ma również wiele do zrobienia, aby poprawić wydajność swojej witryny, zgodnie z narzędziem Google PageSpeed ​​Insights:

Zrzut ekranu przedstawiający słabe statystyki PageSpeed ​​Insights

To nie jest wezwanie HubSpot do „wystrzelenia strzałów” (szacun!), Używam ich tylko jako przykładu, aby zilustrować, że poprawa szybkości witryny może być wyzwaniem, nawet dla profesjonalistów, i że wszyscy musimy się poprawić, aby sprostać wymaganiom kolejnego pokolenia użytkowników Internetu. Uruchom kilka swoich ulubionych witryn za pomocą narzędzia, a zobaczysz, co mam na myśli!

Jak wspomniałem powyżej, każde ulepszenie, które wprowadzamy w celu przyspieszenia, może mieć wykładnicze wyniki.

Technolog marketingu Vendasta, Adam Bissonnette, zauważa:

„Dużą zmianą dla nas były sprawy po stronie serwera – jesteśmy w wyjątkowej sytuacji, prowadząc naszą witrynę Wordpress w AppEngine (nikt tego nie robi), a dużym wzrostem wydajności było przejście z AppEngine Standard na AppEngine Flex, który był w wersji beta. Zmieniliśmy się również nasza wersja php z 5 na 7, która również pomogła w partii.Aktualizacja php przyniosła własny zestaw problemów, w których niektóre wtyczki już nie działały i musieliśmy sobie z tym radzić przez miesiąc lub dwa, ale szybkość była cenniejsza niż utracona funkcjonalność ”.

Możesz z tego wyciągnąć wniosek, że znalezienie najlepszego rozwiązania dla konkretnej sytuacji jest kluczowe. Może się okazać, że taktyki, które poruszają igłę Twojej witryny, o których nawet tutaj nie wspomnieliśmy!

Przyjrzyj się rozwojowi naszego bloga po rozpoczęciu prac nad przyspieszeniem witryny w maju 2016 r.:

Zrzut ekranu przedstawiający poprawę szybkości witryny Vendasta

Te ulepszenia przygotowały grunt pod wszystkie późniejsze inicjatywy dotyczące treści Vendasta. Od tego czasu skupiliśmy się na tworzeniu dużej ilości dogłębnych treści wysokiej jakości. Bez naszych zbieżnych ulepszeń szybkości witryny jest mało prawdopodobne, że zobaczysz skok ruchu, który wyświetla zrzut ekranu z danymi analitycznymi.

Wydajność będzie się poprawiać tylko wtedy, gdy będziemy nadal optymalizować szybkość naszej witryny i poprawiać komfort użytkowania!

Zabrany klucz Key Takeaway: Nie musisz zdobywać punktów 100/100, aby doświadczyć wzrostu w swojej witrynie.

Jeśli masz 40/100, dokonaj kilku ulepszeń, gdy czas pozwoli i strzelaj do 60/100. Nie wypalaj się strzelając od razu za 100/100!


Studium przypadku: iHeartRaves

Jednorożec w okularach przeciwsłonecznych iHeartRaves iHeartRaves to światowy lider mody festiwalowej, którego misją jest inspirowanie indywidualnej kreatywności i umożliwianie autoekspresji. Łącząc dwie inne siostrzane marki, ich sklepy Shopify zarabiają 20 milionów dolarów rocznie i cztery lata z rzędu pojawiają się na liście Inc. 5000.

Jako witryna eCommerce iHeartRaves jest wyraźnie świadoma konsekwencji finansowych niskiej szybkości i wydajności witryny.

Brandon Chopp, strateg ds. marketingu cyfrowego w iHeartRaves, powiedział mi:

„Jako marka e-commerce zdaliśmy sobie sprawę, że szybkość witryny jest ogromna! Kiedy myślę o konwersjach, myślę o najlepszych sposobach nakłonienia użytkownika do kliknięcia czegoś za pomocą wezwania do działania. Prawda jest taka, że ​​szybsze strony internetowe zawsze wygrywają. Im szybsza jest Twoja witryna, tym bardziej prawdopodobne jest, że użytkownicy dokonają konwersji”.

Brandon wiedział, że musi poprawić szybkość witryny, aby pomóc firmie osiągnąć cele związane ze wzrostem przychodów. Zmierzył się z ulepszeniami prędkości iHeartRaves, stosując następującą taktykę:

  1. Optymalizuj obrazy: Aby zapewnić szybkie ładowanie naszej witryny mobilnej, używamy aplikacji Shopify o nazwie Crush.pics. Dzięki temu wszystkie nasze obrazy są zoptymalizowane pod kątem szybkości witryny przy jednoczesnym zachowaniu jakości obrazu.
  2. Zminimalizuj kod: Podjęliśmy również kroki w celu zminimalizowania całego naszego płynnego kodu i nadania priorytetu kolejności ładowania skryptów, jednocześnie zmniejszając całkowitą liczbę wywoływanych skryptów.
  3. Wyczyść zasoby na stronie: Usunięcie niepotrzebnych zasobów na niektórych stronach przy jednoczesnej redukcji zasobów graficznych na innych pomogło również skrócić czas ładowania witryny. Staramy się zachować równowagę między szybkością a treścią, ponieważ jesteśmy witryną e-commerce. Bardzo ważne jest dla nas, aby jakość obrazu była zgodna z naszymi standardami, przy jednoczesnym zapewnieniu naszym klientom doskonałej obsługi.

Szybkość ładowania strony i wyniki współczynnika odrzuceń naprawdę poprawiły się dzięki tym aktualizacjom: „Od czasu wprowadzenia zmian szybkość naszej witryny spadła z 10,25 do 6,86 sekundy rok do roku (spadek o 65%), a współczynnik odrzuceń spadł o 6%” — wyjaśnia Brandon . „Początkowo wynosił 40,34%, a teraz spadł do 34%.

Te usprawnienia przełożyły się również na wymierne wyniki finansowe iHeartRaves. „Odnieśliśmy korzyści w Google, mając szybką witrynę mobilną, ponieważ nasz współczynnik konwersji wzrastał z roku na rok, w dużej mierze dzięki zmniejszeniu szybkości naszej witryny. Stawiając doświadczenie użytkownika na pierwszym miejscu, udało nam się zatrzymać naszych klientów i ułatwić zakupy”.

Zabrany klucz
Key Takeaway: Należy pamiętać, że szybkość i wrażenia użytkownika idą w parze.

Połączenie tych dwóch czynników może prowadzić do poprawy jednego wskaźnika, który nimi wszystkimi rządzi: Konwersji!


Studium przypadku: poprawa Jubaera w 6 sekund i 40 punktów

Specjalista SEO firmy Vendasta, Jubaer Prodhan, udostępnił przypadek, w którym śledził Google Pagespeed Insight Tool dla swojej własnej witryny i uzyskał kilka niezłych wyników.

Jubaer zauważa: „W moim przypadku mam witrynę Wordpress z czasem ładowania dłuższym niż 8 sekund i wynikiem GPI (Google PageSpeed ​​Insight) równym 43. Zrobiłem następujące rzeczy, aby poprawić szybkość witryny.”:

  1. Optymalizacja obrazu: Jeśli zostanie wykonana poprawnie, może drastycznie zmniejszyć rozmiar i szybkość strony. W moim przypadku rozmiar strony spadł z 3 MB do 1,6 MB. Użyta wtyczka: ShortPixel Image Optimizer (Możesz także optymalizować obrazy za pomocą tego narzędzia)
  2. Minifikacja kodu: Często używamy wielu wtyczek Wordpress do naszych różnych potrzeb. Nie zdajemy sobie sprawy, że większość z nich dodaje dodatkowe CSS/HTML/Javascript do Twojej witryny. Co zwiększa czas ładowania i żądanie przeglądarki. Zmniejszanie (usuwanie dodatkowych linii i kodów) jest łatwym rozwiązaniem tego problemu. Użyta wtyczka: Autoptimize
  3. Pamięć podręczna przeglądarki: Większość głównych narzędzi zaleca korzystanie z pamięci podręcznej przeglądarki. I zmniejsza przepustowość, czas ładowania dla powracającego gościa i wiele innych przydatnych rzeczy. Zastosowana wtyczka: Najszybsza pamięć podręczna WP

Witryna Jubaera ładuje się teraz w 1,9 sekundy, a wynik GPI wynosi 83! To spora poprawa w stosunku do 8 sekund i wyniku GPI 43.

Zabrany klucz
Kluczowe rozwiązanie: Mniejsze strony internetowe mogą odnotować znaczną poprawę szybkości po wprowadzeniu zaledwie kilku kluczowych zmian.

Spróbuj przejrzeć listę Jubaera, aby rozpocząć i zobacz, jakie wyniki uzyskasz, zanim przejdziesz do następnej taktyki.

Powiązana lektura: 7 wtyczek WordPress SEO: Twój nowy lokalny stos


Studium przypadku: jak jedna firma osiągnęła wynik 100/100 w narzędziu Google PageSpeed

Uzyskanie 100/100 wskazuje, że Twoja witryna jest maksymalnie zoptymalizowana pod kątem szybkości. To ostateczny cel, a jedna firma, z którą rozmawiałem, wyjaśniła kilka wewnętrznych taktyk, które pomogły im go osiągnąć.

Bret Bonnet, współwłaściciel/założyciel Quality Logo Products, dystrybutora produktów promocyjnych o wartości 40 milionów dolarów z siedzibą w Chicago, IL. wyjaśnia,

„Szybkość strony jest głównym celem naszej organizacji. Nawet jeśli jest to bardzo niewielkie, nadal jest sygnałem rankingowym. Badania wykazały, że szybkość strony może mieć ogromny wpływ na wydajność konwersji. Najskuteczniejszym sposobem na skrócenie czasu wczytywania witryny jest wczytywanie zasobów, co pozwala na pełne wyświetlenie zawartości strony widocznej na ekranie przed załadowaniem CSS/JS. NIEoptymalizowane ładowanie treści „powyżej strony widocznej na ekranie” może skutkować odjęciem 10 punktów od ogólnego wyniku Google Page Speed ​​Insights”.

[clickToTweet tweet="NIEoptymalizowane ładowanie treści powyżej strony widocznej na ekranie może skutkować odjęciem 10 punktów od ogólnego wyniku Google #PageSpeed ​​Insights." quote="BRAK optymalizacji ładowania treści powyżej strony widocznej na ekranie może skutkować odjęciem 10 punktów od ogólnego wyniku Google #PageSpeed ​​Insights."]

To 10-punktowe odliczenie pokazuje, jak ważna jest według Google optymalizacja treści strony widocznej na ekranie. Zaskakujące i paradoksalne jest to, co Bret wyjaśnia dalej:

„Oprócz zarządzania zasobami doskonałego wyniku NIE MOŻE osiągnąć żadna witryna, która zawiera w swoim kodzie źródłowym wspólny kod śledzenia z Google AdWords lub Google Analytics. Te pliki JS są dostarczane bezpośrednio przez Google — z jakiegokolwiek powodu Google nie przestrzega własnych wytycznych dotyczących jakości — i są przesyłane do przeglądarki w postaci nieskompresowanej. Ta kiepska optymalizacja – na którą znowu nie masz wpływu – leży całkowicie po stronie Google i może kosztować Cię nawet 5 punktów”.

Firma Quality Logo Products była w stanie przyspieszyć działania i osiągnąć wynik 100/100, stosując następującą taktykę:

„Aby temu zaradzić, zarejestrowaliśmy adresy IP, z których Google indeksuje, oraz źródłowe adresy IP tych narzędzi, a nasze serwery celowo obsługują wersje naszych stron Google bez zainstalowanego kodu śledzenia. To trochę dziwne, ale Google szkodzi naszemu własnemu wynikowi Google Page Speed ​​​​Insight. Aby temu zaradzić, celowo nie udostępniamy Google własnego niezoptymalizowanego kodu, co skutkuje średnio 5-punktową poprawą naszego wyniku szybkości strony”.

Zabrany klucz
Key Takeaway: Wynik 100/100 jest osiągalny!

To zdumiewające, że własne produkty Google spowalniają działanie do takiego stopnia, ale obejście problemu w tym studium przypadku powinno pomóc.


Jak przeprowadzić audyt i optymalizację szybkości witryny

1. Uzyskaj linię bazową do wykresów wyników

Pierwszym krokiem w procesie audytu i optymalizacji powinno być przyjrzenie się sytuacji, w której obecnie znajduje się Twoja witryna pod względem kilku wskaźników.

Jeśli zapiszesz swój punkt początkowy, będziesz w stanie lepiej śledzić powodzenie działań optymalizacyjnych. Za każdym razem, gdy optymalizujesz swoją witrynę w jakikolwiek sposób pod kątem szybkości, upewnij się, że rejestrujesz swoje postępy w odniesieniu do tych samych wskaźników.

Oto kilka rzeczy, które powinieneś śledzić:

  1. Czas wczytywania witryny: przejdź do raportu Google Analytics, aby wybrać Menu → Zachowanie → Szybkość witryny → Przegląd (oraz Czasy strony, aby zobaczyć poszczególne strony). Zapisz średni czas ładowania strony i wszystkie kluczowe strony, które chcesz śledzić. Możesz także użyć wspomnianych powyżej narzędzi Pingdom i GTMetrix.
  2. Wyniki Google PageSpeed ​​Twojej witryny: po prostu kliknij tutaj, wprowadź adres URL swojej witryny i sprawdź wyniki na urządzeniach mobilnych i komputerach. Zapisz te.
  3. Współczynnik odrzuceń: sprawdź, czy współczynnik odrzuceń poprawia się, co oznaczałoby, że mniej osób opuszcza witrynę po wyświetleniu tylko jednej strony. Możesz to zobaczyć w wielu miejscach, takich jak Zachowanie → Przegląd.
  4. Współczynnik konwersji: czy po wprowadzonych ulepszeniach użytkownicy dokonują konwersji w szybszym tempie? To ważne, aby śledzić! Przejdź do Konwersje → Cele → Przegląd, aby wyświetlić i zapisać swój aktualny współczynnik konwersji.

Zapisuj swoje postępy w arkuszu kalkulacyjnym i upewnij się, że odnotowujesz zmiany w witrynie w Google Analytics, tworząc adnotacje dla każdej aktualizacji.

2. Wykonaj 8 kroków

Najlepszym miejscem do rozpoczęcia audytu są sugestie, które oferuje narzędzie Google PageSpeed ​​Insights. Jeśli nie masz jeszcze 100/100, zobaczysz kilka wskazówek od Google, od czego zacząć.

Jak już wspomniałem, wykonanie 8 kroków mających na celu poprawę szybkości witryny, które wymieniliśmy, zajmie trochę czasu i wytrwałości.

Meike Hendriks, ekspert SEO w Yoast zauważa,

„Przyspieszenie witryny nie musi być trudne. Wiele witryn ma zbyt duże obrazy, które można łatwo zoptymalizować. Poza tym strony internetowe, które odwiedzają goście z całego świata, zdecydowanie powinny korzystać z sieci CDN, aby upewnić się, że obrazy są wyświetlane jako tak szybko, jak to możliwe dla wszystkich! Dodanie kilku wierszy kodu do pliku .htaccess może z łatwością przyspieszyć Twoją witrynę. Na przykład możesz włączyć buforowanie przeglądarki i kompresję gzip dla mniejszych plików, które można ładować znacznie szybciej na komputerach gości."

Musisz wyznaczyć sobie realistyczne cele i oczekiwania. Kiedy masz duże, wielopłaszczyznowe witryny z mnóstwem (niesamowitych!) treści, takich jak Vendasta i Hubspot, osiągnięcie tych samych celów, co mała, zwinna witryna z kilkoma stronami, zajmie więcej czasu.

3. W razie potrzeby wezwij pomoc

Hej, nie wszyscy jesteśmy programistami i projektantami. Jeśli Twoje wysiłki związane z tworzeniem DIY psują Twoją witrynę lub pojawiają się w sesjach terapeutycznych, możesz chcieć skorzystać z pomocy eksperta.

Mężczyzna pcha beczkę koła i spada 2x4 do lufy koła

Wszyscy znamy i zazdrościmy technicznym czarodziejom. Pozwól im zrobić to za Ciebie!

Pius Boachie z Digitimatic powiedział mi, że programista full stack jest kluczem do rozwiązania problemów z szybkością strony:

„Jeśli chodzi o pokonanie narzędzia Google Page Speed ​​Insights, programista wykonuje ciężką pracę, utrzymując kod w czystości i nadając priorytet treściom. Z doświadczenia wynika, że ​​projektując dla klientów, projektujemy pod kątem szybkości, dlatego wybieramy narzędzie do tworzenia witryn, takie jak Duda (szybkie produkty) lub zbuduj CMS lub scratch (drogie), zainwestuj w dobry CDN i hosting (bardzo ważne) wraz z doświadczonym programistą full-stack.

Dane bazowe zostały już skonfigurowane, więc łatwo będzie śledzić postępy i sukcesy w przyszłości. Jeśli pracujesz w wielu witrynach dla klientów, będziesz chciał mieć możliwość powtórzenia swojego sukcesu i zatrzymania wszystkiego, co nie działa.

Sugerowana lektura: Nie potrzeba programistów: dlaczego potrzebujesz narzędzia do tworzenia witryn White Label

4. Bądź zaangażowany w rozwój szybkości witryny

Prawdopodobnie możesz wybić kilka nisko wiszących owoców, takich jak optymalizacja obrazu, minimalizacja kodu i buforowanie przeglądarki, i od razu zobaczyć dobre wyniki. Jednak, aby osiągnąć swoje cele, może to wymagać bardziej długotrwałego wysiłku, aby odrzucić 8 taktyk, które podkreśliłem.

Nie próbuj robić wszystkiego na raz! Aby uniknąć wypalenia zawodowego, zaplanuj odrobaczenie, jednocześnie monitorując wyniki swoich wysiłków.


Oto jak wykorzystać szybkość witryny do zwiększenia sprzedaży


Końcowe przemyślenia

Uzyskanie rzeczywistych ulepszeń szybkości witryny jest zawsze bardziej chaotyczne, niż wydaje się to w postach na blogu. Po drodze napotkasz pewne wyzwania, ale skup się na wynikach, ponieważ w dłuższej perspektywie poprawią one wygodę użytkownika, SEO i konwersje.

To jest najważniejsze; przygotowanie do szybkiej przyszłości przeglądania online.

Jeśli potrzebujesz pomocy, zadzwoń do swoich przyjaciół technicznych lub daj nam znać, jak możemy pomóc!

Jeśli masz jakieś doświadczenia lub porady, którymi możesz się podzielić, prosimy o kontakt w sekcji komentarzy do tego posta...