Skær skaftet af tandbørsten

Når man bestiger bjerge, så tæller hvert lille gram, man kan skære af sin bagage. Derfor skærer man lige et par cm af skaftet på sin tandbørste.

Når man bestiger SERP så tæller hver lille byte også (det meddelte Google i hvert fald sidste år).

Det kan lyde åndssvagt, men når man er ude i ekstremer, så kan det være marginalerne, der tæller.

Udsigt fra mit telt i lejren Nido de Cóndores

Udsigt fra mit telt i Nido de Cóndores på Aconcagua, 5570 meter over havet

Derfor satte jeg mig for at optimere lidt på min flyttefirma oversigt i håb om at kunne tage det sidste trin op ad rangstigen.

Her kan du læse om processen.

Før oprydning

Først kørte jeg den daværende side gennem Firebugs netværks-test. Den viste, at siden fyldte 24,3 kb. Der udover smed jeg den igennem YSlow, der gradede den med B og gav den en overall score på 87. Yslow kommer med nogle rigtigt gode forslag til, hvordan man kan gøre siden hurtigere.

Her er før-resultaterne fra Firebug og YSlow

Firebug resultatet før YSlow resultatet før

Jeg fulgte nogle af Yslow rådene og her er hvad jeg gjorde:

  • Samlede to CSS filer i én. Det er altid en fordel at reducerer antallet af http kald (siger de kloge).
  • Minify stylesheetet. Ved at fjerne linjeskift og sådan kan man minificere sit stylesheet. Jeg brugte værktøjet her til opgaven og reducerede størrelsen fra 6,781 kb til 5,054 kb. Altså en reducering på 25%.
  • Fjernede favicon. Eller - jeg havde aldrig fået lavet et favicon, men havde et link til det. Så det link kunne jeg ligeså godt fjerne.
  • Fjernede inline CSS. Jeg ved godt hvor sjusket det er med inline CSS, men indimellem sker det. Nu fik jeg ryddet op i det

Den korte oprydning tog 10 minutter og størrelsen på forsiden gik fra 24,3 kb til 23,1 kb - altså reduceret med næsten 5% på 10 minutter.

Om det har nogen praktisk indflydelse ved kun Google - men nu har jeg gjort, hvad jeg kan (på 10 minutter - er godt klar over, at der kan gøres lidt mere).

Her er resultaterne efter min lyn-oprydning.

Firebug resultatet før

YSlow gav mig lidt bedre karakterer og jeg gik op på en overall score på 90.





Lars Juul Madsen 30/09/11 13:50

Fin lille guide. Ved ikke om det er en tryk-fejl, eller om det rent faktisk har hjulpet i Yslow. Du har skrevet 87 i oprindelig og 89 efter.

1

Thomas Ardal 30/09/11 14:09

Jeg tænker på, hvad får du egentligt ud af at drive en oversigt over flyttefirmaer? Som jeg kan se det, er der ingen reklamer, affiliate eller lignende på siden. Er det i bund og grund bare en uselvisk service til folket? :)

2

Morten Vadskær 30/09/11 14:09

Hovsa... Det var en trykfejl, Lars. Jeg checkede lige igen og har fået en score på 90. Jeg har rettet det i indlægget.

Tak for de vågne øjne

3

Morten Vadskær 30/09/11 14:12

Hvad får jeg ud af denne blog, Thomas?
Jeg driver flere sider, som jeg ikke får noget ud af blot som en service eller for at eksperimentere med mediet.

Jeg viser indimellem reklamer på min side og så får jeg lidt penge ud af det. Der udover kan det jo være, at der en dag kommer en køber af siden. Hvem ved.

4

Thomas Ardal 30/09/11 14:21

En blog tror jeg typisk ikke man vil få noget direkte økonomisk ud af. Men din blog skulle gerne få dig til at fremstå som en ekspert inden for dit fag, hvilket jeg også synes den gør :)

Men jo jeg kan da sagtens følge dig. Jeg driver også flere ting som jeg ikke tjener på. Man kan jo altid håbe på noget trafik, som man så evt. vil kunne bruge til et eller andet.

5

Michael Lehto 30/09/11 14:32

En god ide ville være at komprimere din grafik. F.eks. gik dit banner fra 76 KB til 68 KB. Det er 8 kb på 20 sek. :)

6

Morten Vadskær 30/09/11 14:32

Ja - det har du selvfølgelig ret i, Thomas. Men at fremstå som ekspert alene kan man nu heller ikke leve af, kan jeg godt afsløre ;-)

Men det er godt at ha' nogle sider at eksperimentere lidt med. Både SEO, Analytics og split-test, så dem har jeg som regel et par stykker af.

7

Kasper Bergholt 30/09/11 19:34

Pingdom Tools måler denne side til 918,8KB. Det er fontfilerne, der trækker op.

Men det går snapt. Er bloggen hosted hos Pil?

8

Marcel Fuursted 30/09/11 20:13

Rigtig god artikel, Vadskær!! Skal man være helt grov, kan man typisk hente små ting på at loade billeder, systemfiler og indhold fra tre forskellige servere - men det er måske lidt overkill lige her hehe...

Når jeg kommer til min computer igen får du lige et link til denne artikel fra et indlæg: "SEO - det er de små ting" som netop handler om (som navnet måske lægger lidt op til) de små ting man kan gøre i forhold til søgemaskineoptimering. De marginaler man kan skrue på, når der kæmpes om topplaceringerne :)

9

Morten Vadskær 01/10/11 12:02

Tak for alle kommentarerne.

Michael - Ja, jeg kan måske godt skære lidt af det, men det er skalerer efter skærmstørrelse, så hvis jeg gør det mindre bliver oplevelsen ikke så god for os med store skærme.

@Kasper - Den er hostet ved Unoeuro. Jeg kunne godt finde en hurtigere server, men så meget gør jeg ikke ud af det. Det her er et quick-fix.

@Marcel - Det med at hente fra flere serverer, var vist noget man gjorde i gamle dage, da serveren var sløv. Tvivler på at jeg kan opnå nogen gevinst ved at gøre det her. Der er trods alt tale om ganske få billeder

10

Thomas Ardal 01/10/11 12:41

Det er rigtigt nok, at det med at hente billeder fra forskellige servere, gav mere mening i gamle dage. Men det er ikke pga. hastigheden på serverne.

Før i tiden var browsere sådan indrettet, at de max kunne hente to filer fra det samme domæne på een gang. Havde man mange billeder på siden side, tog det derfor lang tid at hente, da der kun kunne hentes to af gangen. Hvis billederne blev spredt på flere domæner, kunne der hentes mange billeder på een gang. Det er f.eks. den teknik google bruger på Google Maps, hvor billederne der udgører kortet, hentes fra forskellige subdomæner af google maps domænet.

I dag er det dog ikke helt så vigtigt, da brosere kan hente flere billeder af gangen. Mener at det er 6 i Chrome og Firefox og det er typisk noget man selv kan indstille. Men har man mange billeder på ens side, kan dette stadig være meget vigtigt. Specielt hvis billederne ikke kan caches.

11

Michael Lehto 01/10/11 17:22

@Vadskær Jeg snakker om losslessly optimering, prøv f.eks. pngout her:

http://advsys.net/ken/utils.htm

12

Claus Heinrich 01/10/11 19:01

Godt at se noget loadspeed optimering Morten :)

Det kan skam godt betale sig at sprede sine filer ud på flere servere eller blot subdomæner. Det gælder js, css og mediefiler. Afhængig af antal af de filer man har og browsertype kan der faktisk hentes en del tid på at lave det.

13

Morten Vadskær 02/10/11 09:19

@Thomas - Se det var jeg slet ikke klar over det med de to billeder. I gamle dage skænkede jeg ikke mange tanker over hvordan browseren arbejdede.

@Michael Lehto - Jeg har ingen Windåser her på matriklen, så jeg kan ikke afprøve det. Men hvis det virker, så er det da genialt. Går der slet ingen kvalitet tabt? (Iøvrigt en noget 1997-agtig side du har fundet der ;-) )
Men et super tip. Bruger du selv værktøjet?

@Heinrich - Så kan jeg kun sige "Godt at se dig her" ;-)
Jeg synes nu ikke jeg er den værste til det med loadspeed. Mine sider er ikke super-optimerede, men jeg har som regel kun to stylesheets og få billeder. Jeg er jo til KISS så det giver lidt sig selv

14

Jan Skovgaard 02/10/11 10:46

Undskyld mig, men er det ikke lidt fjollet at bruge en helt anden tingest til billede-optimering, når man kan benytte smushit direkte fra yslow? :)

Alternativt så benyt smushit.com - samme service og det fungerer super.

15

Claus Heinrich 02/10/11 11:19

Tak Vads - jeg følger med i alt der kommer herfra bloggen via min reader. Der er for meget guld til at ignorere :)

Og ja enig med at du holder dig på den rigtige side af linien mht. at overfylde med eksterne filer. Ville blot indskyde da jeg så der var lidt tvivl om det kunne betale sig at sprede sine filer ud på flere (sub)domæner.

Mht. komprimering/optimering af billeder, benytter jeg som Jan også nævner Smushit - via yslow er der nogen rare funktioner.

Og hvis der er Wordpress folk her, så er der Smushit plugin der automatisk laver denne optimering når man uploader sine billeder - ganske rart.
Det er dumt ikke at benytte det, hvis man ofte benytter billeder i sine artikler/blogposts.

16

Morten Vadskær 02/10/11 13:43

Du skal ikke undskylde noget, Jan. Det er en fin kommentar. Jeg kendte ikke til smushit i YSlow. Vil bestemt afprøve det.

Tak for de pæne ord, Claus. Og fint tip til Wordpress folkene. Jeg ved der er flere af dem her på matriklen.

17

Morten Vadskær 02/10/11 13:46

Smushit er da genial. Den skar lige 3,7 kb af mit billede i toppen. Jeg elsker når jeg kan putte nyt værktøj i "værktøjskassen".

18

Rosenstand 02/10/11 15:40

Altsa Vakse... Hvis du nu havde læst ordentligt i din SEO-LEX, ville du have kendt Smushit. Det tool har været med lige fra version 10.0 ;-)

19

Morten Vadskær 02/10/11 15:45

@Rosenstand (røde ører)

20

Kent Medom 03/10/11 22:04

Hej Morten

Jeg har selv været meget ivrig efter at få strukket de sidste bytes ud af mine hjemmesider, men så så jeg en video fra Matt Cutts hvor han fortæller at det ikke er så vigtigt som man tror.

Det er selvfølgelig altid en god ide at have en hurtig hjemmeside af flere grunde, men når det vigtigste er på plads, bør man nok ligge kræfterne andre steder. Måske konverteringsoptimering og splittests ;o)

21

Morten Vadskær 04/10/11 11:32

@Kent men hvad ER det der konverteringsoptimering og splittests? ;-)

Du har nok ret - og jeg tror heller ikke at hastigheden har voldsom betydning i deres algoritme, men jeg er overbevist om at den rent faktisk spiller ind. Der udover hader brugerne jo også langsomme sider, så arbejdet er ikke spildt.

22

Jan Skovgaard 05/10/11 21:06

@Morten: Godt at se, det kunne bruges :-)

@Claus: Har du tilfældigvis en idé om, hvordan det plugin til WP fungerer? Så vidt jeg ved er smushit api'et endnu ikke offentligt tilgængeligt? - Men har længe haft idéen til et lignende plugin til Umbraco...:-)

23

Steffen 03/01/12 12:29

Ja, tror også der er lidt at hente her. Ihvertfald hvad jeg har hørt, for jeg har aldrig selv eksperimenteret med loadtider.
Kunne være man skulle afsætte lidt tid til det snart og give det et skud.

24

Michael Østergaard 05/05/12 13:11

Hov, det her indlæg har vidst gået min snude forbi ;)

I mit hoved starte optimeringen allerede før en pixel er sat i Photoshop eller før den første linje af kode er skrevet. Når man arbejder med websites, så er det vigtigt, at hver eneste side har et målrettet fokus, hvilket dog langt fra er tilfældet i den virkelig verden. Med alle de mobile enheder i dag, så begynder en mere fokuseret tilgang til websites heldigvis at vinde indpas.

Btw, tak for listen med flyttefirmaer :D

25

Morten Vadskær 05/05/12 13:37

@Michael Østergaard. Jamen der er nok kun en ting at gøre for at undgå, at det sker igen. Sæt bloggen her som startside og du misser aldrig en post igen ;-)

26

Smid en kommentar

Brug dit eget navn - ikke sådan noget "billig arganolie" eller "mobilt bredbånd"

Anti-spam-check (beklager, men det er åbenbart nødvendigt):

Hvad er fire + to? (skriv tal - ikke bogstaver)