Kompletny przewodnik po optymalizacji szybkości WordPress

Wyobraź sobie, że masz duże spotkanie, a Twój zespół ćwiczy przez cały miesiąc. Po tych wszystkich przygotowaniach kolega z zespołu wyznaczony do przyniesienia laptopa, którego potrzebujesz do prezentacji, biegnie z tyłu. A kolega z zespołu pojawia się dziesięć minut później niż zaplanowano, a potencjalny klient jest zmęczony czekaniem.

Cóż, to brzmi zbyt szkodliwie i nie pasuje do klienta. Teraz możesz sobie wyobrazić, jak czują się Twoi użytkownicy, gdy muszą usiąść i poczekać, aż Twoja witryna załaduje się w ich przeglądarce. Jak myślisz, co zrobią, jeśli jakaś strona internetowa ładuje się dłużej niż dziesięć sekund? A może nawet sześć? Cztery?

Nie jest tajemnicą, że szybkość witryny ma znaczenie. Nikt nie chce strony wolno ładującej się – zwłaszcza Google. Tak więc, chyba że chcesz zbudować słabą wygodę użytkownika i obniżyć swoje szanse na pozycję w Google, nadszedł czas, abyś zrobił coś z optymalizacją prędkości WordPress.

Przy prawie 40,0% sieci obsługiwanej przez WordPress istnieje sto tysięcy wtyczek, motywów i innych technologii, które muszą współistnieć, aby zoptymalizować WordPress pod kątem szybkości. Codzienny użytkownik WordPressa może uznać to za koszmar, gdy jego witryna jest ustawiona na wąskie gardło, a nawet nie wie, dlaczego.

Tutaj podzielimy się absolutnie wszystkim, co trzeba wiedzieć o optymalizacji szybkości WordPressa, abyś mógł zacząć przyspieszać swoją witrynę już dziś. Mamy nadzieję, że możemy pokierować optymalizacją wydajności WordPressa bez zbytniego technicznego lub „opartego na kodzie”. W rzeczywistości staramy się unikać tutaj przykładów kodu.

Więc jesteś gotowy? Zaczynajmy.

i) Co spowalnia Twoją witrynę WordPress?

Przede wszystkim spójrzmy na kilka znaczących winowajców, które spowalniają Twoją witrynę. Są to sekcje, na których powinieneś się skupić.

a. Obrazy

Dziwaczny rozmiar obrazu zabija szybkość witryny.

b. Filmy

Funkcje WordPress, takie jak tła wideo, są fajne, ale są również rzeczywistym ograniczeniem wydajności do szybkości witryny.

c. Wtyczki WordPress

Wtyczki do WordPressa są zdecydowanie ogromnymi ratownikami, ale „która” i „ile” zrobi różnicę.

d. Motywy WordPress

Ta sama zasada dotyczy motywów. Dobry projekt strony internetowej WordPress jest koniecznością. Jednak źle zakodowany motyw zawiera zbyt wiele plików i skryptów, aby powodować problemy.

mi. Skrypty

Wszystko, co zawiera nadmierną ilość skryptów JavaScript, jQuery lub innych zewnętrznych skryptów, może spowolnić Twoje strony internetowe.

f. Pszczoła

API zdecydowanie pomagają w zarządzaniu treścią. Ale jeśli serwery, do których jest podłączona Twoja witryna, są powolne, na początek odpowiedź witryny będzie powolna.

g. Niechlujstwo

Niechlujstwo może się zdarzyć w folderze multimediów, wtyczkach, zawartości bloga lub bazie danych.

h. Zepsute połączenia

Jeden lub dwa uszkodzone linki nie są straszne. Jednak witryna pełna niedziałających linków może negatywnie wpłynąć na wrażenia użytkownika i obniżyć prędkość, ponieważ serwer nadal pracuje z uszkodzonym połączeniem.

i. Przekierowanie

Ponownie przekierowanie uniemożliwia odwiedzającym napotkanie uszkodzonych linków/starych adresów URL, ale posiadanie ich zbyt wielu jest obciążeniem dla serwera.

Zanim zaczniemy…

ii) Kopia zapasowa, etapowanie i testowanie

Najlepszą strategią tworzenia kopii zapasowej witryny WordPress jest utworzenie nowej subdomeny (takiej jak testing.domain.com) i wykonanie na niej wszystkich prac optymalizacyjnych. Większość dostawców usług hostingowych, takich jak WPEngine, Siteground, Kinsta i inne popularne firmy, zapewnia inscenizację jednym kliknięciem. Jeśli Twoja firma hostingowa nie zapewnia tworzenia witryny tymczasowej, możesz skorzystać z bezpłatnych lub premium wtyczek do tworzenia kopii zapasowych, aby uzyskać kopię zapasową. Gdy jesteś zadowolony z wyników na swojej stronie testowej, możesz wprowadzić swoje fundamentalne zmiany do swojej aktywnej witryny. Teraz Twoja witryna jest zoptymalizowana pod kątem szybkości bez żadnych problemów.

Inną techniką, którą możesz zastosować, jest budowanie motywu potomnego. Użycie motywu potomnego zapewnia, że ​​zmiany wprowadzone w plikach motywu nie zostaną nadpisane w motywie nadrzędnym.

Na koniec przetestuj swoją obecną prędkość za pomocą tych witryn testowych WordPress Speed.

• Google Pagespeed
• GTmetrix
• Pingdom

Teraz zacznijmy kroki w celu optymalizacji wydajności WordPress.

1. Wybierz dostawcę usług hostingowych o wysokiej wydajności

Zacznijmy od firmy hostingowej, która ma następujące cechy:

• Jeden, który specjalizuje się w hostingu WordPress - rozumie nieodłączne problemy z wydajnością związane z CMS
• Oferuje kilka opcji hostingu zarządzanego
• Wykorzystuje najnowsze i najszybsze technologie
• Obejmuje buforowanie i CDN
• A świetna obsługa klienta nie zaszkodzi

Ale jak wybrać najlepszą?

Najprostszy sposób na zmierzenie jakości hostingu w celu sprawdzenia TTFB. Czas do pierwszego bajtu oznacza czas odpowiedzi serwera, który zasadniczo reprezentuje szybkość serwera. Możesz użyć ByteCheck do bezpłatnego testowania TTFB. WPengine, Kinsta, SiteGround, Bluehost, HostGator itp. To niektórzy dostawcy hostingu witryn, którym można zaufać.

2. Użyj buforowania

Buforowanie witryny to technika, w której statyczna wersja HTML Twojej strony internetowej jest przechowywana i później ponownie wykorzystywana, gdy odwiedzający odwiedzają witrynę. W ten sposób przeglądarka miałaby już potrzebne informacje dotyczące witryny, dzięki czemu prędkość WordPressa byłaby lepsza.

Szczególnie w przypadku strony statycznej, która nie aktualizuje się często, użycie wtyczki buforującej byłoby niezwykle korzystne. WP Rocket, Cache Enabler, WP Super Cache, W3 Total Cache itp. Są najlepszymi na rynku.

Te wtyczki obniżają czas ładowania serwera i obsługują inne zadania optymalizacji prędkości, takie jak:

• Buforowanie przeglądarki i na poziomie strony
• Kompresja plików gzip
• Połącz pliki CSS i JavaScript
• Minifikacja CSS, HTML i JavaScript
• Integracja CDN

Jeśli Twój dostawca hostingu ma już system buforowania, dodanie dodatkowej wtyczki nie będzie konieczne.

3. Mądrze wybieraj wtyczki i motywy

Czy zdajesz sobie sprawę z obciążenia, jakie motyw i wtyczka mogą powodować na swoim serwerze? Dlatego musisz być wybredny w korzystaniu z motywów i wtyczek WordPress.

a. Właściwy motyw WordPress

Źle zakodowany i niezaktualizowany motyw dodaje do stron bezużyteczne skrypty, co powoduje słabą jakość ładowania strony. Tak więc, przed zainstalowaniem go w swojej witrynie, ustaw swój wybór pod kątem problemów z kontrolą jakości. Niestety, większość darmowych motywów WordPress na rynku wygląda dobrze i jest pełna więcej funkcji, ale ignoruje wydajność.

Nasz dobry motyw zawiera zestaw dedykowanych funkcji wydajności i eliminuje potrzebę korzystania z dodatkowych wtyczek innych firm.

b. Używaj tylko najbardziej potrzebnej wtyczki

Wybierając wtyczki WordPress, pamiętaj o następujących wskazówkach:

• Wiedza o tym, czy wtyczka jest konieczna, czy też niektóre funkcje WordPressa/proste kodowanie są dostępne jako uzupełnienie wtyczki.
• Przejrzyj każdą wtyczkę wraz z odnotowanymi problemami z wydajnością - nigdy nie instaluj czegoś, co ma wątpliwą historię.
• Poszukaj wtyczek z wieloma funkcjami i funkcjami, dzięki czemu możesz używać tylko jednej zamiast wielu
• Aktualizowanie motywów i wtyczek jest koniecznością, aby Twoja witryna była bezpieczna i szybka. Ale jednocześnie niektóre aktualizacje mogą sprawić, że motywy/wtyczki i WordPress będą niekompatybilne. Więc instaluj tylko wtedy, gdy aktualizacja jest przydatna.

c. Ponowne przemyślenie korzystania z wtyczki

Tak, używanie zbyt wielu wtyczek WordPress w jakiś sposób spowolni twoją stronę. Ale liczba wtyczek nie jest tak istotna, jak jakość używanych wtyczek. Liczy się to, w jaki sposób została opracowana ta konkretna wtyczka – czy została zbudowana z myślą o wydajności? Oznacza to, że możesz również spojrzeć na niektóre ze swoich starych wtyczek i zastąpić je nowymi i lekkimi.

4. Użyj PHP 7 i nowszych

Czy słyszałeś kiedyś o wersjach PHP? Ty musisz mieć. PHP to otwarty język skryptowy działający po stronie serwera. Większość twoich motywów i wtyczek, wraz z podstawowym oprogramowaniem WordPress, jest zasadniczo napisana w PHP.

Najpierw upewnij się, że Twój host WordPress używa co najmniej PHP 7 lub nowszego. Zgodnie z danymi tylko 6,8% wszystkich witryn WordPress używa PHP 7.3, ale kolejne 28,6% nadal używa PHP 5.6 (wydanego w 2014 roku).

Co by było, gdyby ktoś dał ci telefon, który został wydany w 2014 roku? Miałby powolną i powolną reakcję, która doprowadziłaby cię do szaleństwa.

Dokładnie tak poczują się Twoi goście z PHP 5.6.

5. Użyj SSL/HTTPS

Certyfikat SSL nie wpływa bezpośrednio na prędkość WordPressa, ale nadal zaleca się jego uzyskanie. Po pierwsze, i co ważne, Google potwierdza, że ​​prawidłowe korzystanie z HTTPS/SSL zapewnia lepszą pozycję w rankingu.

Co więcej, ponieważ witryny z certyfikatem SSL są oznaczone małą zieloną kłódką umieszczoną nad paskiem adresu, zwiększają one zaufanie klientów.

Drugim powodem jest bezpieczeństwo. Posiadanie certyfikatu SSL na Twojej stronie zaszyfruje transfer danych/informacji do iz Twojej witryny, czyniąc Twoją witrynę bezpieczniejszą.

6. Optymalizacja obrazu

Posiadanie obrazów na swojej stronie to zawsze dobra rzecz. Ale niewłaściwy rodzaj może być największą katastrofą dla Twojej witryny. Szybkim sposobem na przyspieszenie Twojej witryny jest optymalizacja obrazów.

Czy wiesz, jak optymalizacja obrazu może przyspieszyć Twoją witrynę? Może zmniejszyć wykorzystanie przepustowości Twojej witryny, otworzyć się szybko, aby utrzymać zaangażowanie użytkowników i nie dawać wyszukiwarkom Google jeszcze jednego powodu, by nienawidzić Twojej witryny.

Istnieją różne sposoby optymalizacji obrazu. Dowiemy się o nich wszystkiego tutaj.

a. Wybór odpowiedniego formatu obrazu

Najczęściej używane formaty obrazów w tej dekadzie to JPG, PNG, SVG i GIF. GIF służy głównie do animowanych obrazów, a JPG i PNG do zdjęć. Wśród tych dwóch format JPG (lub JPEG) jest idealny do wyświetlania obrazów wielokolorowych. W logo jest wyraźnie używany format SVG. PNG są używane tylko w przypadkach, gdy SVG jest niemożliwe, a przezroczystość obrazu musi być zachowana, więc JPG również nie wchodzi w grę.

Ale przy tak wielu aplikacjach do edycji w Internecie nie powinieneś się mylić, jaki format obrazu wybrać. Jednym z takich narzędzi jest XnConvert. Możesz po prostu przeciągnąć i upuścić swój obraz tutaj i zapisać go w najmniejszym formacie. Możesz także użyć XnConvert do zmiany rozmiaru, przycinania, zmiany formatów obrazów i wielu innych w setkach.

b. Użyj kompresji obrazu

Teraz zapisałeś plik w formacie JPG i PNG; czas skompresować plik.

Co to jest?

Kiedy robisz zdjęcie po raz pierwszy, jest ono uważane za 100% jakości. Możesz obniżyć jakość obrazu (skompresować) go do mniejszego rozmiaru. Możesz skompresować plik obrazu JPG do 85-90% bez żadnych zmian.

Możesz przekonwertować obrazy ręcznie przed ich przesłaniem lub po prostu użyć wtyczki. Istnieje wiele wtyczek znanych z kompresowania obrazów w WordPress. Optymalizator obrazu ShortPixel, reSmush.it, optymalizator obrazu EWWW i kompresor WP to tylko niektóre z nich.

Ale nieprawidłowa optymalizacja obrazu wpływa również na wydajność witryny. Jedną z najlepszych technik optymalizacji obrazu jest optymalizacja obrazu oparta na serwerze i lokalna optymalizacja obrazów przed ich przesłaniem.

Alternatywnie można użyć wtyczki LiteSpeed, która jest w zasadzie wtyczką buforującą, która umożliwia również kompresję obrazu za pomocą dodatku Google Pagespeed. Ponieważ LiteSpeed ​​kompresuje wszystkie obrazy na swoim serwerze, czas odpowiedzi Twojego serwera nie wpłynie na działanie. Ale musisz je skompresować partiami.

c. Określ wymiary obrazu

Określanie wymiarów obrazu jest związane głównie z doświadczeniem użytkownika. Dowiedzmy się jak.

Gdy strona najpierw ładuje tekst, rozmiar obrazu jest również określany podczas ustawiania układu strony. Ale po jednoczesnym pobraniu obrazów przeglądarka znajduje różne wymiary obrazu i automatycznie dostosowuje układ strony. Zasadniczo dla każdego kolejnego załadowania obrazu po pewnym czasie przeglądarka musi odtworzyć układ strony. Przy takich zmianach odwiedzający nie może czytać tekstu, gdy strona ciągle się przesuwa.

Wcześniejsze określenie wymiarów obrazu pozwala uniknąć tych kłopotów.

d. Wyświetlaj skalowane obrazy

Należy to zrobić, jeśli Twój motyw nie jest zoptymalizowany do obsługi obrazów. W idealnym przypadku możesz po prostu zmienić motyw, którego używasz, na ten z optymalizacją obrazu. Możesz też użyć wtyczek, takich jak Force Regenerate Thumbnails lub Regenerate Thumbnails, aby zbudować swoje miniatury. Po prostu ustaw prawidłowe rozmiary miniatur przed użyciem takich wtyczek.

7. Optymalizacja gravatara

Globalny awatar pozwala Tobie, a także komentującym Twoją witrynę, uzyskać zdjęcia na ich profilu. Bez wątpienia korzystanie z Gravatara ma ogromne zalety, ale największą wadą jest powolny czas ładowania. Co więcej, Gravatar zawiera również wiele przekierowań, aby jeszcze bardziej spowolnić witrynę.

Możesz uniknąć wzdęcia wprowadzonego przez Gravatara w następujący sposób:

• Wyłącz Gravatar na swoich stronach internetowych
• Usuń nadmierne i spamujące komentarze z postów
• Dodaj reCAPTCHA w swoim formularzu komentarza
• Skonfiguruj ustawienia WordPress, aby wyświetlać tylko kilka komentarzy naraz
• I na koniec użyj wtyczki do buforowania dla Gravatar

8. Leniwe ładowanie filmów i obrazów

Lazy-Loading images to skuteczna i łatwa opcja optymalizacji, która znacznie poprawia czas ładowania witryny. Bez leniwego ładowania wszystkie pliki multimedialne, takie jak obrazy i wideo, są ładowane jeszcze przed przewinięciem do tej sekcji. To oczywiście spowalnia Twoją witrynę, zwłaszcza gdy masz wiele zdjęć/filmów na swoich stronach internetowych. Lazy loading ładuje obrazy i inne ciężkie zasoby dopiero po przewinięciu przez użytkownika do sekcji na stronie internetowej, na której się pojawiają. Po prawidłowym wykonaniu Lazy Load może znacznie zwiększyć szybkość witryny.

Nauczmy się korzystać z Lazy Load

1. Najpierw pobierz wtyczkę lazy load z katalogu WordPress i zainstaluj ją
2. Przejdź do ustawień wtyczki i skonfiguruj ją

Pamiętaj, że leniwe ładowanie wiąże się ze złożoną techniką. Jeśli nie jest prawidłowo skonfigurowany, może zepsuć całą witrynę.

9. Leniwe ładowanie Disqus

Może nadszedł czas, aby zastąpić klasyczny system komentarzy WordPressa Disqus. Chociaż jego zaawansowana, wysoce skuteczna funkcja zapobiegania spamowi i moderowania jest warta wiele pochwał, wiąże się z kosztami, np. czasem ładowania.

Za każdym razem, gdy Disqus ładuje się w Twojej witrynie, powoduje to dziesięć dodatkowych żądań, które spowalniają Twoją witrynę. Na szczęście istnieje wtyczka, taka jak Disqus Conditional Load, która powoduje leniwe ładowanie samego Disqus. To ładowanie warunkowe Disqus ładuje komentarz tylko wtedy, gdy użytkownik przewinie do końca strony.

10. Ogranicz zmiany postów

Domyślnie WordPress jest przeznaczony do zapisywania wszystkich zmian postów, nawet jeśli dokonasz najmniejszej zmiany. Tak więc w przypadku często edytowanego/aktualizowanego posta tworzone są dziesiątki kopii dokładnie tego samego posta, aby wypełnić Twoją bazę danych.

Aby tego uniknąć, możesz ograniczyć liczbę poprawek/aktualizacji zapisanych w WordPressie. Zwykle 3 do 5 powinno wystarczyć. Możesz to zrobić, umieszczając prosty kod w pliku wp-config.php .

 zdefiniować ('WP_POST_REVISIONS', 3);

Możesz zmodyfikować liczbę w kodzie, aby dostosować liczbę wersji, których możesz potrzebować.

Ale ten kod będzie działał tylko dla nowego posta. Aby usunąć wersje starszych postów, możesz użyć wtyczek do czyszczenia bazy danych, takich jak WP-Optimize i Advanced Database Cleaner. Po użyciu wtyczek możesz po prostu usunąć wtyczkę.

11. Ogranicz pająki i roboty

Pająki i roboty sieciowe zawsze szukają zasobów w Twojej witrynie. Oprócz pomocnych pająków wyszukiwarek, inne boty, takie jak spamboty, skrobaki, skrobaki e-maili, często indeksują Twoją witrynę. Nie tylko kradną informacje z Twojej witryny, ale serwer musi wydać zasoby, aby je obsłużyć.

Dlatego mądrze jest zarządzać działaniami botów w swojej witrynie, aby sprawdzić takie bezużyteczne indeksowanie, stosując następujące sposoby.

1. Możesz użyć pliku .htaccess, aby zablokować znane złe boty.
2. Możesz zablokować boty na swojej stronie, gdy takie boty pojawią się na rynku.
3. Można użyć wtyczki zabezpieczającej WordFence, aby ręcznie dławić boty i blokować adresy IP.

12. Korzystanie z bezpłatnych przycisków udostępniania w mediach społecznościowych JavaScript

Tak, będziemy potrzebować pięknych przycisków udostępniania społecznościowego, aby zachęcić naszych gości. Ale przyciski udostępniania społecznościowego wykonane głównie w JavaScript są ciężkie. Śledzą użytkowników w sieci, a ich ładowanie zajmuje dużo czasu.
Pomogłoby więc, gdybyś używał przycisków udostępniania społecznościowego wolnych od JavaScript. W tym celu usuń istniejące przyciski i skorzystaj z usługi, takiej jak sharingbuttons.io.

13. Bonus

A jeśli nie jesteś jeszcze zadowolony z wyniku, możesz zastosować więcej sztuczek. Te sztuczki są przeznaczone przede wszystkim dla profesjonalnych programistów. Wymieńmy je.

• Wyłącz emotikony i osadzania
• Usuń ciągi zapytań
• Usuń tag skrótu
• Usuń łącza REST API
• Wyłącz Mapy Google
• Wyłącz arkusze stylów / widżety WooCommerce
• Unikaj czcionek Google/czcionek serwerowych lokalnie
• Optymalizuj niesamowite ikony czcionek
• Wyłącz XML-RPC
• Ukryj wersję WordPress
• Usuń tag łącza RSD
• Połącz CSS i Javascript

iii) Różne problemy, różne rozwiązania

Znajomość możliwości optymalizacji szybkości strony internetowej i jej techniki to dobry początek. Ale nie musisz stosować wszystkich tych technik na swojej stronie. Chodzi nam o to, że ponieważ nie ma dwóch takich samych firm ani dwóch takich samych witryn, pierwszym krokiem jest zrozumienie charakteru/typu posiadanej witryny WordPress.

Jeśli więc masz witrynę statyczną, nie będziesz regularnie aktualizować jej zawartości; być może zarabiasz tylko kilka razy w miesiącu. Witryna statyczna obejmuje lokalne witryny firmowe, blogi, fotografie, indywidualne itp. Posiadanie takiej witryny oznacza mniejszą liczbę baz danych, a co za tym idzie nie będziesz potrzebował wielu zasobów, aby osiągnąć dobrą wydajność.

Z drugiej strony, mając niezwykle dynamiczną stronę internetową, taką jak eCommerce, fora internetowe itp., dane witryny WordPress często się zmieniają (co minutę, a nawet co sekundę). W takim przypadku istnieje potrzeba dodania źródeł serwerowych oraz zapytań do bazy danych.

Są też inne rodzaje stron internetowych, na przelotowej i konsumującej. Jeśli strona ma charakter informacyjny, odwiedzający może pozostać przez 5 lub 10 minut i zlokalizować, kiedy musi opuścić. Z drugiej strony konsumujące strony internetowe zatrzymują odwiedzających przez wiele godzin – na przykład strona internetowa z kursami szkoleniowymi. Jednoczesni odwiedzający takie strony internetowe przychodzą na sesje symultaniczne.

Czy widzisz, dokąd to zmierza? Jednoczesni odwiedzający muszą szybko zgromadzić informacje z poprzedniej sesji. Posiadanie wielu jednoczesnych odwiedzających witrynę wraz z problemem „niedostępnej treści internetowej” sprawia, że ​​jest to koszmar.

Zasadniczo nie możesz poradzić sobie ze wszystkimi witrynami WordPress w ten sam sposób - należy podjąć świadomą decyzję.

Wniosek

Bez wątpienia istnieje więcej niż mnóstwo samouczków, które obejmują różne sposoby optymalizacji WordPressa pod kątem szybkości. Ale znalezienie wszystkiego w jednym miejscu może być mylące. Mam nadzieję, że ten był dla Ciebie pomocny, ponieważ wymieniliśmy wszystkie techniki, które możesz zastosować, aby szybko ładować witrynę. Dodatkowo, jeśli chcesz uzyskać pomoc od eksperta, możesz znaleźć naszego certyfikowanego eksperta WordPress na Codeable lub Prześlij formularz prośby o dostosowanie, aby się z nami skontaktować.

Wszystkiego najlepszego!!