Offentlig sektors webbprestanda och användbarhet 2016

Trafik ner i Götatunneln i Göteborg

Tidigare år har jag publicerat jämförelser mellan sveriges kommuner när det gäller deras webbprestanda. I oktober kollade jag specifikt in Eskilstuna kommun då de lagt energi på att bli bättre just på den upplevda snabbheten.

Med denna mätning har jag tagit i så jag nästan sprack i hur komplicerat det blev. Jag är inte statistiker så det tog ett tag att komma fram till ett resultat jag kände mig bekväm med. Men samtidigt ville jag göra något av all fritid som uppstod efter att jag släppte webbanalys-boken 🙂

Boken om webbanalys tar bland annat upp denna mätmetod, men också ett gäng till. Kolla in webbanalys-boken hos förlaget Intranätverk, eller om du nu föredrar Bokus

Metod för mätning – teknikaliteter

Med utgångspunkt från PSIdatakollen hämtade jag adresser till 557 webbplatser för offentlig sektor. Det är nästan dubbelt så många som de 290 kommuner jag tidigare testat och bör fungera som ett bra prestandaindex för alla oss som jobbar med offentlig sektor. Bland dessa webbplatser finns utöver kommuner också alla landsting och regioner. Några domstolar, myndigheter och lite övrigt följde också med.

Ett egenhändigt kodat Python-skript tittade på startsidan på dessa webbplatser och laddade ner dess HTML-kod. Med hjälp av biblioteket Beautiful Soup sållades alla interna länkar fram. PDFer, bilder och annat filtrerades bort, kvar var endast webbsidor på webbplatsens primära domän. Detta tillvägagångssätt var för att inte bara utgå från startsidornas prestation. Inte sällan är startsidor tyngre på grund av fler bilder, men det är också en sida man lägger mer krut på än många av undersidorna. Därför samlades även undersidor in för analys. I och med att webbsidorna är de som sammanställer allt innehåll är det dem som utvärderats, snarare än diverse dokumentformat som egentligen inte har på webben att göra.

Totalt hittades 60 045 sidor, alltså lite drygt hundra sidor per webbplats i genomsnitt. Dessa 60 045 sidor kördes sedan mot Google Pagespeed API v 2.0, och då med måttstocken att sätta en mobilanvändares behov först. Det är en lite tuffare nivå jämfört med desktop. Bland annat för att mobiler lever på batterier, ofta har sämre uppkoppling till nätet, används utomhus i dagsljus samt att den lilla skärmen ställer krav på designen.

Först ett genomsnitt per webbplats

Eftersom inte alla webbplatser hade lika många sidor undersökta har jag först gjort ett genomsnitt för respektive webbplats. Så huruvida en enskild webbplats fick 20 eller 500 sidor undersökta snedvrider inte den övergripande statistiken. Efter att varje webbplats egna genomsnitt beräknats har dessa genomsnitt beräknats för alla 557 webbplatsers gemensamma prestation och statistik.

Om jag gjort något statistisk misstag så hör gärna av dig, inte mer prestige än att jag fixar till det då jag har all grunddata kvar. Tror och hoppas att detta är tillräckligt grundligt för att vara nyttigt för de flesta 🙂

Statistik – en genomsnittlig webbsida i offentlig sektor

Nedan är aggregerad statistik från alla dessa webbplatser. Notera dock att filstorlek för textfiler anges i en okomprimerad form – så jämför inte äpplen med päron, exempelvis JPG-filers storlek med okomprimerad Javascript. Alla webbplatser skickar dessvärre inte sina textfiler komprimerat, därav att data rapporteras på detta sätt. Grovt förenklat blir en textfil en tiondel så stor om den komprimeras innan sändning (GZip, alltså).

Så här ser en genomsnittlig webbsida ut hos offentlig sektor i oktober, 2016.

Mätvärde Genomsnitt
Användbarhet 84.5 av 100
Pagespeed 62.1 av 100
Javascript 1 025 Kb
Bilder 360 Kb
CSS 316 Kb
Övrig text (textResponseBytes) ** 99 Kb
HTML 93 Kb
Andra filer (otherResponseBytes) 30 Kb
Anslutningens storlek 5,5 Kb
Adobe Flash * 5,2 Kb
Genomsnittlig svarskod 203,9
Antal filer totalt 46,3 st
Antal statiska filer 37,6 st
Antal Javascript 16,9 st
Antal CSS-filer 8 st
Antal värdar/domäner 7,8 st

* fanns bara på en av webbplatserna, detta är genomsnittet för den enskilda webbplatsen.
** fanns på 81 av 557 webbplatser, genomsnittet är för de webbplatserna, alltså genomsnitt för där det förekom.

Förbättringspotential

Det finns förstås många tips på hur man kan göra sin webbplats bättre, och Google Pagespeed ger via sitt API väldigt konkreta siffror på detta. Även fast vi inte vet nästan några som helst detaljer om hur de viktar en kvalitetsfaktor jämfört med en annan är det åtminstone ett sätt att kolla hur man står sig gentemot konkurrensen.

Betrakta nedan som den potential till förbättring så som Google ser på saken. Med tanke på att de är den dominerande sökmotorn samt att de sedan många år förklarat att hög prestanda ger en skjuts upp i sökresultatet så är det väl bäst att göra ett bra jobb. Vi kan väl kalla det för SEO om vi inte är bekväma med att kalla det webbanalys. Utöver det är det också ett mätbart sätt att jämföra en sida mot en annan på samma webbplats, eller att verifiera om nästa version av webbplatsen presterar högre.

Nedan mätvärden är hyggligt självförklarande för oss som utvecklar för webben, men tvekar du på vad de betyder så kolla in dokumentationen för Google Pagespeed.

Detta är den gemensamma förbättringspotentialen för offentlig sektor i oktober 2016, enligt Google. Största “problemen” är överst.

Mätvärde Genomsnitt
MinimizeRenderBlockingResources 39,7
UseLegibleFontSizes 13,0
LeverageBrowserCaching 11,6
EnableGzipCompression 8,9
OptimizeImages 8,2
SizeTapTargetsAppropriately 5,0
ConfigureViewport 3,6
PrioritizeVisibleContent 2,2
MinifyJavaScript 2,0
SizeContentToViewport 1,7
MainResourceServerResponseTime 1,6
MinifyCss 0,5
MinifyHTML 0,4
AvoidLandingPageRedirects 0,1
AvoidPlugins 0,03
AvoidInterstitials 0,0

Några tidiga slutsatser

Om jag ska börja med det som är positivt så är det faktiskt inte så illa som jag hade gissat. Jag hade inte blivit förvånad om jag hittat massor med plugins eller Adobe Flash. Att  SizeTapTargetsAppropriately (interaktiva designkomponenter likt knappar, länkar) var så pass bra var också förvånande.

Även fast Pagespeed för mobilt bruk på 62 av 100 inte är nära de 85 Google anger som en bra nivå så hade jag gissat på närmre 50. Med en hårsmån är svensk offentlig sektor bättre än de 10 000 största webbplatserna (enligt Alexa, nedladdat från httparchive). Dessa stora webbplatser hade i snitt 61,2 av 100 i mobil Pagespeed (notera att den siffran är preliminär, räknad på alla 330 000 undersökta sidor, inte ännu på beräknade genomsnitt per webbplats).

Det var också färre felmeddelanden än jag väntat mig. Den så kallade svarskoden var i genomsnitt 204,7 och då är “200” en indikation på att allt är frid och fröjd. Men om något felar så är svaret 400-nånting, eller 500-nånting. Om hälften av sidorna felat hade alltså svarskoden i snitt varit på över 300. Av alla undersökta sidor var det 0,8% felsidor, där cirka hälften var 404-sidor jag själv provocerat fram för att mäta även sådana sidor.

14 stycken webbsidor gav Error 500, alltså ett serverfel. Några av dem på grund av att deras 404-sida troligen är trasig eller att man helt enkelt missat att konfigurera en sådan.

Ofta för liten text, dålig cachning, dålig bildoptimering och inte komprimerad text

Klart negativt är att vi som kollektiv (ja, jag jobbar med webb inom offentlig sektor) verkligen missat enkla grejer. Som att den näst största förbättringspotentialen är att se till att text är läsbar i en mobil enhet. Kom igen, det är ju 4-5 år sedan nästan varenda offentlig organisation började med sina webbprojekt för det vissa kallade mobile first och andra kallade responsiv webbdesign. Att fixa textstorleken är minst sagt grundläggande. Med tanke på den låga viktningen som  ConfigureViewport fick kan man nog dra slutsatsen att ganska många “responsiva” webbplatser då verkligen inte har tänkt till när det gäller responsiv typografi.

En klart enklare grej är att aktivera Gzip-komprimering. Det är några textrader i filen .htaccess för dig med WordPress, eller web.config för den som kör webbplatsen på en Microsoft-plattform. Det tar kanske en timme att fixa – ba gjört 😛

En annan skitenkel sak är att använda webbläsarens cacheminne. Det är lika okomplicerat som Gzip. En återkommande användare kommer inte behöva ta emot oförändrade filer på nytt. Ingenting är snabbare än att låta bli att skicka en fil. Detta kanske många inom offentlig sektor kan sälja in på hemmaplan med att det handlar om digital krisberedskap. Under den flaggan kan många andra nyttigheter segla, som kommer göra webbplatsen bättre alla dagar när det inte är kris. Dessutom blir webbplatsen bättre på att stå emot när väl krisen inträffar.

Resultat

Jag tänker förstås inte tjuvhålla på det jag samlat in. Data för alla utvärderade webbplatsers prestanda, användbarhet, statistik samt förbättringspotential finns att ladda ned på länkarna nedan.

Det är en ganska lång lista med data. Om du inte har svart bälte i att bearbeta datakällor är det nog enklast att ladda ner Excel-filen. Den stödjer filtrering så du kan plocka fram en enskild webbplats, eller om du vill jämföra ett visst värde för flera webbplatser.

Blir du inte klok på vad mätvärdet handlar om så kolla in Google Pagespeeds dokumentation här.

Ladda ner alla data?
Filerna uppdaterades 15:e november. För att veta om du har den senaste så kolla om www3.bjuv.se är med, annars är det bäst att ladda ner filerna på nytt. De första filerna hade en mindre brist i precision vilket kunde rubba upp till 3% av en webbplats sidors resultat. Det är nu åtgärdat.

Denna utvärdering var strikt utförd med Googles Pagespeed. Vill du ha fler exempel på nyttiga verktyg, såväl kvalitativa metoder som kvantitativa, kan du kolla in webbanalys-boken. Den tredje delen har en fördjupning i webbanalys. Bland annat logganalys med ELK, övervakning med Pingdom, belastningsanalys med Apica och mycket mer. Kolla in boken om webbanalys hos förlaget Intranätverk eller Bokus

Tack Agneta Grangård och Johan Persson för korrekturläsning!

Läsa del 2 av utvärderingen – se visualisering?

Om du inte fått nog om detta finns det mycket mer att läsa i del 2. Den andra delen visualiserar den variation som finns bland webbplatserna, så det nyanserar de genomsnittliga värden vi just gått igenom. Kolla in del två av offentlig sektors användbarhet och webbprestanda