Top 7 teme WordPress pentru o bună bază web Vitals (clasament 2023)

Publicat: 2023-03-14

Există peste 10.500 de teme gratuite disponibile în depozitul WordPress.

Iar numărul continuă să crească pe zi ce trece.

Deci, cum le-ați putea identifica pe cele mai bune? Ar trebui să testați fiecare temă care vă place și să comparați toate valorile de performanță, scorurile și milisecundele?

Să fim sinceri - nu sună ca o sarcină pe care vrei să-ți petreci întreaga zi.

Mai ales când am făcut-o pentru tine!

Așa că, în loc să pierdeți timpul activând, dezactivând, testând, notând rezultatele și comparând, citiți mai departe pentru a afla cele 7 teme WordPress care s-au evidențiat după cercetarea și testarea noastră amănunțită.

Cum am testat cei mai buni candidați de temă WordPress pentru o bună bază Web Vitals

Notă: Cea mai bună modalitate de a aproxima performanța unei teme în lumea reală fără a genera trafic a fost să te bazezi pe Core Web Vitals bazat pe laborator. Experiența noastră arată că temele care trec LCP, CLS și TBT în laborator au șanse mai mari de a reproduce aceleași rezultate bune în domeniu.

Ne-am început cercetarea prin a colecta un număr mare de teme cu care dezvoltatorii noștri WordPress au lucrat în trecut, împreună cu teme bazate pe popularitatea lor în depozitul WP.

Apoi, am început procesul lung de testare a vitezei:

  • Instalați și activați tema pe o instalare WordPress goală.
  • Lăsați tema așa cum este - fără conținut adăugat, meniuri, pagini, postări sau pluginuri.
  • Rulați site-ul web cu tema prin PageSpeed ​​Insights de la Google.
  • Rulați tema prin GTmetrix.
  • Rulați tema prin Pingdom Speed ​​Test.
  • Adunați toate rezultatele și comparați-le.

Am decis să folosim trei instrumente de testare, deoarece fiecare are standarde și valori diferite. Am vrut să ne asigurăm că un instrument nu dă rezultate mai bune sau mai proaste decât altul.

În fiecare instrument, am decis să monitorizăm anumite valori:

PageSpeed ​​Insights

PageSpeed ​​Insights (PSI) de la Google este instrumentul de bază pentru testarea unei teme pentru viteză și Core Web Vitals. Având în vedere că nu am avut trafic în lumea reală, ne-am concentrat pe Scorul de performanță și pe valorile acestuia atât pe dispozitive mobile, cât și pe desktop.

Scorul de performanță Google PSI

Iată valorile pe care ne-am concentrat:

  • Scor de performanță . Este din 100 și se bazează pe următoarele valori - LCP, CLS, Speed ​​Index, TBT și FCP. Fiecare metrică are o greutate diferită.
  • Prima vopsea satisfăcătoare. FCP este timpul necesar browserului pentru a vizualiza prima bucată de conținut DOM.
  • Cea mai mare vopsea plină de conținut. LCP măsoară cât timp durează până când cel mai mare element din partea superioară a paginii se încarcă pe o pagină.
  • Indicele de viteză . Acesta arată cât de repede este populat vizibil conținutul unei pagini. Mai jos este mai bine.
  • Timp total de blocare. Arată cât de lipsită de răspuns este o pagină înainte de a deveni complet interactivă.
  • Schimbare cumulativă a aspectului. CLS măsoară cât de mult afectează schimbările neașteptate ale aspectului experiența utilizatorului pe o pagină.

GTmetrix

GTmetrix analizează viteza și optimizarea unui site web, făcându-l un instrument valoros pentru identificarea problemelor de performanță și pentru a determina dacă o temă conține un număr excesiv de fișiere inutile.

Grad GTmetrix

Valorile pe care le-am încadrat au fost:

  • Grad GTmetrix. Este o notă ponderată a punctajelor de performanță și de structură.
  • Scorul de performanță. Este Scorul de performanță Lighthouse, capturat de GTmetrix, cu auditurile personalizate, Opțiunile de analiză, browserul și specificațiile hardware.
  • Structura Scor . Este o evaluare proprie a auditurilor Lighthouse și Custom GTmetrix. Reprezintă cât de bine este construită o temă/pagină pentru o performanță optimă.
  • Web Vitals. Valorile Core Web Vitals bazate pe laborator care măsoară dacă o temă/pagină oferă o experiență generală excelentă.
  • Timp de încărcare. Cât timp durează până când o pagină web se încarcă complet.

Pingdom

Deși Pingdom are asemănări cu GTmetrix, preferăm să folosim ambele instrumente simultan, deoarece oferă valori diferite. De asemenea, Pingdom oferă o modalitate ușoară de a testa o pagină web din diferite locații.

Toate temele au fost testate din America de Nord - SUA - Washington DC

Test de viteză a site-ului Pingdom

Valori pe care le-am monitorizat:

  • Nota de performanță Aceasta este o notă cumulată din 100.
  • Timp de încărcare. Timpul necesar Pingdom pentru a încărca întregul site web cu o temă instalată.
  • Mărimea paginii. Dimensiunea tuturor fișierelor de site ale paginii. Tema are un impact enorm asupra acesteia.
  • Cereri. Numărul de solicitări de server pentru a livra utilizatorului tema și conținutul site-ului.

Rezumat rapid al celor mai performante teme WordPress

Înainte de a aprofunda fiecare temă, caracteristicile sale, prețurile și scorurile de performanță, iată un rezumat al testelor noastre.

Notă: Următorul clasament se bazează pe rezultatele Pingdom și, mai precis, pe dimensiunea paginii și timpul de încărcare. Mai târziu în articol, trecem în revistă fiecare temă și rezultatele sale CWV.

  1. Douăzeci și douăzeci și trei –Dimensiunea paginii:26,3KB;Timp de încărcare:520 ms
  2. Salut Elementor –Dimensiunea paginii: 32.7KB;Timp de încărcare:520 ms
  3. GeneratePress –Dimensiunea paginii: 37.7KB;Timp de încărcare:538 ms
  4. Neve –Dimensiunea paginii: 42.4KB;Timp de încărcare:552 ms
  5. Sydney –Dimensiunea paginii: 48.1KB;Timp de încărcare:560 ms
  6. Astra –Dimensiunea paginii: 48.5KB;Timp de încărcare:619 ms
  7. Kadence –Dimensiunea paginii: 54.8KB;Timp de încărcare:628 ms

Rezultatele testului de performanță a temelor WordPress

Cele mai bune teme WordPress pentru trecerea principalelor elemente vitale web în 2023

Caracteristici, prețuri, rezultate de performanță - să începem cu o prezentare detaliată a fiecărui concurent.

1. Twenty Twenty-Three - Cei mai buni boboci cu Gutenberg

Twenty Twenty Three Tema WordPress

Tema implicită Twenty Twenty-Three a fost dezvoltată pentru a utiliza cele mai recente instrumente de design introduse în WordPress 6.1.

Tema utilizează o bază simplă și neaglomerată și oferă zece variații de stil distincte contribuite de comunitatea WordPress.

Twenty Twenty-Three vă permite să creați cu ușurință un site web de orice nivel de complexitate, fie utilizând stilurile pre-proiectate, fie adoptând o abordare mai practică și personalizându-l după bunul plac.

Ceea ce este izbitor la cea mai recentă temă implicită WordPress este simplitatea și ușurința sa. Twenty Twenty-Three este flexibil și se potrivește perfect cu funcțiile de editare a site-ului lui Gutenberg, cum ar fi editarea de șabloane, variații de stil, tipografie și modele de bloc.

Pret: Gratuit

Instalații active: 800.000+

Cele mai bune caracteristici: design minimalist, ușor, stiluri pre-proiectate

Potrivit pentru: testarea mediului și construirea unei varietăți de site-uri web

Ce au arătat testele noastre

Twenty Twenty-Three a obținut rezultate remarcabile la toate cele trei teste. Mai important, Core Web Vitals bazat pe laborator a fost în verde, o condiție prealabilă pentru o performanță excelentă în lumea reală.

Douăzeci și douăzeci și trei de rezultate ale testului de performanță a temei WordPress

În PSI, a obținut un scor perfect pe mobil și desktop, obținând 100/100 la ambele teste. De asemenea, a obținut o notă A la GTmetrix (scor de performanță 98%, scor de structură 100%) cu 1,4 secunde în timpul de încărcare.

Testele noastre Pingdom au confirmat eticheta „ușoară” de Twenty Twenty-Three. Cu doar 26,3 KB dimensiunea paginii, această temă a fost câștigătoarea clară din tot ce am testat.

2. Bună ziua Elementor - E-commerce go to

Bună ziua Elementor WordPress Theme

Elementor este folosit de 8,0% din toate site-urile web, ceea ce nu este surprinzător având în vedere cât de ușor este să construiți o pagină web. Ei bine, aceiași dezvoltatori responsabili pentru crearea unuia dintre cei mai populari constructori de pagini au produs o temă rapidă și ușoară numită Hello Elementor.

Tema este promovată ca fiind rapidă și flexibilă. După cum v-ați putea aștepta, se integrează perfect cu Elementor și cu numeroase alte plugin-uri, cum ar fi WooCommerce, Advanced Custom Fields, Yoast și altele.

În plus, oferă peste 100 de modele gata făcute, ceea ce vă permite să creați un site web perfect funcțional de la zero.

Pret: Gratuit

Instalații active: 1+ milion

Cele mai bune caracteristici: ușoare, peste 100 de modele gata făcute, personalizabile

Potrivit pentru: Construirea unui site web de la zero

Ce au arătat testele noastre

La fel ca Twenty Twenty-Three, Hello Elementor a obținut rezultate excelente CWV atât pe desktop, cât și pe mobil.

Bună ziua Elementor Rezultatele testului de performanță

A marcat perfect pe GTmetrix și Pingdom. De fapt, testele noastre Pingdom au clasat-o a doua cea mai ușoară temă, cu un timp de încărcare de 520 ms, la fel ca tema implicită WordPress.

Ar trebui să știți că, deși este comercializat ca fiind ușor, Hello Elementor nu este personalizabil de la sine. Va trebui să adăugați Elementor ca soluție de creare a paginii, ceea ce ar putea afecta performanța site-ului dvs.

3. GeneratePress - Cel bazat pe blocuri

Tema WordPress GeneratePress

GeneratePress este o temă WordPress concepută pentru a prioritiza viteza, gradul de utilizare și accesibilitatea.

Utilizarea lui Gutenberg vă garantează libertatea atunci când vă creați conținut. Dacă utilizați generatori de pagini, v-ar plăcea să auziți că GeneratePress este pe deplin compatibil cu toate cele mai importante, inclusiv Beaver Builder și Elementor.

GeneratePress este pe deplin receptiv și a fost tradus în peste 25 de limbi. În plus, include peste 60 de comenzi de culoare, tipografie dinamică puternică, 5 locații de navigare, 5 forme de bară laterală, meniuri drop-down și 9 zone de widget-uri.

Pret: Gratuit; 59 USD/an, 249 USD/pe viață

Instalații active: 500.000+

Cele mai bune caracteristici: orientat spre viteză, receptiv, compatibil cu creatorii de pagini

Potrivit pentru: Toate tipurile de site-uri web

Ce au arătat testele noastre

Un lucru care ne-a atras atenția atunci când căutăm teme a fost declarația GeneratePress „100% scoruri de pagină”. Așa că eram dornici să testăm asta.

Putem spune că GeneratePress a vorbit și a mers pe jos. A obținut scoruri de performanță aproape perfecte la toate cele trei teste:

Rezultatele testului de performanță a temei GeneratePress WordPress

Când vine vorba de dimensiunea paginii, am fost surprinși de rezultate. Rulând site-ul nostru prin Pingdom, dimensiunea paginii a ajuns la 37,7 KB, ușor diferită de „7,5 KB” pe care o promit pe site-ul lor.

4. Neve - Versatilul

Tema Neve WordPress

Neve este o temă versatilă și rapidă, care poate fi personalizată în diverse scopuri. Este ideal pentru bloggeri, întreprinderi mici, startup-uri, agenții, firme și magazine de comerț electronic care utilizează vitrina WooCommerce, site-urile de portofoliu personal și diverse alte proiecte.

Este optimizat pentru AMP și receptivitate, asigurând timpi de încărcare rapidi și afișare optimă pe orice dispozitiv. Deși are un design minimalist, Neve poate fi extins cu ușurință și prezintă cod foarte optimizat pentru SEO, care poate duce la clasamentele de top în căutarea Google.

Neve este, de asemenea, compatibil cu Gutenberg și cu creatorii de pagini populari, cum ar fi Elementor, Brizy, Beaver Builder, Visual Composer, SiteOrigin și Divi.

Pret: Gratuit; 69 USD/an; 149 USD/an; 249 USD/an

Instalații active: 300.000+

Cele mai bune caracteristici: Design responsiv, optimizat SEO, minimalist

Potrivit pentru: O gamă largă de scopuri și site-uri

Ce au arătat testele noastre

În ceea ce privește Core Web Vitals și scorurile de performanță, Neve este la fel de bun ca și opțiunile anterioare.

Neve WordPress Theme Performance Test Results

Motivul pentru care ocupă locul al patrulea pe lista noastră este dimensiunea paginii și timpul de încărcare, dar asta nu ar trebui să vă împiedice să o testați.

Unul dintre avantajele Neve este că folosește vanilla JS mai degrabă decât un cadru precum JQuery. Acest lucru contribuie la o îmbunătățire a performanței și are ca rezultat un site web mai receptiv.

5. Sydney - Freelancerilor le place

Tema WordPress Sydney

Sydney este o temă solidă care permite companiilor sau liber profesioniștilor să stabilească rapid o prezență online remarcabilă.

Această temă este pe deplin compatibilă cu Elementor și oferă diverse opțiuni de personalizare, inclusiv acces la toate fonturile Google, control complet al culorilor, control al aspectului, încărcare logo, glisor pe ecran complet, imagine de antet, navigare lipicioasă și multe alte funcții.

În plus, Sydney oferă toate elementele de bază necesare pentru a crea rapid o pagină atrăgătoare.

Pret: Gratuit; 69 USD/an, 99 USD/an; 199 USD/pe viață

Instalații active: 100.000+

Cele mai bune caracteristici: Acces la Fonturi Google, control al culorilor

Potrivit pentru: site-uri web de afaceri

Ce au arătat testele noastre

După ce am finalizat o nouă instalare a lui Sydney, am testat performanța temei.

Rezultatele:

Are toate ingredientele pentru a construi un site web care să-ți satisfacă vizitatorii și motoarele de căutare.

Rezultatele testului de performanță a temei WordPress Sydney

În ceea ce privește viteza și Core Web Vitals, Sydney se clasează la fel ca și celelalte teme. Cu toate acestea, dimensiunea totală a paginii este de două ori mai mare (48,1 KB) decât Twenty Twenty-Three.

6. Astra - Cunoscută de toți, iubită de toți

Tema WordPress Astra

Astra este cea mai populară temă WordPress. Este rapid, complet personalizabil și atrăgător din punct de vedere vizual, ceea ce îl face o alegere potrivită pentru diverse scopuri, cum ar fi blogging, portofolii personale, site-uri web de afaceri și vitrine WooCommerce.

Astra este, de asemenea, proiectat pentru a fi ușor, cu o dimensiune frontală de mai puțin de 50 KB, contribuind la viteza sa de neegalat. Tema este creată având în vedere SEO, integrând codul Schema.org și suportul AMP nativ pentru a îmbunătăți vizibilitatea site-ului dvs. în motorul de căutare.

În plus, Astra oferă caracteristici și șabloane unice compatibile cu creatorii de pagini populari, cum ar fi Elementor, Beaver Builder, Visual Composer, SiteOrigin și Divi, asigurând o integrare perfectă cu generatorul de pagini preferat.

Pret: Gratuit; 47 USD/an, 137 USD/an; 187 USD/an; opțiuni de viață disponibile

Instalații active: 1+ milion

Cele mai bune caracteristici: site-uri web pre-construite, mai multe opțiuni personalizabile, rapid

Potrivit pentru: Fiecare site web

Ce au arătat testele noastre

Contrar așteptărilor noastre, Astra nu s-a descurcat atât de bine pe cât credeam. Da, scorurile PSI pe dispozitive mobile au fost excelente, dar au arătat rezultate sub egale pe desktop.

Rezultatele testului de performanță a temei Astra WordPress

De asemenea, a fost surprinzător că a obținut doar un scor de performanță de 85% pe GTmetrix. Cu toate acestea, toate celelalte valori au fost similare cu liderii din clasamentul nostru.

7. Kadence - Favoritul discret

Tema WordPress Kadence

Kadence este o temă WordPress care este atât ușoară, cât și plină de funcții, permițându-vă să creați cu ușurință site-uri web frumoase, cu încărcare rapidă și accesibile.

Una dintre caracteristicile sale notabile este un generator intuitiv de antet și subsol, care vă permite să construiți orice tip de antet în câteva minute. Tema se mândrește, de asemenea, cu o bibliotecă cuprinzătoare de șabloane de pornire uimitoare care pot fi personalizate cu ușurință cu ajutorul unor comenzi globale inteligente ale fonturilor și ale culorilor.

În plus, tema Kadence este foarte compatibilă cu cele mai populare pluginuri terțe, permițându-vă să dezvoltați rapid site-uri web impresionante de comerț electronic, site-uri web de cursuri, site-uri web de afaceri și alte tipuri de site-uri.

Pret: Gratuit; 129 USD/primul an, 199 USD/primul an

Instalații active: 200.000+

Cele mai bune caracteristici: drag-and-drop intuitiv, șabloane de pornire, orientate spre performanță

Potrivit pentru: Toate tipurile de site-uri web

Ce au arătat testele noastre

Kadence are o dimensiune implicită a paginii de 54,8 KB. Deși este cel mai mare din grup, a reușit totuși să exceleze la ambele teste PSI și să obțină un A pe GTmetrix.

Rezultatele testului de performanță a temei WordPress Kadence

Având în vedere cât de mult include această temă, aceasta ar putea fi îmbunătățită drastic cu o anumită optimizare și un plugin bun de optimizare a vitezei site-ului.

Ce temă ar trebui să instalez?

Toti.

Da, ai citit bine.

Ne-am restrâns lista la doar 7 teme, deoarece am vrut să vă oferim un număr mic de opțiuni pe care le puteți testa singur.

Este mult mai rapid și mai ușor să treci singur prin șapte teme în loc să te copleșești cu o listă masivă de peste 50 de teme.

Credem că cele care au fost incluse în acest articol oferă cea mai bună bază pentru a construi și pentru a avea un site web performant.

Și punem accent pe fundație.

În cercetarea noastră, am testat temele fără niciun conținut sau pluginuri adăugate peste ele.

Așa că vă recomandăm să le încercați pe toate, să vă jucați cu caracteristicile lor de personalizare, să adăugați conținut și să instalați câteva plugin-uri.

Apoi, testați și vedeți ce oferă cele mai bune rezultate în funcție de nevoile și cerințele dumneavoastră specifice.

Cum să-ți îmbunătățești în continuare elementele vitale de bază ale web [listă de verificare]

Construirea pe o temă optimizată pentru viteză vă va oferi un început în călătoria dvs. Core Web Vitals.

Cu toate acestea, în multe cazuri, să te bazezi doar pe o temă rapidă nu este suficient pentru a-ți depăși scorurile.

De aceea, am pregătit o listă rapidă de bune practici pe care le puteți urma pentru a optimiza fiecare măsură CWV:

1. Cea mai mare vopsea plină de conținut (LCP)

  • Utilizați o temă ușoară
  • Nu vă umflați site-ul cu pluginuri inutile
  • Comprimați-vă imaginile
  • Serviți imagini în formate de nouă generație
  • Preîncărcați imaginile eroului dvs
  • Reduceți și comprimați fișierele de cod
  • Implementați CSS critic
  • Utilizați un CDN
  • Instalați un plugin de cache

2. Întârziere la prima intrare (FID)

  • Întârzieți sau eliminați scripturile terțe care nu sunt critice
  • Reduceți și comprimați fișierele de cod
  • Reduceți CSS neutilizat
  • Amână JavaScript neutilizat

3. Schimbare cumulativă a aspectului (CLS)

  • Adăugați atribute de lățime și înălțime imaginilor și videoclipurilor
  • Rezervați spațiu pentru anunțuri, încorporare și iFrame
  • Optimizați livrarea fonturilor

Deși poate părea multă muncă, beneficiile aplicării tuturor acestor bune practici vor duce în cele din urmă la rezultate excelente de afaceri în lumea reală.

Tot ce trebuie să faci este să optimizezi câte un lucru.

Sau…

Treceți Core Web Vitals pe pilot automat cu NitroPack →