Ytelse er en av de viktigste aspektene på et nettsted, men det er noe folk sjelden ser ut til å ta hensyn til når man kjøper WordPress-temaer. I denne runden tar vi de ti bestselgende temaene på Themeforest, i rekkefølge av utseende, kjører dem gjennom noen grunnleggende ytelsestester, og ser hvilke konklusjoner vi kan tegne.
ThemeForests liste over bestselgende WordPress-temaer oppdateres ukentlig, men du vil ofte se kjente spillere som holder de øverste stedene i noen tid. Vi har tatt topp ti (sett under) og pitted dem mot hverandre med noen vanlige prestasjonstester.
Bestselgende WordPress Temaer - oppdatert ukentligDet er mange verktøy tilgjengelig for testing av nettsteder, og vi har valgt noen klassikere: Google Pagespeed Insights, Webpagetest.org, Pingdom og Chrome dev-verktøy. De fleste vil gi tilbakemelding om hvor raskt en nettside laster, dens samlede vekt, hvor effektivt dens eiendeler blir overført, noe som til slutt gir en slags poengsum. Vi løp en demo av hvert tema gjennom disse verktøyene og samler tallene (se tabell i slutten av innlegget).
I tillegg til disse testene brukte vi Accessibility Audit plugin for Chrome dev verktøy. Dette er ikke knyttet til ytelsen som sådan, men resultatene gir alltid et innblikk i hvordan et tema er bygget.
Noen ting å merke seg:
Utmerkede poeng over hele linja. Innledende tester var mindre sterke, men ThemeFusion kunne forbedre tallene betydelig ved å optimalisere bildene som ble brukt i denne demoen. Skriftspoengsummen for Sidevisning Innsikt gikk fra 48% til 88% bare på baksiden av bildevekten, og viser hvor viktig bildeoptimalisering er! Flott å se at Avada er også bygget med tilgjengelighet i tankene.
alt
attributter, fargekontrastforhold kan være bedre på noen av teksten (i forhold til bakgrunnen). Men i det hele tatt er elementene godt strukturert og tilgjengeligheten er solid.Generelt sett lastes denne demonstrasjonen ganske raskt. dets bilder og eiendeler er ikke for tunge, og siden kan brukes relativt snart etter belastning. Likevel er Pingdom-karakteren ikke optimal. Forbedringer kan gjøres ved å kombinere noen av JavaScript, likevel CSS, mens caching kan gjøres enklere ved ikke å tvinge versjonsnumre på filnavn (f.eks: /assets/css/settings.css?ver=5.4.5.2
).
Dette temaet laster veldig raskt. Mange av sitt synlige innhold prioriteres ved å inkludere viktige stiler inline i hode
, og mye av det som er lastet inn, er minifisert og sammenkoblet. Som det er tilfelle, står bildene for løvenes andel av sidevikt (69,5%), så det ville ikke være vanskelig å få denne demoens hjemmeside under den gyldne 1Mb-terskelen.
Selv om lasthastigheten til Impreza's restaurantdemo ikke er dårlig, blir ytelsespoengene hindret av over 2 MB bilder. Også av note er mangelen på CDN og den dårlige serverens responstid; to aspekter som er spesifikke for hosting av denne demoen og de som du enkelt kan forbedre.
Igjen, ingen CDN som brukes til hosting av denne demoen, som mister den noen få poeng på webpagetest.org. Mangel på HTTPS kan også ha tjent Enfold et svart merke. Som vanlig faller denne demonstrasjonen i fellen for å være så visuelt imponerende som mulig, og avlaster sidevikt for bildekvalitet. På over 5 MB er dette tungvekten av gjengen, men bildestørrelsen er alltid noe som lett kan løses.
alt
attributter på noen bilder, lav kontrastforhold på enkelte områder (dette kirketema er ganske dempet) og fravær av a tittel
attributt på en iframe
. Likevel, gitt at iframe er fra en YouTube-embed, som ikke har et tittelattributt som standard, vil vi tilgi det tilsynet.Denne demoen er en av de få som gjør en fornuftig jobb, og holder bildomkostningene til et minimum. webpagetest tildeler det en solid 97/100 for bildekomprimering. I stedet kommer de lave resultatene i stor grad fra hosting; ingen CDN, ingen HTTPS, dårlig innledende svartid og mangel på "holde i live" -hvordan kjent som en vedvarende HTTP-tilkobling, noe som lett kan slås på. Som noen gang, enkle forbedringer som du selv kunne få i kraft.
En av de lettere demoer her, men bildestyrene skal alltid svekke sidevikten opp, selv med godt optimaliserte bilder som disse. Minifisering av HTML og andre eiendeler ville ha hjulpet den mobile Pagespeed-innsiktsklassen, selv om skrivebordsscore er ekstremt god. Bedre hosting ville igjen gjøre underverk - bedre server responstid, en CDN, og caching er lavhengende frukt.
Ikke sett gjennom gunstige øyne av Pagespeed Insights, selv om de andre scoring-tallene absolutt elsker Flatsome! God hosting serverer siden effektivt (temaforfattere noterer seg), eiendeler minimeres, og lat bilder legger til rette for hva som ellers ville være en midtsidig side lastes gradvis.
Jeg skal høres ut som en ødelagt plate her, men fem minutter med bildeoptimalisering vil redusere kostnadene på denne demonstrasjonen sterkt.. hjemme-bg-08.jpg
alene veier inn på nesten en hel megabyte; kjører den gjennom TinyPNG barberer 87% med en gang. Hvorfor ville du ikke? Som Pingdom og Webpagetest foreslår, er de fleste andre ytelsesaspekter veldig gode.
Gode poeng på tvers av bord, standardforbedringer gjelder (bildeoptimalisering, JS og CSS-komprimering / sammenkobling), men husk at denne demoen også kommer innredet med en stor uttrekking som fremmer andre versjoner av temaet (komplikasjon som din egen versjon ville ha er lite sannsynlig å trenge). Uten mye innsats kunne denne demonstrasjonen gå inn i vektklassen under 1Mb.
Så det konkluderer med at vi har slått av poengsummen. Har du kjøpt et WordPress-tema, hvordan kan du optimalisere nettstedet du bygger med det?
Det vil ikke overraske deg: en enkel første anløpshavn når du optimaliserer nettstedet ditt, er bildene dine. Fjern uønskede bilder, komprimere dem du trenger, lagre JPEG som "progressive" (slik at det er minst noe å se mens de lastes), og du kommer til en god start. Du vil kanskje også installere et Lazy Loading-plugin for å ta ting et skritt videre. Vi har sett at svært få av disse demoene prioriterer bildeoptimalisering, men det betyr i det minste at du kan forbedre deres score.
Når det gjelder de beryktede, svake sidene i Pagespeed Insights, har du lagt merke til at alle disse demoene (med unntak av en) score bedre for skrivebordet enn deres mobile versjoner. Dette gjenspeiler ikke lenger måten nettet brukes på, for å holde Google (og brukere) glade, må du nøye vurdere mobilytelsen. En mobil første holdning vil også hjelpe din SEO.
Hvordan kan du gjøre dette? Sammenkobling og minifisering av CSS og JavaScript kan være vanskelig med WordPress; ved hjelp av tredjeparts plugins betyr at filer kan være mange, og du vil ikke ha mye kontroll over dem uten hjelp. Fortsett, gjør ditt beste for å inkludere viktige "innledende visninger" stiler inline i og gjør nettstedet ditt brukbart så raskt som mulig ved å hindre "gjengoblokke" skript fra å senke lastprosessen. Hvis skyvekontrollen øverst på hjemmesiden din krever at hele siden lastes inn før den vises, vil Google straffe deg.
Utover det, vurder din hosting. Aktiver GZIP-komprimering. HTTPS vil heller ikke skade noe. Bruk også en caching-tjeneste; installere og konfigurere W3 Total Cache er barnas spill. Bruk en CDN hvis innholdet ditt er beregnet for et bredt publikum. Til slutt, ta en titt på disse opplæringene og kursene for mer informasjon og hjelp om emnet: