Optimizarea vitezei unui site WordPress
Viteza de descarcarea a unei pagini web pe orice dispozitiv, nu este numai un factor SEO din ce in ce mai important.
Un site care functioneaza greu va influenta in mod negativ rata de conversie.
La fel si design-ul, un aspect nereusit va descuraja vizitatorii.
Pe de cealalta parte, fiecare element din site (text, poza, video, script) necesita un „request” (o solicitare) in plus ceea ce influenteaza in mod direct viteza.
Astfel, pentru a avea un site care arata bine, dar se misca si repede, trebuie sa poti face joc fin intre cele doua
In fiecare situatie va trebuie sa alegi in mod obiectiv ce este mai important.
Elementul de design sau o fractiune de secunda mai putin la timpul de incarcare a paginii respective?
Daca nu te descurci cu implementarea recomandarilor, apeleaza la ajutor profesionist
O mica investitie in optimizarea vitezei site-ului se poate traduce intr-un cost pe conversie mai mic.
Cuprins Articol
- Atentie la tema activa pe site
- Alege cu atentie builder-ul
- Foloseste cat mai putine plugin-uri
- Testeaza compatibilitatea dintre Tema, Extensii si Plugin-uri
- Optimizarea pozelor
- Optimizarea fonturilor
- Servicii Gazduire (pachet + baza de date)
- Alege modulul de Cache potrivit
- Servicii CDN
- Testeaza si imbunatateste cu ajutorul analizatoarelor de viteza pentru site
- Monitorizeaza periodic scripturile externe
- Elemente dinamice sau statice?
- Nu uita!
Atentie la tema activa pe site
O influenta covarsitoare asupra vitezei cu care se descarca o pagina web o are tema care a fost folosita la baza site-ului.
Unele teme sunt recunoscute ca nu sunt cea mai buna optiune pentru un site rapid.
Daca deja ai o astfel de tema pe site, nu trebuie neaparat sa schimbi tema, te poti concentra pe celelalte aspecte pentru a putea compensa.
Unele teme au posibilitatea de-a activa/deazactiva tipurile de continut pe care le folosesti in site.
Dezactiveaza orice nu este folosit pe site.
Exemplu: Tema Porto nu este una dintre cele mai rapide, dar iti permite o serie de customizari la indemana inclusiv excludere tipurilor de continut nefolosit.
Incepe documentarea descoperind top-ul celor mai rapide teme de WordPress si Cele mai populare teme WordPress pentru magazinul tau online.
Dar nu ar trebui ca alegerea pe care urmeaza s-o faci, sa fie bazata doar pe acest argument – cea mai rapida.
De asemenea, actualizarea temei la zi te poate ajuta sa obtii timpi mai buni la descarcarea site-ului prin optimizarile facute de producator.
Alege cu atentie builder-ul
Page/Content/WebSite Builder este un tool prin interfata caruia poti face modificari sau completari site-ului tau fara a interactiona in vreun fel cu orice linie de cod.
Unele teme WordPress lucreaza doar cu un anumit „builder”, alte sunt compatibilie cu mai multe programe, dar performanta difera intre ele.
Cu cat builder-ul este mai complex cu atat foloseste mai multe fragmente de cod si scripturi pentru a implementa modificarile facute de tine.
Daca intr-o prima instanta castigam din punct de vedere al timpului pentru implementarea unor task-uri simple, pe termen lung site-ul poate avea de suferit la nivelul vitezei.
Din nou acelasi joc fin, la care faceam referire la inceputul articolului.
O pagina construita cu un builder, nu poate fi modificata cu un alt program pentru ca va produce erori complicate.
Alege cu mare atentie, inca de la inceput page builder-ul pe care vrei sa-l folosesti in site de la acel punct incolo, folosindu-te de lista foarte buna realizata de cei de la HostGator.
Foloseste cat mai putine plugin-uri
Probabil ca ai auzit de foarte multe ori acest sfat, dar totusi media de plugin-uri intr-un site WordPress se invarte in jurul a 40 de plugin-uri.
Incearca sa te incadrezi cat mai mult sub acest numar.
Exemplu: nu folosi un plugin pentru a instala codurile de tracking pentru aplicatii cum ar fi: Google Analytics, Google Ads, Facebook Pixel, Conversii Standard sau Custom, HotJar si asa mai departe.
Nu ai nevoie de un plugin in plus pentru a adauga cateva fragmente de cod. Daca nu te descurci, solicita ajutor unei agentii web.
Chiar daca acest lucru implica un cost, acesta nu este foarte mare.
Oricum este vorba de-o plata one-time si nu o cheltuiala recurenta.
De asemenea, in cazul magazinelor, poti verifica pentru ceea ce ai nevoie de un anumit plugin, daca nu cumva exista o extensie WooCommerce.
Testeaza compatibilitatea dintre Tema, Extensii si Plugin-uri
Un aspect des ignorat de catre majoritatea administratorilor de site-uri WordPress este sa testeze efectiv compatibilitatea dintre Tema site-ului si majoritatea plugin-urilor instalate.
Pentru aproape orice optiune pe care vrei s-o implementezi in site, vei gasi cel putin 3-4 module care te pot ajuta.
Dar nu toate sunt la fel de bune, sau nu toate functioneaza la fel de bine cu tema pe care o ai activa pe site.
Unele teme au pe site-ul lor oficial sau la instalare, o sectiune speciala cu module recomandate (in special la nivel de module Cache) cu care tema functioneaza perfect.
Acesta este primul loc in care trebuie sa te uiti.
Apoi, ori poti cauta pe net, in functie de tema pe care o ai pe site, ori incepi testarea efectiva.
Folosindu-te de analizatoarele de viteza precum: GT Metrix, Pingdom sau Google Page Speed Insights, vei vedea impactul fiecarui plugin la nivelul vitezei.
Mai mult decat atat, in raportul GT Metrix, ai disponibil raportul de tip Waterflow, unde vezi fiecare resursa sau script cat de mult timp necesita pentru descarcare.
Este bine sa testezi cu 2 analizatoare ca sa fii sigur(a) de alegerile pe care le faci si n-ar trebui sa testezi mai multe de 4-5 pluginuri intr-o zi.
Aceste tool-uri de analizare a vitezei, au masuri proprii de protectie, iar dupa cateva scanari ale site-ului, aplicatia respectiva va folosi versiunea cache a site-ului si nu cea cu ultimele modificari facute.
De exemplu, am facut si noi acest testing la unele site-uri realizate la WebHipsters.
Printre altele, am descoperit ca Facebook Messenger-ul disponibil in cadrul plugin-ului Facebook for WooCommerce se incarca mult mai repede decat pluginul dedicat.
Desi modulul Facebook For WooCommerce contine mult mai multe optiuni pe langa partea de mesagerie, acesta functioneaza de departe mai bine.
O foarte buna sursa de informare este site-ul WooCommerce
In primul rand ar trebui sa citesti articolul pe tema compabilitatilor, dar la fel de important este sa verifici si lista de conflicte cunoscute.
Optimizarea pozelor
Toata lumea stie cat de importanta este optimizarea pozelor pentru Web inainte de incarcarea pe site.
Dar oare cati dintre noi, utilziatori de WordPress stim sa facem acest proces ca la carte.
Optimizarea pozelor presupune un proces in 3 directii:
- Format-ul pozei: Obligatoriu jpg sau png, ideal svg. Acestea din urma reusesc performante si mai bune.
- Dimensiunile pozei: Nu incarca pozele direct din aparat sau telefon. Acestea trebuie adaptate la dimensiunea elementului in care urmeaza sa fie afisate.
Altfel, acest proces de redimensionare va fi facut de browser, si il va tine ocupa, in loc sa incarce cat mai repede tot site-ul. - Optimizarea Looslessly: Acest tip de optimizare presupune reducerea spatiului ocupat de fiecare poza, deci implicit cantitatea de resurse ce trebuie descarcata pe un dispozitiv de catre browser atunci cand accesezi pagina web.
Exista tool-uri cu ajutorul carora poti face asta, manual inainte de-a incarca pozele efectiv in site (Ex: Tinypng) sau cu ajutorul unor module WordPress cum ar fi: Smush sau Optimus mai multe module similare in articolul HubSpot.
Optimizarea fonturilor
Un aspect a carui importanta a crescut considerabil in ultima perioada, odata cu nevoia tot mai mare de personalizare si creare a unei identitatii proprii.
Recomandarea principala aici este sa-ti alegi fonturile din lista oficiala de fonturi de la Google.
Astfel, eviti descarcarea pentru fiecare utilizator inclusiv a fontului pe langa restul resurselor din site.
Fiecare mod de-a scrie un Font: Thin, Semi Bold, Bold implica incarcarea unui subfont.
Ar trebui sa alegi foarte bine cate si care fonturi si subfonturi le foloseste.
Acest lucru il poti face cu usurinta din cadrul setarilor temei – Typography, daca este disponibila aceasta optiune.
Servicii Gazduire (pachet + baza de date)
Un aspect foarte mult subevaluat cand vine vorba de viteza unui site.
Nu odata ne-am confruntat cu solicitari pentru optimizarea vitezei unui site care era gazduit folosind cel mai mic pachet disponibil.
Total gresit.
Costul cu gazduirea unui site trebuie privit la fel de serios precum chiria unui magazin fizic.
Cu cat esti dispus sa platesti mai mult cu atat o sa mearga mai bine (… cu atat o sa o pozitie mai buna).
Avand in vedere media de preturi pentru serviciile de gazduire din Romania, orice pachet cu un cost mai mic de 50 ron/luna nu va fi niciodata suficient, mai ales daca ai un magazin online.
Modul Cache
In cursa optimizarii multi administratori de site si/sau antreprenori care-si administreaza direct site-ul isi creeaza asteptari nerealiste.
Instaleaza un plug-in specializat, bifeaza 2-3 optiuni si asteapta ca minunea sa se intample.
Lucrurile sunt putin mai complicate decat atat si avem si mai multe optiuni de avut in vedere.
Nu exista un program de cache care sa rezolve singur tot.
In functie de tema din site-ul tau, un plug-in sau altul poate fi alegerea cea mai buna.
Raspunsul il poti afla doar testand mai multe plugin-uri pentru o perioada de minim o saptamana, fiecare.
O alternativa mai usoara ar fi sa cauti pe internet in functie de tema pe care o ai instalata.
Dupa ce ai identificat cea mai buna optiune de program cache pentru site-ul tau, analizeaza posiblitatea achizitionarii variantei premium care-ti va conferi rezultate sporite.
Plugin-uri cache apreciate de-alungul timpului:
Servicii CDN
Scump, dar extrem de eficient, obligatoriu pentru cei care opereaza la nivel international.
CDN = content delivery network reprezinta copii ale site-ului tau gazduite in diferite alte locuri pe glob, astfel incat site-ul tau se incarca din mai multe surse concomitent.
In mod similar cu pachetele de gazduire, furnizorii ofera mai multe optiuni din care-ti poti alege, dar adevarata valoarea a acestui serviciu n-o poti intelege pana nu incerci.
Furnizori importanti pentru CDN sunt: Cloudfare sau CloudFront de la Amazon
Testeaza si imbunatateste cu ajutorul analizatoarelor de viteza pentru site
Ai implementat toate sau doar o parte din sfaturile noastre si nu numar? Perfect!
Munca nu s-a incheiat aici. Salveaza in calendar!
Majoritatea tool-urilor care-ti testeaza viteza site-ului au un sistem de protectie pentru a evita supra solicitarea server-ului.
Astfel ca, dupa 2/3/4 analize ale aceluiasi site, tool-urile respective o sa-ti afiseze rezultate similare.
Pentru a evita asta, trebuie sa reiei testul dupa cateva zile.
Evaluarea plugin-urilor de care ai stricta nevoie, stergerea comentariilor neaprobate, stergerea copiilor generate la editarea paginilor/articolelor/produselor din site trebuie facute periodic.
Monitorizeaza periodic scripturile externe
Unele script-uri externe iti pot creea probleme serioase.
Folosind tool-uri precum GT Metrix, in pagina de rezultate ai disponibil tab-ul WaterFall unde poti vedea toate resursele folosite la incarcarea site-ului tau inclusiv script-uri externe.
La unele script-uri poate poti renunta, de exemplu, Facebook Like Box, este un element care ingreuneaza foarte mult incarcarea unui site si nu intotdeauna aduce rezultatele scontate.
Daca nu poti renunta, verifica daca nu exista alternative de implementare a optiunilor pe care le pune la dispozitie respectivul script.
De exemplu, integrarea unui site WordPress cu MailChimp se poate face in mai multe moduri, adaugand direct fragmentul de cod in site sau folosind un plugin sau chiar pluginul special MailChimp for WooCommerce.
Varianta castigatoare este pluginul MailChimp for WooCommerce s-a dovedit cea mai buna metoda de implementare fara sa ingreunam site-ul. Pluginul este foarte bine facut.
Mai mult decat atat, exista alternative pentru sistem de newsletter, mail-uri automate si asa mai departe (pe langa MailChimp), cum ar fi: Active Campaigns, GetResponse.
Pentru a-ti instala corect Google Analytics si Google Search Console pe site, citeste articolul scris de Maistru’, in care-ti explica pas cu pas ce trebuie sa faci.
Elemente dinamice sau statice?
Elementul static reprezinta o sectiune anterior construita, ex sectiunea de abonare a newsletter. Elementul dinamic reprezinta o sectiune construita la momentul incarcarii paginii din care face parte, ex: sectiune cu ultimele articole/produse publicate pe site.
La fiecare afisare, acel element va interoga (intreba) baza de date care sunt cele mai noi produse, ceea ce contribuie la timpul de incarcare a unei pagini.
Daca un anumit continut nu se schimba foarte des, mai bine il creezi ca un element static pe care il actualizezi manual atunci cand este cazul, decat sa fie conceput ca un element dinamic.
Nu uita!
Cand finalizezi acest proces de imbunatatirea a vitezei de incarcarea a site-ului tau, asteapta 1 luna de zile si apoi reia acest articol, pas cu pas, si vezi ce mai poate fi implementat.
Poti continua cu implementarea unui proces de mentenanta web, astfel incat aceste imbunatatiri sa se faca periodic si sa nu mai acumuleze asa multa cantitate de munca.
Anumite optimizari nu le vei putea integra in activitatea site-ului inca de la inceput.
Cand vei relua procesul de analizare si optimizare a vitezei site-ului tau, o sa identifici foarte usor ce ti-a scapat si ce poate fi facut si mai bine.
Nu uita ca atat in Google Search Console cat si in Google Analytics ai date care pot ajuta sa vezi efectiv ce efect au optimizarile aduse site-ului.
Continua dezvoltarea site-ului tau cu implementarea masurilor de securitate pentru un site WordPress.
Comments (2)
[…] Resursele pe care le foloseste sunt incarcate printr-o cheie de acces la platforma mama, ceea ce reduce mult impact asupra vitezei de incarcare a site-ului. […]
[…] fiecare plugin are un impact negativ la nivelul vitezei cu care este descarcata o pagina web din site-ul tau, prelungind timpul necesar cu mai mult sau mai […]