Den kompletta guiden för att påskynda din WordPress-webbplats
Att ha en långsam webbplats är en frustrerande upplevelse. Det kommer inte bara att rankas dåligt i sökmotorerna (laddningshastighet är en av rankningsfaktorerna i Google), det ger också din besökare en dålig användarupplevelse. Men medan de flesta webbansvariga skulle vilja skynda på sina webbplatser, har de flesta inte den tekniska kunskapen att göra det. Om du hamnar i detta läger och använder WordPress, har vi en komplett snabboptimeringsguide för dig. Följande steg är vad vi har gjort för den här sidan och de har fungerat bra för oss.
Släng ner webbplatsen
När en besökare besöker din webbplats måste webbläsaren be om sidan från din server och ladda sidan i sin helhet innan läsaren kan visa den. Det innebär att om du har en uppblåst webbplats kommer det att ta lång tid för webbläsaren att ladda ner och göra det. Här är några sätt att smala ner på din WordPress-webbplats:
1. Lita på din webbplatss temadesign
Omvärdera webbplatsens design och se om du kan ta bort onödiga objekt från webbplatsen. Det finns ingen anledning att fylla för mycket information i sidofältet när besökaren bara är intresserad av det faktiska innehållet. Här är några saker du kan ta bort:
- Fantasifulla skjutreglage, animering och effekter.
- Diverse widgets på sidofältet
- Annonser - Endast om du har lagt till för många annonser. I vissa fall kan du tjäna mer med färre annonser
2. Bli av med onödiga plugins
Du är två huvudtyper av WordPress-plugins: en som bara påverkar adminområdet och en som lägger till ytterligare innehåll på webbplatsen. För den senare följs det alltid av extra javascript och css-filer som lägger till extra vikt på webbplatsen.
Ta en titt på din plugins lista och inaktivera de gamla plugins som är ineffektiva och inte längre används. Om ett plugin inte har uppdaterats under en längre tid kan du också kolla alternativa plugins som är lättare och ändå kan göra jobbet mer effektivt.
3. Minska filstorleken på din HTML, CSS och Javascript
Det finns två sätt att minska den totala storleken på din webbplats. Den första är att kombinera flera stylesheets och javascript-filer i en, och den andra är att minska filerna. Minifiering innebär att man tar bort onödiga utrymmen och kommentarer och kombinerar flera upprepade koder i en. En bra plugin som du kan använda för att uppnå detta är W3 Total Cache plugin.
På sidan W3 Total Cache Settings, under "Allmänna inställningar", aktivera "Minifiera" -läget.
Gå sedan vidare till "Minifiera -> HTML och XML", kryssrutorna bredvid "Aktivera", "Inline CSS Minification", "Inline JS Minification" och "Remove Line Break".
Nästa är avsnittet "JS Minifiering". Det här är en knepig del eftersom det fungerar för vissa teman men inte för andra. Personligen har jag ingen tur med den här inställningen, men du kanske vill prova och se om den fungerar för din webbplats.
En sak som jag rekommenderar för denna inställning är att använda "Minifiera" istället för "Kombinera bara". Kombinera flera javascripts tillsammans kan orsaka biverkningar och bryta webbplatsen.
Den sista delen som du behöver konfigurera här är avsnittet "CSS-minifiering". Detta gör att du kan minska och kombinera alla CSS som används i temat.
För att få det bästa ut av det här är det bäst att du öppnar din webbplats, visar källkoden och kopierar alla CSS-länkar till "File URI" -fältet i avsnittet "CSS-filhantering". Alla CSS-filer som du lagt till i det här fältet kommer att minimeras och kombineras till en enda CSS-fil.
4. Optimera bilderna
Bildfiler är vanligtvis de som utgör större delen av webbplatsens filstorlek, så det är viktigt att du optimerar bilderna och håller dem så små som möjligt. Wp Smush.it är ett bra plugin som optimerar dina bilder när du laddar upp dem. Det kommer också med en bulk-smush-funktion som kan optimera alla tidigare uppladdade bilder.
Snabba på sidans lasthastighet
Några av de sätt du kan använda för att påskynda webbplatsens lasthastighet är:
- cache webbplatsen
- Ställ in webbläsarens cache
- byt till google jquery
- uppskjuten javascript laddning
- använd lat laddning av bilder
- använd asynkront javascript
- använd CDN
Här är några plugins som kan göra ovanstående arbete för dig.
1. W3 Total Cache
Vi har täckt minifiering i ovanstående avsnitt, men det som gör W3 Total Cache kraftfull är dess caching-modul. Först aktivera modulen "Sid Cache" i avsnittet "Allmänna inställningar". På en gemensam värd väljer du "Disk: Grundläggande" för sidhanteringsläget. För VPS eller dedikerad server, välj "Disk: Enhanced."
Bläddra längre ner på sidan tills du ser avsnittet "Browser Cache" Markera rutan för att aktivera den också.
Detta möjliggör både cacheminnet och broschercachen för din webbplats. Sidcachen är helt enkelt en statisk HTML-sida som kommer att serveras istället för den dynamiska PHP-sidan. Webbläsarens cache informerar webbläsaren om att cacha din sida och att servera den från cacheminnet när läsaren besöker samma sida igen.
2. WP Utsatt Script
De flesta javascriptfiler blockerar i naturen, vilket innebär att webbplatsen måste vänta på att alla javascriptfiler ska slutföras innan innehållet kan laddas. Detta kallas också synkron lastning. Ett av sätten att bekämpa detta är att flytta javascripts längst ner på sidan så att de laddas först efter att innehållet har laddats.
WP-uppskjutet skript är ett användbart plugin som flyttar alla kodade skript längst ner på sidan. Det använder lab.js i backend och kommer att fungera med de flesta plugins. Det finns inga inställningar att konfigurera. När den är aktiverad kommer den automatiskt att skjuta upp alla javascript-laddningar till slutet av sidan. En annan bra sak är att den laddar javascripts asynkront, vilket betyder att det laddar javascript parallellt med innehållet.
3. Jetpack Photon
Ett annat bra sätt att minska lasthastigheten är att ladda alla bilder från en CDN-källa. Om du har installerat Jetpack-plugin, kommer automatisk att lägga till en bild-CDN till din webbplats om du aktiverar Photon-modulen.
Alternativt kan du, om du använder extern CDN, som MaxCDN eller Amazon CloudFront, konfigurera CDN-modulen i W3 Total Cache-plugin för att använda CDN-tjänsterna.
4. Lazy Load
Har du märkt hur bilderna laddas på begäran när du rullar ner sidan? Detta kallas Lazy Loading, och det är ett bra sätt att påskynda webbplatsen också. Plugin som vi använder här är Unveil Lazy Load, men om du letar efter lat laddning finns det många lazy laddningspluggar som du kan använda; vissa är även optimerade för videor och iframe.
5. DFP
Om du tjänar annonser på din webbplats kommer du att veta att annonser ofta är de som tar längst att ladda och orsaka att webbplatsen går långsamt. Värst fortfarande, de flesta annonser är synkrona i naturen och kommer att blockera innehållet från att fungera tills de är fullt laddade. Ett av sätten att bli av med problemet är att tjäna annonserna med hjälp av Google DFP. För dem som inte vet är Google DFP ett annonshanteringsprogram för att hantera dina annonser.
På den här webbplatsen använder vi jquery.dfp.js-skriptet för att ladda alla DFP-taggar på begäran, så det saktar inte in laddningen av webbplatsen. Genomförandet kan vara ganska komplicerat och vi kommer inte att täcka det här. Om det finns tillräckligt med intresse (du kan uttrycka ditt intresse för kommentarerna), kommer jag att göra en annan handledning som beskriver steg-för-steg-processen för att implementera den på din webbplats.
Slutsats
Om du följde stegen ovan kan jag försäkra dig om att din webbplats nu körs snabbare än tidigare, även om du befinner dig på en gemensam webbhotell. Ett bra sätt att testa sidans lasthastighet är verktyget Google PageSpeed Insights. Ange bara din webbadress och det kommer att analysera din webbplats för dig. Gör det före och efter optimeringen och se de stora skillnaderna.
Bildkredit: Går ingenstans snabbt