Cum să vă Accelerați Site-ul WooCommerce – Ghid 2021

Accelerați Site-ul WooCommerce

Cum să vă Accelerați Site-ul WooCommerce ? Bună întrebare, nu? Aveți un magazin WooCommerce lent? Mulți factori pot încetini site-ul dvs. WooCommerce, dar, din fericire, există foarte multe soluții pentru al accelera.

Primul fapt: Site-ul dvs. WooCommerce are nevoie de viteză pentru a genera profituri. Nu numai că timpul de încărcare mai rapid îmbunătățește experiența utilizatorului, dar se traduce și în SEO și vânzări mai bune pentru afacerea dvs. Aveți nevoie de un site web rapid sau s-ar putea să vă pierdeți clienții.

Este simplu: Ce ați face ca vizitator dacă aterizați pe un site de e-commerce super lent? Ați prefera să rămâneți sau să încercați un alt site web cu o experiență de cumpărături mai bună? Știm cu toții acest răspuns.

Acest ghid vă va arăta cum puteți crește cu ușurință viteza site-ului dvs. WooCommerce prin optimizarea anumitor aspecte. Vom vedea numeroasele motive pentru care ar trebui să îl optimizați împreună cu principalele tehnici și instrumente cu care puteți lucra pentru a obține un site rapid pe toate dispozitivele.

De ce ar trebui să vă optimizați magazinul WooCommerce?

Viteza contează pentru site-ul dvs. WooCommerce, deoarece timpul de încărcare a paginii este un factor principal de clasare – și să fim realiști, nu veți vinde produsele dvs. dacă sunteți pe pagina 4/5 a Google.

Într-un studiu realizat de Hubspot, observăm că „scăderea timpului de încărcare a paginii a crescut conversiile de la 3% la 17%”. Ce înseamnă asta în termeni financiari?

Calculele sunt simple: dacă site-ul dvs. WooCommerce câștigă 1000 Lei pe zi, o întârziere de o secundă de pagină vă poate costa 2.500 Lei pe an! Gândiți-vă la toate investițiile pe care le-ați putea face cu 2.500 Lei …

Mai mult, uitați-vă la ce am găsit pe blogul Google.

1 din 2 vizitatori (care sunt potențiali cumpărători) vor părăsi magazinul dvs. dacă durează mai mult de 3 secunde pentru încărcare.

Optimizarea vitezei pentru un site de comerț electronic nu este ceva nou. Încă din 2010, Google a inclus în algoritmii lui de clasificare a căutării: viteza site-ului. Acest nou KPI reflectă cât de rapid răspunde un site web la solicitările web.

Unde suntem în 2021? Google continuă să facă web-ul un loc mai bun (și mai rapid) odată cu lansarea recentă a Core Web Vitals, care a devenit și un factor de clasare. Aceste noi semnale web măsoară modul în care utilizatorii percep experiența interacțiunii cu pagina dvs. web, ceea ce influențează poziția site-ului dvs. WooCommerce pe Google.

Dacă scorul dvs. de performanță este scăzut, lui Google nu-i va plăcea. Dacă KPI-urile dvs. sunt verzi, magazinul dvs. va avea mai multe șanse să fie pe prima pagină.

Optimizându-vă Core Web Vitals, vă veți crește șansele de a urca în clasamentul motorului de căutare Google și prin urmare, de a atrage mai mult trafic către magazinul dvs. online!

O viteză mai mare = o conversie mai bună = mai multe vânzări

Acum, când am văzut că o viteză mai mare crește conversiile, reduce rata de respingere, obține o clasare plăcută în SERP și îi face pe vizitatori fericiți, să vedem cum să ne asigurăm că site-ul dvs. WooCommerce este bine optimizat.

Acest lucru ne duce la următoarea întrebare: Cum să vă accelerați site-ul WooCommerce?

Cum să accelerați un site WooCommerce: 11 Sfaturi care Funcționează

Creșterea vitezei site-ului dvs. este un aspect crucial al oricărui site WooCommerce.

Sfaturile de mai jos sunt clasificate de la impact ridicat la impact redus asupra performanței. Unii au o influență mai mare asupra scorului dvs. final de performanță, dar toți au un lucru în comun: vă veți accelera site-ul WooCommerce urmând fiecare sfat.

Să vedem câteva tehnici ușoare pe care le puteți urma pentru a optimiza performanța și a vă face site-ul WooCommerce mai rapid:

1. Alegeți un furnizor bun de găzduire
2. Utilizați HTTP2
3. Utilizați un plugin pentru cache
4. Alegeți o temă rapidă WooCommerce
5. Reduceți timpul de execuție JS
6. Optimizați imaginile produsului
7. CSS Optimization (Optimizarea livrării CSS și eliminarea CSS neutilizate)
8. Lazy Load pentru imagini și videoclipuri
9. Optimizarea codului
10. Utilizați o rețea de livrare de conținut pentru a furniza resurse statice CDN
11. Optimizarea bazei de date

Bonus: Nu uitați de optimizarea Core Web Vitals!

Să începem cu tehnicile care au cel mai mare impact asupra optimizării vitezei paginii WooCommerce.

1.Alegeți un Furnizor Bun de Găzduire

Prioritate: Mare

Vânzarea de produse cu WooCommerce implică adesea conținut cu imagini, text, galerii foto, videoclipuri și plăți online. Toate aceste funcții trebuie redate rapid pe site-ul dvs. într-un mediu sigur. Ați pune datele cardului dvs. de credit pe un site lent, care nu inspiră încredere? Mai mult ca sigur că nu o vei face.

În primul rând, trebuie să luați în considerare cât de rapid este serviciul dvs. de găzduire web. În al doilea rând, ce fel de asistență pentru clienți oferă acest furnizor? În al treilea rând și în cele din urmă, sunt în siguranță?

Unele dintre tacticile pe care trebuie să le căutați sunt:

• Verificați scorul de disponibilitate al găzduirii (imaginați-vă vânzările pe care le-ați putea pierde dacă găzduirea dvs. vă va dezamăgi).
• Caching la nivel de server (care este configurat pentru WooCommerce).
• O rețea de livrare de conținut (CDN), mai ales dacă aveți clienți internaționali.
• Mai multe centre de date, astfel încât să puteți alege locația în funcție de locul în care se află clienții dvs. principali.
• Lățimea de bandă și stocarea pe care le pun la dispoziția produselor dvs.
• Certificat SSL (doriți ca magazinul dvs. online să fie în siguranță).
• Copii de siguranță automate (poate doriți să reveniți la o versiune mai veche a site-ului dvs. WordPress dacă o actualizare nu merge bine, de exemplu).
• Site-uri de Staging pentru a testa noile produse sau caracteristici noi înainte de a intra în mediul live.
• Instalarea automată a WooCommerce pentru a începe mai repede (unele gazde precum SiteGround preinstalează WooCommerce).
• Verificați tipul de găzduire pe care îl oferă. Dacă aveți mii de produse cu trafic lunar ridicat, este posibil să doriți un server dedicat.
• Asigurați-vă că furnizorul dvs. de găzduire oferă HTTP/2. De ce?

Aceasta ne duce la următorul punct: Importanța extremă a HTTP/2.

2.Utilizați HTTP/2

Prioritate: Mare

HTTP/2 are potențialul de a crește viteza paginii site-ului dvs. web, permițând browserelor să proceseze simultan mai multe solicitări printr-o singură conexiune. Acest lucru economisește lățimea de bandă, permițând timpi mai mari de încărcare a paginii.

Înainte, browserul dvs. trebuia să se întoarcă la server pentru a prelua fiecare resursă. Acum, colectează toate resursele și le transferă în același timp.

CSS Tricks explică foarte bine diferența dintre ambele:

3.Utilizați un Plugin pentru Cache

Prioritate: Mare

Cache-ul este o modalitate excelentă de a vă accelera magazinul WooCommerce. Este singurul lucru de care aveți nevoie pentru un site de comerț electronic care funcționează fără probleme și rapid, de la timpul de încărcare a paginii de verificare până la paginile cu detalii despre produs. Memorarea în cache îmbunătățește performanța prin reducerea proceselor consumatoare de timp, cum ar fi recuperarea tuturor informațiilor stocate sau generarea de copii noi pentru fiecare vizitator care solicită conținut.

Cele mai bune caracteristici pe care ar trebui să le căutați într-un plugin cache sunt în principal preîncărcarea cache-ului, optimizarea fișierelor CSS și JS, Lazy load pentru imagini și videoclipuri, compresia Gzip, posibilitatea de a amâna încărcarea JavaScript și optimizarea fonturilor.

Dacă vă întrebați care este cel mai bun plugin de cache pentru WooCommerce, ar trebui să aruncați o privire la WP Rocket. Are toate caracteristicile indispensabile și funcționează excelent cu WooCommerce. WP Rocket este recomandat și de site-ul oficial al WooCommerce:

Setările ar trebui să fie deja activate, dar pentru orice eventualitate, asigurați-vă că excludeți din cache următoarele pagini implicite WooCommerce:

• Cart
• Contul meu
• Checkout

WP Rocket este ușor de configurat și aplică 80% din cele mai bune practici de performanță web. Derulați până la rezultatele testelor de viteză pentru a vedea impactul pozitiv al WP Rocket pe un site WooCommerce.

4.Alegeți o Temă Rapidă WooCommerce

Prioritate: Mare

Viteza WooCommerce este esențială pentru creșterea ratelor de conversie și creșterea veniturilor pentru site-ul dvs. Temele de top WooCommerce pot face sau nărui succesul unui magazin, unele având efecte incredibile asupra timpilor de încărcare. Pentru a vă ajuta să găsiți cea mai bună pentru nevoile dvs., am analizat câteva teme WooCommerce folosind Lighthouse; iată patru câștigători cu performanțe rapide:

• Blocksy
• The Page Builder Framework
• Neve
• Astra

De asemenea, Kinsta a efectuat un audit pentru a identifica scorul de performanță pentru cele mai populare teme WordPress:

5.Reduceți Timpul de Execuție JS

Prioritate: Mare

Dacă JavaScript durează mult timp pentru a se executa, atunci va încetini performanța paginii. Google Lighthouse ia în considerare timpul de execuție JS atunci când măsoară gradul de performanță. Vă avertizează dacă executarea JavaScript durează mai mult de două secunde. Dacă depășește 3,5 s, atunci veți obține un steguleț roșu:

Pentru a reduce timpul de execuție JS, WebDev oferă trei sfaturi importante:

• Reduceți și comprimați codul.
• Eliminați codul JS neutilizat.
• Reduceți călătoriile în rețea prin memorarea în cache a codului.

Aceste recomandări fac parte din caracteristicile WP Rocket. WP Rocket vă ajută să vă optimizați fișierele JS în două moduri: prin întârzierea resurselor JS (ceea ce înseamnă că fișierele JS vor fi încărcate numai atunci când există o interacțiune cu utilizatorul) și încărcarea JS numai atunci când este necesar.

6.Optimizați Imaginile Produsului

Prioritate: Mare

Luați întotdeauna fotografia produsului în serios. Imaginile reprezintă o parte importantă a construirii unui site de comerț electronic de succes, deoarece doriți să convingeți vizitatorii să cumpere produsul dvs. Cu toate acestea, trebuie să găsiți echilibrul potrivit între calitate și dimensiune. O imagine de 2 MB va arăta bine, dar veți vedea că scorul dvs. de viteză va fi afectat dramatic.

Cea mai bună soluție este optimizarea imaginilor fiecărui produs, mai ales dacă aveți galerii, bannere de promovare și tot felul de suporturi pe magazinul dvs. online. Înseamnă să le reduceți dimensiunea, să comprimați și să le convertiți în cel mai bun format fără a compromite prea mult calitatea.

Există două modalități de optimizare a imaginilor produsului dvs. pentru a accelera site-ul dvs. WooCommerce:

1. Manual, folosind instrumente precum Adobe Photoshop, Gimp, Paint.NET, Affinity photo, etc. Cu toate acestea, unele programe software de proiectare pot fi costisitoare sau pot fi greoaie.
2. În mod automat, folosind instrumente online sau un plugin precum Imagify, Ewww optimizer, TinyJPG | TinyPNG etc. Aruncă o privire la lista noastră cu cele mai bune pluginuri de optimizare a imaginii pentru WordPress.

Imagify este realizat de aceeași echipă care a creat WP Rocket. Au creat un plugin foarte intuitiv care comprimă automat imaginile folosind trei niveluri:

Normal, Agresiv și Ultra. Pluginul este gratuit pentru 25 MB de imagini pe lună și vă convertește toate fotografiile în WebP, un nou format care vă accelerează site-ul!

Ce se întâmplă dacă ați încărcat deja toate imaginile produsului dvs. pe WordPress? Nu vă faceți griji – Imagify vă poate optimiza toate imaginile existente ale produselor WooCommerce.

Acum că am văzut ce poate afecta cel mai mult viteza site-ului dvs. WooCommerce, să vedem următoarele recomandări (care afectează în continuare performanța la un nivel mediu).

7.Optimizarea CSS (Optimizarea livrării CSS și eliminarea CSS neutilizate)

Prioritate: Medie

Optimizarea CSS crește viteza site-ului dvs. WooCommerce. Acest lucru se poate face în două moduri:

1. Eliminarea CSS neutilizate (pentru a reduce dimensiunea paginii și solicitările HTTP pentru o performanță mai bună)
2. Optimizarea livrării CSS-ului dvs. (pentru a elimina blocarea randamentului CSS pe site-ul dvs. web pentru un timp de încărcare perceput mai rapid)

Ca soluție, pluginul WP Rocket oferă aceste două opțiuni – ar trebui să alegeți una dintre ele. Vă recomandăm să optimizați livrarea CSS în cazul în care funcția Eliminați CSS neutilizat nu funcționează pentru dvs.

Oricum, puteți activa fiecare dintre ele pur și simplu bifând caseta respectivă:

8.Lazy Load pentru Imagini și Videoclipuri

Prioritate: Medie

O altă modalitate de a vă accelera site-ul WooCommerce este să activați Lazy Load pentru imagini și videoclipuri. Lazy loading este o strategie de identificare a resurselor non-blocante (non-critice) și încărcarea acestora numai atunci când este necesar.

Conținutul vizibil deasupra dosarului este afișat cu prioritate, dar întârzie redarea conținutului de sub dosar. Această tehnică de optimizare permite afișarea mai întâi a imaginilor vizualizate de utilizatori.

Google însuși recomandă utilizarea lazy-loading pentru a „amâna imaginile de pe ecran”, așa cum se arată mai jos:

Pentru a aplica scriptul de lazy loading pe imagini și videoclipuri, îl puteți face manual folosind atributul de încărcare:

<img src=”image.jpg” alt=”…” loading=”lazy”>

<iframe src=”video-player.html” title=”…”loading=”lazy”></iframe>

Dacă nu vă simțiți confortabil adăugând eticheta manual pe fiecare imagine, atunci utilizați un plugin pentru a o face. Am selectat cele mai bune 7 plugin-uri WordPress pentru lazy loading pe care le puteți folosi pentru a vă accelera site-ul WooCommerce. Dacă doriți să evitați utilizarea unui alt plugin, și dacă folosiți deja WP Rocket – acesta oferă opțiunea Lazy Load:

9.Optimizarea codului

Prioritate: Medie

Optimizarea codului, cum ar fi minificarea JavaScript și CSS și comprimarea fișierelor, vor accelera site-ul dvs. WooCommerce.

Una dintre cele mai mari probleme cu care se confruntă dezvoltatorii atunci când creează fișiere HTML, CSS și JS este păstrarea codului lizibil. Ei tind să folosească spațierea, comentariile și variabilele bine denumite pentru a fi ușor de urmărit. Cu toate acestea, acest lucru devine oarecum problematic, deoarece ocupă mai mult spațiu, care poate fi dăunător în timpul perioadelor de încărcare în care contează fiecare milisecundă.

Pe scurt, sunt două moduri de comprimare a fișierelor și de reducere a codului:

• Manual (dar aveți grijă cu acesta, dacă vă reduceți codul folosind un editor de text, ștergerea unui caracter util vă poate rupe site-ul).
• Automat cu un plugin WordPress, cum ar fi WP Rocket, care minimizează codul CSS și JS cu câteva clicuri:

10.Folosiți o Rețea de Livrare de Conținut pentru a Furniza Resurse Statice – CDN

Prioritate: Medie

Un CDN este util pentru a vă livra rapid conținutul într-o rețea de servere din întreaga lume. Acesta vă va accelera site-ul WooCommerce, redând produsele și conținutul magazinului dvs. aproape imediat. Acest lucru este crucial dacă aveți vizitatori în USA, dar și în ASIA, de exemplu.

O soluție prealabilă este utilizarea RocketCDN, deoarece este complet integrată cu WP Rocket. Dacă aveți CDN-ul dvs., nu vă faceți griji, puteți să-l adăugați și pe al vostru:

11.Optimizarea Bazei de Date

Prioritate: Scăzută

Optimizarea bazei de date nu va avea un impact atât de mare asupra vitezei dvs., dar este totuși recomandat să o păstrați curată și optimizată. Pentru a crește viteza site-ului dvs. Woocommerce, trebuie să profitați de toate avantajele: poate fi necesar să ștergeți câteva tabele vechi lăsate de pluginurile vechi sau pur și simplu să reduceți timpul de răspuns al sistemului de baze de date.

De obicei, puteți rula această optimizare manual sau din panoul dvs. PhpMyAdmin. Dar, din nou, dacă preferați să rămâneți în tabloul de bord WordPress și să utilizați un singur plugin de performanță, vă sugerăm să utilizați opțiunea de optimizare a bazei de date WP Rocket:

Acele tehnici aplicabile site-ului dvs. WooCommerce sunt cruciale dacă doriți să accelerați site-ul dvs. Din iunie 2021, unele KPI-uri au intrat în jocul de performanță: Core Web Vitals. Acești indicatori măsoară scorul Google Experience Page și vor avea un impact asupra performanței dvs. SEO. Să vedem care este legătura dintre performanță și Core Web Vitals în continuarea articolului.

Bonus: Nu Uitați să vă Optimizați Core Web Vitals

Nu puteți optimiza cu adevărat performanța fără a îmbunătăți valorile Core Web Vitals.

Cu cât oferiți o experiență excelentă pentru utilizator, cu atât scorul dvs. va fi mai bun. Magazinul dvs. va avea, de asemenea, mai multe șanse să fie clasat pe prima pagină a rezultatelor Google!

Dacă doriți să obțineți un scor de peste 90 în PageSpeed Insights, ar trebui să optimizați First Input Delay, Largest Contentful Paint și Cumulative Layout Shift.

Doriți un scor verde (peste 90) în Google PageSpeed Insights? Începeți să utilizați pluginul WP Rocket astăzi! Aplică automat 80% din cele mai bune practici de performanță web. Iar răspunsul la: Cum să vă Accelerați Site-ul WooCommerce? Va fii mult mai simplu pentru dvs. Succes!

Recomandarea autorului:

• Cum să Accelerezi un Backend WooCommerce Lent?