Webpagetest.org är förmodligen det bästa och mest omfattande gratisverktyget för att mäta din sidladdningstid. Tyvärr ger det mycket och mycket komplexa data. Idag ska jag visa dig vad du behöver justera, hur du får ordning på datasalladen och vilka parametrar du behöver för en professionell analys. För bara om du vet hur dina webbplatser laddas kan du optimera dem topp.

Din egen webbplats ska vara säker. Och snabbt. Naturligtvis, eftersom mycket beror på laddningstiden: omvandlingsfrekvensen, känslan av säkerhet för personen framför enheten och Googles ranking av ditt erbjudande. Men många kommer inte ens till den punkt där de korrekt kan bestämma laddningstiden för sin egen webbplats.

Till exempel vet vissa människor inte ens exakt vilka verktyg de kan använda för att korrekt analysera sin webbplats. Eller så vet de inte vilka inställningar de ska göra för att få riktigt bra resultat. Så att du inte gör samma misstag ska jag idag visa dig hur du får en snabb och meningsfull översikt över din webbplats med det (enligt vår mening) bästa gratis mätverktyget någonsin. Så du vet exakt hur snabbt din webbplats laddas och om och var du behöver optimera.

För att förstå exakt hur de enskilda analysstegen fungerar rekommenderar jag att du tittar på de datamängder som är länkade på de viktiga platserna eller analyserar din egen webbplats parallellt. För: Att få ordning på datasalladen är inte så lätt. Som belöning för ansträngningen får du dock några av de bästa uppgifterna du någonsin har samlat in på din webbplats. Och speciellt om du arbetar för eller tjänar dina pengar med dina WordPress-projekt är ansträngningen alltid värt det.

Webbsida test är det bästa verktyget vi vet

Visserligen berömmer vi webpagetest.org effusivt i den här artikeln. Kanske för sprudlande, men inte utan anledning. Eftersom webpagetest är det enda verktyget som vi känner till som låter dig på ett tillförlitligt sätt bestämma den absoluta och upplevda laddningstiden för din webbplats. Och det är helt gratis. Ingen betalvägg, ingen prenumerationsmodell, bara värdefull data och ett API som låter dig automatisera det hela: det är så det ska vara.

För fullständighetens skull kan du också få fina mätresultat med Pingdom och GTmetrix . Men inte lika fina resultat som med webpagetest. Naturligtvis betyder det inte att du inte kan och inte bör säkerhetskopiera dina resultat med flera tester i olika verktyg. Och det betyder inte att du inte ska tävla med Pingdom eller GTmetrix. Men jag kan rekommendera dig att titta på webpagetest minst en gång.

Det har nästan blivit ett mantra för oss: För att mäta laddningstiden för din webbplats, verktyg som Googla PageSpeed Insights inte av. Eftersom dessa bara bestämmer prestandapotentialen på din webbplats. Naturligtvis är dessa data fortfarande värdefulla - ur prestationssynpunkt och ur SEO-synvinkel - men det tillåter dig helt enkelt inte att dra några slutsatser om vad som faktiskt händer när din webbplats besöks.

Men det är vad du vill veta. Och det är precis vad du behöver veta för att kunna avgöra om en optimeringsåtgärd är effektiv.

Tyvärr ger webbsida test inte bara inte precis fint förberedda data men också mycket omfattande testresultat. Så idag ska jag visa dig hur du använder Webpage test och hur man tolkar resultaten i grunden.

Webpagetest var ursprungligen ett AOL-projekt och endast avsett för internt bruk. År 2008 blev programmet dock programvara med öppen källkod och underhålls och vidareutvecklas nu huvudsakligen av Google. All dokumentation från Webpagetest finns på GitHub och kan även laddas ner och användas lokalt.

Under PageSpeed Insights visar var optimeringspotentialen på din webbplats ligger, webpagetest kan göra mycket mer. Eftersom det inte bara visar dig hur du kan förbättra din webbplats utan också direkt vilka effekter dina optimeringsåtgärder har på laddningstiden för din webbplats.

Till skillnad från Pingdom och GTmetrix finns det inget företag bakom Webpagetest som vill sälja en betaltjänst (ok, förutom Google, men åtminstone tjänsten inte säljs direkt). Snarare kan man säga att webbsidan testning är en del av Googles plan för att göra nätverket snabbare totalt sett. Men du vill utvärdera Googles ambitioner i detta sammanhang.

I 4 steg till verkligt meningsfulla data för laddningstid

Ja, webpagetest är mer komplext än andra verktyg. Men låt inte det avskräcka dig! I detta fall är komplexiteten bra. Eftersom det betyder att du får bra data om din webbplats. Och även som med din första användning av verktyget får du relevant information ganska snabbt.

Och detta med följande fyra steg:

Steg 1: Ställa in testparametrar

Steg 2: Få en översikt

Steg 3: Detaljerad analys

Steg 4: Analys av den upplevda laddningstiden

Steg 1: Ställ in testparametrar

Webpagetest ger mycket fina inställningar för att testa din webbplats. Fyra av dessa inställningar är särskilt viktiga för att få bra mätresultat:

• den server som ska testas med
• den webbläsare som ska testas med
• De avancerade testinställningarna, som jag kommer att diskutera mer ingående om en stund.

Servern du väljer för testet simulerar ett samtal till webbplatsen därifrån. Om du väljer standardservern i USA matas testresultatet ut för en sidvy från Texas. I de flesta fall är det dock inte nödvändigtvis vad du vill ha. Därför är denna inställning mycket viktig. Detta beror på att det massivt kan snedvrida det totala resultatet och, beroende på applikationen, måste justeras i enlighet därmed.

De två vanligaste användningsfallen är:

1. Fastställande av laddningstiden för en användare från din målgrupp
2. Laddtidsjämförelse efter ett optimeringsmått

Om du vill veta hur laddningstiden för din webbplats uppfattas måste serverplatsen motsvara så nära som möjligt den typiska platsen för vyerna. För en tysk blogg betyder det att du ska välja en server i Tyskland, till exempel i Frankfurt.

Om du vill veta vad ett optimeringsmått har uppnått spelar det ingen roll vilken serverplats du använder. Det viktiga är: Du måste använda samma serverplats för testet före och efter optimering. Annars kan du inte jämföra mätdata ordentligt. Naturligtvis rekommenderar jag också en tysk testserver här. Detta ger helt enkelt de mest realistiska resultaten.

Den webbläsare som används

Webpagetest erbjuder många inställningsalternativ för att simulera vissa överföringstekniker och webbläsare. Du kan till exempel definiera att webbplatsen ska laddas via en 3G-anslutning och Firefox. Till att börja med räcker det dock att välja den webbläsare som din målgrupp använder oftast.

Du kan till exempel se information om detta i Google Analytics eller Piwik. Raidboxes besöks mest via Chrome, till exempel.

Mycket viktigt: De avancerade inställningarna avgör hur bra dina mätdata i slutändan blir!

Förutom de två parametrar som avgör hur man testar – det vill säga serverplatsen och webbläsaren som används – erbjuder webpagetest också möjligheten att ställa in vad testet ska mata ut i slutet. I de avancerade inställningarna kan du till exempel definiera att endast vissa värden ska matas ut, eller att mätningen ska stoppas automatiskt efter en viss tid. Och här finns det två inställningar som är särskilt viktiga för att få rimligt omfattande och tillförlitliga data: "Antal tester att köra" och "Upprepa vy".

I princip bör du mäta mer än en gång när du mäter laddningstiden. Annars riskerar du att mäta extremvärden och kanske letar efter ett problem som inte finns. Och tro mig, vi har sett det här några gånger. Jag rekommenderar minst tre på varandra följande tester.

Kom också ihåg att alltid mäta den cachade versionen av din webbplats. Du kan göra detta med alternativet Upprepa vy.

Har du din URL – t.ex. https://raidboxes.de - och ställa in testparametrarna (dvs. den tyska servern, webbläsaren, minst 3 repetitioner och upprepningsvyn) kan du starta testet. Beroende på hur många tester som för närvarande körs totalt kan analysen ta några minuter.

Viktigt: Webpagetest testar bara den webbplats som är tillgänglig under webbadressen, inte hela din webbnärvaro. Det betyder att du bör testa din hemsida, alla målsidor och, om det är relevant, din produktöversikt individuellt.

I den här guiden arbetar jag med data från analysen av vår hemsida, raidboxes.io.

Steg 2: Få en översikt

Det första du ser är resultatöversikten och punkten "Opportunities & Experiments" (möjligheter och experiment). Här får du en grov överblick över vilken potential din webbplats har i vissa avseenden, eller om webbplatsen redan presterar bra i dessa avseenden. Webpagetest ger liknande resultat som Google PageSpeed Insights .

(1) Ju mer grönt, desto bättre

I det andra området listas testparametrarna återigen för kontroll. Grönt indikerar en god grad av optimering, orange indikerar användbar optimeringspotential och rött indikerar ett akut behov av åtgärder.

Här visas alla relevanta nyckeldata om sidladdningstiden för den cachade och den icke cachade versionen av din webbplats. Den första visningen är inte lagrad och den upprepade visningen är lagrad. Det viktiga här är: I översikten visar Webpagetest endast värdena för ett av de tre testerna. Texten inom parentes direkt intill etiketterna Första vy och Upprepad vy visar vilket test det handlar om. Run 2 är därför resultatet för den andra provkörningen.

Jag ska nu förklara de två viktiga parametrarna:

• Första byte: Dags att skicka in den första databyte mellan klienten och webbservern. Detta värde bör vara mindre än 200 millisekunder om möjligt och är en viktig indikator på resultatet för din hosting.
• Start Rendering: Det här värdet beskriver den tid som en webbplats behöver för att laddas tills innehållet visas för första gången. Fram till dess är webbplatsen helt vit för användaren. Naturligtvis bör även detta värde vara så lågt som möjligt. Detta värde, tillsammans med den totala tiden för den visuella siduppbyggnaden, utgör utvärderingsstandarden för den upplevda webbplatsens hastighet. Start Render markerar början på den synliga laddningen av din webbplats.

För alla dessa värden, desto mindre, desto bättre. Som riktlinje kan du komma ihåg:

• tid till första byte ska vara mindre än 200 millisekunder
• Startåtergivningen ska inte vara större än 2,5 sekunder
• Hela den visuella sidlayouten bör inte vara längre än fem sekunder.

Naturligtvis är dessa värden bara tumregler. Det beror alltid på din webbplats: En butikssida med 50 produkter - dvs. 50 eller fler bilder och beskrivningstexter - laddas naturligtvis långsammare än en avtryckssida som bara består av text.

Därför kan jag bara råda: Testa webbplatserna för den direkta tävlingen och dina förebilder. Detta ger dig branschinterna jämförelsevärden.

Göra medelvärden - Nu är det dags att komma ner till rätt plats

Tyvärr visar översikten som förklaras ovan bara resultaten av en enda mätkörning. Och du kommer ihåg: individuella, isolerade värden kan vilseleda dig. Det är därför du tog minst tre på varandra följande mätningar för att testa din webbplats. Och medelvärdena för dessa tre mätningar är de bästa approximationerna du kan få för din sidladdningstid.

Och oroa dig inte: Att skapa medelvärden behöver bara ett knapptryck:

Innan du fortsätter bör du kryssa i både rutorna Första och Upprepa högst upp.

Nu får du en initialt förvirrande mängd data från så kallade tomter. Och det är precis de resultat du vill ha. I princip är denna nya översikt densamma för alla värden. Så när du förstår hur man läser dem, de är allt annat än förvirrande.

Som du kan se är alla tre uppmätta värden (1-3) plottade i ett diagram. Ovanför diagrammet står det värde som diagrammet hänvisar till. Siffran i kolumnen Medelvärde beskriver nu medelvärdet av laddningstiden för alla tre mätningar. Detta medelvärde är den mest värdefulla informationen du kan få om din webbplats.

Förresten: Om antikviteten av Box Upprepa kan du också mata ut värdena för laddningstiden med och utan cachelagring. Och om du vill hitta resultaten för de andra värdena: Sök bara efter "First Byte" och "Start Render" via din webbläsarsökning (CTRL + F för datorer och cmd + f för Mac-datorer).

Interimsslutslut: Mycket arbete för särskilt värdefulla data

Ok, det var mycket input. Och det var många arbetsmoment. Speciellt jämfört med enkla testmetoder. Men ansträngningen är värt det, för du har sett det i diagrammens nummer: Två tester med samma inställningar kan ibland vara en hel sekund från varandra. Så slumpen kan avgöra om du investerar tid och pengar i att ytterligare optimera dina webbplatser. Och speciellt om du tjänar dina pengar med WordPress, vare sig det är med din egen butik, ett webbdesignföretag eller din egen byrå, bör du ha den bästa databasen för ett sådant beslut.

Vi är faktiskt inte färdiga än. För nu känner du till de viktigaste prestandaparametrarna på din webbplats, så du vet hur snabbt din webbplats laddas och om det fortfarande finns potential för optimering, men du vet ännu inte var exakt din webbplats kan förbättras. Och det är precis vad den detaljerade analysen är till för.

Steg 3: Detaljerad analys

Översikten berättar redan mycket om din webbplats. Du kan se om det finns utrymme för förbättringar inom vissa områden, hur snabbt din webbplats faktiskt laddas och om den kanske inte laddas lite snabbare. Men du känner ännu inte igen orsakerna till problemen. Men du hittar dem i de detaljerade rapporterna:

• vattenfallet diagram
• potentiell analys

Vattenfallsdiagrammen listar varje enskild HTTP-begäran som en webbläsare gör till webbservern. Vid första anblicken verkar dessa diagram väldigt komplexa och förvirrande. Men om du vet hur kan du snabbt dra många detaljer om din webbplats från ett vattenfallsdiagram. Här visar vi dig hur du läser vattenfallsdiagram korrekt och hur du kan använda dem för att ytterligare optimera din webbplats.

I grund och botten har en snabb webbplats ett kort vattenfallsdiagram med några korta förfrågningar. Detta innebär att längden på diagrammet och längden på staplarna i de enskilda raderna är särskilt relevanta.

I Prestandaöversikten hittar du detaljerad information om hur väl prestandan på din webbplats redan är optimerad. Denna detaljerade recension innehåller:

• Checklistan för optimering, som finns under menyalternativet "Optimering".
• Den detaljerade uppdelningen av prestandatestet

I optimeringschecklistan hittar du de enskilda utvärderingskriterierna som tillämpas på var och en av HTTP-förfrågningarna. En grön bock betyder att kravet är uppfyllt, en gul triangel indikerar att det finns behov av förbättring, ett rött kors indikerar frånvaron av den föreslagna optimeringsåtgärden.

Slutligen hittar du en beskrivning av varningarna och saknade optimeringsåtgärder i detaljersavsnittet. I webbsidestestet beskrivs de optimeringar som fortfarande är möjliga för varje resurs. Bilder visar till exempel hur mycket datavolym som kan sparas.

Även om du måste hantera dessa detaljerade utvärderingar under en tid kan du få en detaljerad bild av din webbplats och dess optimeringspotential med deras hjälp.

Och eftersom det i princip är samma information som PageSpeed Insights spotta ut, naturligtvis kan du också helt enkelt köra en PageSpeed analys parallellt. Eftersom detta test är mycket trevligare och bättre förberedda.

Steg 4: Analys av filtbelastningstiden

Till skillnad från alla andra tester som vi känner till är webpagetest det enda som visar den upplevda laddningstiden för din webbplats gratis. Via Filmstrip View kan du titta på en video av sidlayouten. Så du kan se exakt vad som kan ses när du laddar och kan utvärdera ännu bättre om och hur din webbplats ska optimeras.

Den upplevda laddningstiden är förmodligen den viktigaste parametern för din sidladdningstid. Det påverkar om din webbplats lämnas i förtid, sannolikheten för konvertering och den övergripande upplevelsen av din webbplats. Speciellt för butiker är webbplatsens upplevda hastighet därför en viktig riktlinje. Naturligtvis bör den upplevda laddningstiden alltid vara så kort som möjligt.

Förutom Filmstrip View bör du komma ihåg följande:

Filmstripvyn visar dig exakt på en tiondels sekund hur din webbplats ser ut och vilka processer som utförs vid varje given tidpunkt. Det händer ofta att det inte händer något på upp till flera sekunder, och sedan ser webbplatsen plötsligt nästan exakt likadan ut som i sitt slutliga skick. Detta ger intryck av att webbplatsen har laddats färdigt inom denna tid. Eller rättare sagt, du har redan en känsla av att du kan interagera med webbplatsen.

Speciellt när du prioriterar det synliga sidinnehållet är Filmtrip View ett mycket värdefullt verktyg.

Slutsats

Ok, efter att ha läst artikeln bör du nu kunna välja rätt inställningar för ett webbsidetest. Nu bör du också veta vilka nyckeltal du måste tolka och hur och hur du kan förhindra feltolkningar på grund av avvikelser. Du vet också var du kan hitta detaljerad information om din webbplats och hur du bestämmer den upplevda laddningstiden för din webbplats och visar den.

Så du känner till de viktiga grunderna för att få en riktigt omfattande översikt över din webbplats. Och du vet var du kan få informationen som gör att du kan fylla mätresultaten med liv och dra meningsfulla slutsatser för din webbplats.

Men varför var det viktigt igen? Det är enkelt: Utan en rimlig mätning av det faktiska tillståndet på din webbplats kan du inte korrekt utvärdera hur din webbplats för närvarande laddas. Och å andra sidan saknar du information för att optimera laddningstiden.

Har du ett tips för att använda Webpagetest? Perfekt, skriv sedan en kommentar på detta inlägg!