Cum Reduci Greutatea Paginii pe WordPress

Cum Reduci Greutate Paginii pe WordPress

Cuprins: arată

Când vine vorba de greutatea paginii web, dimensiunea contează. La urma urmei, cu cât dimensiunea fișierului unei pagini web este mai mică, cu atât se va încărca mai repede.

Greutatea paginii – adică dimensiunea paginii sau umflarea paginii – se referă la dimensiunea totală a unei anumite pagini web, inclusiv toate fișierele care sunt utilizate pentru a crea pagina: documente HTML, foi de stil, imagini, scripturi și alte medii.

Este o altă valoare a site-ului de urmărit, pe lângă viteza paginii, timpul de funcționare, timpul până la primul octet, solicitările HTTP etc.

Dar chiar contează? Este o valoare semnificativă? Și cum ar trebui să reduceți dimensiunea paginii și să vă accelerați site-ul WordPress?

Hai să aruncăm o privire.

Site Mediu Pentru Desktop în 2021 este de 2038,4 kb

În anii 1990, site-urile web erau destul de simple și constau în fișiere HTML simple și imagini mici (și în GIF-uri în construcție!). În zilele noastre, acestea au crescut pentru a include diverse fișiere HTML, CSS și JavaScript, imagini, videoclipuri, fonturi și alte tipuri de fișiere.

Dimensiunea medie a paginii web în 2010 a fost de 467,7 kb, comparativ cu 2038,4 kb în 2021, conform datelor colectate de Arhiva HTTP.

Incredibil, dimensiunea paginilor web mobile a crescut cu 336% din 2010, deși ar trebui să subliniez că arhiva HTTP a început pentru prima dată să colecteze date despre greutatea paginilor web mobile în mai 2011 – dimensiunea medie a paginilor web mobile pe atunci era de 144,8 kb.

Pe măsură ce site-urile web au evoluat de-a lungul anilor, dimensiunea medie a unei pagini web a crescut exponențial. Deși există câteva avertismente care merită subliniate înainte de a continua:

Mărimea medie a paginilor web, așa cum este publicată de Arhiva HTTP, este o medie luată dintr-un set de date foarte mare. Reprezintă un site web „tipic”? Poate că nu. Adică, ce este chiar un site tipic?
Cel mai bine este să nu utilizați aceste numere din Arhiva HTTP ca reper pentru propriul site web. Sunt tendințe istorice.
Unele site-uri web s-au redus de-a lungul timpului. În timp ce unele site-uri web au folosit mass-media în abordarea lor, cu videoclipuri, imagini pe ecran complet, fonturi personalizate și alte elemente de design, altele au ales o abordare mai minimalistă.

Videoclipul Reprezintă 65,9% din Greutatea Medie a Paginii

De mult timp, dezvoltatorii au fost îngrijorați de dimensiunea imaginilor și de cât de mult reprezintă acestea pentru dimensiunea totală a paginii. Dar no… Vezi cum videoclipurile au depășit complet imaginile:

Cele mai recente date HTTP Archive arată că videoclipul reprezintă acum două treimi din dimensiunea totală medie a paginii web.

Pentru a pune acest lucru în perspectivă, greutatea medie a videoclipurilor a fost de doar 286,3 kb pentru desktop în mai 2016. Interesant, dimensiunea mediană a videoclipurilor în 2021 este mai mare pe mobil decât pe desktop.

Utilizarea video a explodat în ultimii ani. Tot mai multe site-uri web folosesc anteturi video și alte elemente media. Potrivit WordStream, 87% dintre agențiile de marketing online folosesc conținut video, o treime din activitatea online este cheltuită pe vizionarea videoclipurilor și peste jumătate din conținutul video este vizionat pe mobil.

Fonturile Personalizate nu Ajung Nicăieri

Fonturile web contribuie la dimensiunea paginii, dar, după cum arată statisticile, creșterea lor în popularitate nu este cu adevărat un motiv de îngrijorare. În noiembrie 2010, fonturile reprezentau 59,2 kb din dimensiunea totală a paginii, comparativ cu 132,1 kb în ianuarie 2021.

Și mai interesant este modul în care numărul mediu de solicitări HTTP pentru fonturi a ajuns la patru în 2015, a scăzut la trei în 2016 și a rămas constant la patru din 2017 – doar desktopul a ajuns la cinci. Acesta ar putea fi un indiciu că designerii și dezvoltatorii s-au hotărât pe un număr optim de fonturi web.

Să Nu Uităm Scripturile și Foile de Stil

Ponderea medie a fișierelor JavaScript continuă să crească, crescând cu 316,4% de la sfârșitul anului 2010. Numărul mediu de solicitări HTTP pentru JavaScript a crescut, de asemenea.

Octeții CSS au crescut constant – media în 2021 este de 73,3 kb pe desktop și 68,7 kb pe mobil.

Dimensiunea Paginii Chiar Contează? Internetul nu Devine mai Rapid?

Așa cum bicicliștii poartă îmbrăcăminte strânsă pe piele, care este aerodinamică, evitând îmbrăcămintea largă care se umflă în vânt, dezvoltatorii ar trebui să își mențină locațiile cât mai slabe posibil, astfel încât să poată funcționa și la viteze optime.

În timp ce greutatea paginii este doar una dintre numeroasele valori ale site-ului web și sincer, nu ar trebui să fie prioritatea ta numărul unu, este totuși un factor important de luat în considerare, deoarece contribuie direct la viteza paginii.

Da, internetul devine mai rapid. Browserele, memorarea în cache, rețelele mai rapide, CDN-urile și alte tehnologii fac web-ul mai rapid pentru utilizatori. Dar acesta nu este un motiv pentru a permite site-ului dvs. să transporte mai multă grăsime, ca să spunem așa.

Radware urmărește timpii de încărcare a primelor 100 de site-uri de comerț electronic din 2011 și a constatat că atât timpii de încărcare, cât și timpul de interacțiune au avut de suferit semnificativ. Cauza? Dimensiunea și complexitatea paginii. Pe măsură ce paginile devin mai umflate și mai complexe alteori, aceasta continuă cu o tendință de timpi de încărcare mai lenți.

Care este Dimensiunea Ideală a Unei Pagini Web?

Expertul în performanță web, Tammy Everts, recomandă 1MB ca dimensiune ideală pentru paginile web cu încărcare rapidă. Ea continuă să scrie că multe companii vizează 1 MB pentru paginile lor ca parte a bugetului lor de performanță.

Pentru mai multe despre bugetele de performanță, consultați acest articol a lui Brian Jackson.

Cum Rămâne cu Utilizatorii dvs. de Telefonie Mobilă?

Am tratat anterior performanța percepută pe diferite blog-uri în articolele noastre, așa că știți totul despre cum este posibil ca site-urile web să se simtă în continuare mai rapide decât sunt de fapt, pentru a obține rezultate în experiența utilizatorului. Dar îmbunătățirea performanței percepute nu este întotdeauna răspunsul, mai ales când vine vorba de mobil.

Utilizatorii de telefonie mobilă care se confruntă cu constrângeri de lățime de bandă și/sau limite de date pur și simplu nu au timpul sau alocația de date pentru a descărca site-uri web umflate, așa că site-ul dvs. trebuie să fie cât mai eficient posibil pentru acești utilizatori. Pentru că dacă site-ul tău nu se încarcă suficient de repede pentru ei, pur și simplu vor părăsi site-ul tău.

Lățimea de bandă și limitele de date ale utilizatorilor dvs. vor varia de la o țară la alta, dar există un calculator online grozav, Cât costă site-ul meu, care vă poate spune costul, în dolari, al paginilor dvs. din locații din întreaga lume. Vă va deschide ochii asupra modului în care utilizatorii de telefonie mobilă văd paginile dvs. din lumea întâi față de țările din lumea a treia.

6 Sfaturi pentru a Reduce Greutatea Paginii pe WordPress

1.Optimizează imagini

Imaginile sunt ca fructele atunci când vine vorba de îmbunătățirea greutății paginii. Adesea, acestea sunt fișierele care durează cel mai mult să se încarce pe o pagină web, dar sunt relativ ușor de optimizat.

Începeți prin a vă face timp să vă revizuiți imaginile și să le eliminați pe cele de care nu aveți nevoie. Apoi, comprimați-le cu un instrument de optimizare a imaginii, cum ar fi Imagify. Acest lucru va elimina informațiile inutile despre fișier și va ajuta imaginea să se încarce mai rapid.

Crearea de sprite-uri CSS poate ajuta și mai mult la reducerea greutății paginii. Această tehnică vă permite să reduceți mai multe imagini într-o singură imagine. Apoi, folosind CSS, puteți manipula sprite-ul și puteți afișa doar o anumită parte a acestuia pe pagină. Există câteva instrumente grozave care pot ajuta la crearea de sprite-uri CSS, cum ar fi SpriteMe.

Lazy loading pentru imagini pot îmbunătăți timpul de încărcare a paginii, în special pentru utilizatorii de dispozitive mobile – și este o caracteristică pe care o puteți activa în WP Rocket.

Obțineți WP Rocket acum și testați imediat îmbunătățirea!

2.Minimizați și Combinați Elementele CSS și JavaScript

Minimizarea și combinarea foilor de stil și a scripturilor site-ului dvs. vă poate eficientiza și mai mult resursele și poate reduce codul inutil de pe site. Acest lucru nu numai că ajută la reducerea greutății paginii, dar poate și reduce numărul de solicitări HTTP necesare pentru a vă încărca site-ul.

WP Rocket este cel mai simplu mod de a minimiza și comprima fișierele CSS și JS în câteva clicuri. De fapt, puteți micșora și combina fișierele în fila „Fișiere statice”. Verificați fișierele pe care doriți să le micșorați și să le combinați. Faceți clic pe „Salvați modificările” când ați terminat.

Minificare CSS și JavaScript în WP Rocket

3.Utilizați o Rețea de Livrare de Conținut CDN

Utilizarea unui CDN poate accelera cât de repede se încarcă paginile dvs. pentru utilizatori în locuri aflate la o distanță mare de locul în care se află serverul dvs., adică trafic internațional. Pentru mai multe despre cum funcționează CDN-urile și pentru a-l găsi pe cel mai potrivit pentru dvs., consultați articolul: Cele mai bune rețele de livrare de conținut pentru WordPress.

CloudFlare, un CDN popular poate fi integrat cu ușurință cu WP Rocket. Pentru a face acest lucru, accesați fila „CDN” din WP Rocket pentru a activa CloudFlare și apoi adăugați-vă contul. Pentru mai multe, consultați documentația WP Rocket despre cum să utilizați CloudFlare cu WP Rocket.

4.Utilizați Memorarea în Cache a Browserului

Dacă browserul utilizatorului poate stoca în cache fișiere statice, nu va trebui neapărat să le descarce din nou data viitoare când vă vizitează site-ul. Prin urmare, asigurați-vă că activați memorarea în cache a browserului pentru site-ul dvs. în WP Rocket. Memorarea în cache a browserului este aplicată automat pentru serverele Apache, deci nu este nevoie ca utilizatorii să efectueze pași suplimentari. Dar cei de pe serverele NGINX pot folosi Rocket-Nginx, o configurație NGINX care face WP-Rocket și mai rapid prin servirea directă a paginilor statice fără a încărca WordPress sau PHP.

5.Reduceți Fonturile Web Inutile

Chiar aveți nevoie de opt fonturi pe site-ul dvs.? Sau vor fi suficiente doar două (unul pentru titluri și unul pentru textul paragrafului) pentru ași face treaba?

Tipografia este fundamentală pentru un design web bun și modern – îmbunătățește lizibilitatea, accesibilitatea și contribuie la branding. Dar are și un cost de performanță, deoarece fiecare font pe care îl utilizați este o resursă suplimentară pe care vizitatorii trebuie să o descarce atunci când vă vizitează site-ul.

Juriul stabilește exact câte fonturi sunt prea multe, deși regula generală este că trei reprezintă mult și cel mai bine este să rămâneți cu două.

6.Păstrați-vă Site-ul Slab

Mai puțin înseamnă mai mult. Dacă nu mai utilizați un plugin, o temă, un font web, un script sau alte resurse pe site-ul dvs., eliminați-le. Dacă credeți că ar putea fi nevoie să o faceți mai târziu, ar trebui să îl eliminați – îl puteți adăuga oricând înapoi mai târziu.

Asigurați-vă că monitorizați și revizuiți în mod regulat resursele de pe site-ul dvs. web, astfel încât să utilizați doar ceea ce aveți absolut nevoie și nimic mai mult. Această practică bună nu este doar pentru îmbunătățirea performanței site-ului, ci și pentru securitatea site-ului.

Este posibil să existe reguli CSS neutilizate care să blocheze site-ul dvs., caz în care puteți utiliza instrumente precum CSS neutilizat sau puteți profita de noul WP Rocket pentru a elimina CSS neutilizat cu un singur clic!

Concluzie

Greutatea paginii este un factor important care influențează direct viteza paginii. Dar este și doar o valoare critică a performanței site-ului care merită monitorizată. Așadar, testați performanța site-ului dvs. WordPress pentru a obține o imagine de ansamblu a dimensiunii paginii înainte de a începe oricare dintre sfaturile de mai sus.

Rețineți că sfaturile explicate vă vor ajuta să vă îmbunătățiți scorul de performanță și notele Core Web Vitals!

Cum Reduci Greutatea Paginii pe WordPress – Ghid cu Bune Practici