Læsetid: 1 minut

Måske er du ikke klar over det, men der holdes WordCamps over hele verden, året rundt. Prisen for deltagelse er så tæt på gratis det nærmest kan blive – ofte ikke mere end et par hundrede kroner for en hel weekend fyldt med inspiration og hands-on workshops. Du får samtidig mulighed for at møde nogle af de skarpeste hjerner der arbejder med WordPress hver eneste dag.

Ok, måske er flybilletten ikke helt gratis, men det er WordPress.tv videoerne hvor mange af de foredrag der bliver holdt, lægges op. Jeg faldt over dette foredrag fra Chris Lema som jeg bare må dele med dig.

Jeg vil derfor ikke skrive flere ord, men i stedet lade Chris Lema tage ordet.

Læsetid: 2 minutter

Når ordene digital sikkerhed og hjemmesider kombineres i samme sætning ser jeg oftest en ud af to ansigtsudtryk. Enten et let skræmt “Eeek ja, jeg aner ikke hvad jeg skal stille op med det.” eller et tomt blik og en træt mine der siger “Ikke den snak igen..”

Hvis du er en af de to ansigtsudtryk, så forstår jeg dig skisme godt. Det er et jævnt tørt emne, lidt på linje med forsikringer, realkreditlån og ratepensioner.

Derfor skal vi heller ikke snakke om sikkerhed i dag. Vi skal tale om hastighed og penge.

Hvad har sikkerhed og hastighed med hinanden at gøre?

Mit bud er, at selv hvis du ikke er interesseret i sikkerhed, så er du interesseret i hastigheden på din hjemmeside – og at spare penge.

Har jeg din opmærksomhed nu?

Du er måske stødt på nogle af mine tidligere indlæg om grønne hængelåse, HTTPS, SSL-certifikat (og andre knastørre forkortelser) og hvad det kan betyde for omsætningen, ikke at tage det seriøst.

Google helt tilbage i August 2014 annoncerede at de vil anvende krypterede forbindelse (HTTPS) som et ranking signal, hvilket betyder at en grøn hængelås påvirker dine søgeplacering.

Samtidig betyder en sikker forbindelse på din hjemmeside også at du får mere fart på, som igen påvirker dine søgeplaceringer.

En grøn hængelås og en god hosting udbyder kan betyde højere omsætning

En grøn hængelås sender et klart signal til dine kunder om, at deres oplysninger er sikre og dermed øges deres tillid til din hjemmeside og har du en webshop, betyder det at vejen til at de hiver kreditkortet frem, er bare lidt kortere.

Det som er gået unævnt hen i mange henseender, når der er tale om sikre forbindelser er, at det faktisk også kan betyde en markant forskel i hastigheden.

Når du anvender en HTTPS forbindelse åbner det nemlig muligheden for, at din hjemmeside bliver indlæst via HTTP/2.

Hold nu fast det er mange forkortelser!

Yes, I know! Desværre er teknik jo ikke ligefrem kendt for, at være nemt, at relatere til.

Det HTTP/2 betyder for dig er muligheden for, at hjemmesiden indlæses endnu hurtigere hvis du anvender en hosting udbyder der har er god kvalitet – og er du i tvivl, så spørg dem om de understøtter det.

Sådan fungerer HTTP/2

Du ved måske, at en del af din hjemmeside består af en masse små filer, nogle hedder JavaScript-filer, nogle CSS-filser, så er der billeder, osv.

Når en bruger besøger din hjemmeside, skal disse filer leveres til den besøgendes browser før de kan se hvad der foregår. Normalt foregår dette ved, at de sendes en-efter-en i pæn kø-kultur. Den næste fil i rækken sendes først når den nuværende er færdig.

Forestil dig du skulle handle ind i dit lokale supermarked, men der er kun én kasse åben og alle filerne er kunder i køen. Det lyder lidt træls, ik?

HTTP/2 betyder at der er en “kasse” per kunde (fil). Er der 100 filer, så er der 100 kasser åben i supermarkedet. Det betyder at alle kunderne (filerne) kan betjenes samtidig.

Det betyder en helt anden form for fart på din hjemmeside – og så får du samtidig sikkerhed med oven i pakken. Whats not to love?

Læsetid: 3 minutter

Når det kommer søgeoptimering og konverteringer er hastigheden som en hjemmeside eller webshop indlæses på, en af de vigtigste faktorer du kan arbejde med.

Hastigheden er en af de vigtigste dele fordi selv hvis du har en høj page rank hos Google og er god til at trække besøgende til med markedsføring, vil du tabe den del af dem, som er utålmodige, hvis hastigheden er langsom.

Brugerne er nemlig blevet mere kritiske overfor hastigheder. Omkring 30% af de besøgende (2015) forventer at en webshop indlæser på under ét sekund – I modsætning til 5% i 2009.

Jeg kan uden en krystalkugle afsløre, at det tal ikke er blevet lavere i 2017.

Billede af krystal kugle

Foto af Nigel Tadyanehondo på Unsplash

Hvad fortæller din Google Page Speed Score

Google Page Speed Insights er et rigtig godt værktøj – Hvis det anvendes korrekt og resultaterne læses korrekt.

For mange hjemmeside ejere bruges tallet desværre ikke som det burde og i den forkerte kontekst – og det medfører de nogle gange jagter en Moby Dick . Og selv hvis de fanger deres hvide hval, er den ingen garanti for, at det giver bedre resultater.

Billede af en hvalhale

Foto af Abigail Lynn på Unsplash

“Men Yan, jeg har hørt jeg skal have så høj som mulig en Google Page Speed Score – Er det forkert?”

Betyder en høj Google Page Speed Score at min hjemmeside indlæser hurtigere?

Både ja og nej. Det er en rigtig god idé at optimere din hjemmeside ifht. Google Page Speed Insights anbefalinger.

Det er dog ikke det eneste aspekt – Det er bare oftest det punkt hjemmeside ejere bliver “fanget” på, for X ud af 100 er så tillokkende en størrelse.

For at citere Google, udregnes din score ud fra to målepunkter:

Tiden “Above-the-fold”
Tiden det tager fra det øjeblik en bruger går til en side og indholdet “above-the-fold” er indlæst i browseren.

Tiden for “Full Page Load”
Tiden det tager fra det øjeblik en bruger går til en side og alt indholdet er indlæst i browseren.

Med andre ord tager Google Page Speed Insights en masse tekniske aspekter i betragtning, men Google skriver endda at de kun tager højde for de netværks-uafhængige målepunkter.

Billede af Google skriver de kun måler netværksuafhængige målepunkter

Det betyder at du sagtens kan have en teknisk veloptimeret side, men en langsom hosting udbyder, uden at Google Page Speed Insights fortæller dig det – For det er ikke hvad deres værktøj er lavet til.

Og det gør ikke din hjemmeside særlig meget hurtigere da den “maksimale” hastighed vil være begrænset af din hostingudbyder.

Overvej din return on investment

Du skal blot huske på, at med alt optimering er der en afvejning af følgende faktorer:

  • Tiden du anvender
  • Ressourcerne du anvender
  • Hvad du får ud af det

Oversat til et mere menneskeligt eksempel betyder det, at hvis du investerer ca. 1 timer arbejde i at få din Page Speed Score op fra f.eks. 87/100 til 95/100 så er det en ret fin investering, da det vil betyde et site som teknisk er bedre optimeret.

  • Men hvad nu hvis det kostede dig en uges arbejde? Er det så stadig investeringen værd? Hvad ville du få ud af det i retur?
  • Hvad hvis det kostede dig 4.000 kr. for en udvikler, uden du fik flere salg som indirekte følgevirkning af det?
  • Hvad hvis det betød en stigning på bare 0.5% i omsætning?

Det er nogle af spørgsmålene du skal stille før du kaster dig ud i det.

Hvad skal du så måle med

Du skal stadig anvende Google Page Speed Insights og følge deres anbefalinger.

Jeg vil anbefale at du ud over Page Speed Insights anvende Pingdom Full Page Test. Pingdom måler nemlig på de faktorer som Page Speed Insights ikke måler – og samtidig er der ting som Pingdom ikke måler på.

Når du optimerer din hjemmeside handler det nemlig om, at få så fuldt et billede som det er muligt for bedst at kunne optimere de ting der giver dig mest værdi.

Husk at en af de mest betydende faktorer ifht. hastighed er dit valg af hosting udbyder

I tilfælde af, at du skulle have misset nogle af de tidligere indlæg jeg har skrevet om emnet, så er et af de bedste valg du kan foretage ifht. at få en hjemmeside der indlæser hurtigt, at investere i en hosting udbyder af god kvalitet.

 

Læsetid: 3 minutter

”Advarsel” det følgende indlæg er et nørdet og indeholder potentiale for midlertidigt, at kunne få dele af din hjemmeside til, at holde op med, at fungere hvis ikke du ved hvad du laver.

Kan du huske Warp Drivet fra Star Trek? Altså det der følger den famøse sætning ”Warp drive mr. Scott” – og BUM! Så er rumskibet halvvejs over galaksen.

Ville det ikke være fedt om du kunne få noget lignende til WordPress? Det spørgsmål ville jeg selvfølgelig ikke stille med mindre det var muligt.

Mød Hyperdrive

Jeg har gennem den sidste måneds tid afprøvet pluginnet ”Hyperdrive”. Og navnet er ganske sigende for hvad pluginnet gør.

Hyperdrives indledende tests viser at det kan give helt op mod 200-300% (https://hackernoon.com/putting-wordpress-into-hyperdrive-4705450dffc2) forøgelse i den opfattet hastighed på en hjemmeside. Bemærk dog, at resultaterne kan variere alt efter din opsætning, hosting udbyder, etc. da der er mange faktorer i, at optimere en hjemmeside.

Hyperdrive på GitHub: https://github.com/comfusion/hyperdrive

Sådan virker Hyperdrive

En let forenkling af hvad pluginnet gør er, at anvende en teknologi der hedder Fetch Injection https://hackcabin.com/post/managing-async-dependencies-javascript/

Fetch Injection findes i de fleste moderne browsere og har du opdateret din browser fornyligt så er der en god sandsynlighed for din browser kan anvende Fetch Injection.

Hyperdrive opsamler samlige scripts på din WordPress hjemmeside og anvender derefter Fetch Injection til at indlæse dem parallelt.

At de indlæses parallelt betyder ”på Dansk” at hvis du f.eks. har 3 scripts, vil du almindeligvis skulle vente på script #1 indlæses, derefter script #2 og til sidst script #3.

Almindelige hjemmesider har en hel del scripts – og det betyder en relativt lang kø hvor der spildes en masse tid på at vente. Det kaldes også en ”waterfall graf” og alle der kan lide performance og hastighed, afskyer waterfall grafer.

Hyperdrive gør i stedet det, at alle scripts indlæses samtidigt, lidt som hvis et supermarked udvidede fra én kasse, med én kø, til 100 kasser, med kun én person i hver kø.

Før du går i gang med Hyperdrive

Hyperdrive er i BETA, hvilket betyder at der er et stykke eksperimentel kode. Det medfører at risikoen for fejl er højere end normalt og der er ikke garanti for, at det bare lige virker ”out of the box”.

Sådan kommer du i gang med Hyperdrive

Hvis du har en udvikler baggrund, så er alt hvad du skal gøre at gå til GitHub repositoriet og hente den seneste version.

Er du helt ”almindelig” WordPress bruger, synes jeg stadig du skal have en mulighed for, at afprøve Hyperdrive. Derfor har jeg lavet den følgende installations guide til dig.

  1. Gå til https://github.com/comfusion/hyperdrive
  2. Tryk på ”clone or download” ude til højre
  3. Vælg ”Download Zip”
  4. Find filen ”hyperdrive-master.zip” på din computer og pak filen ud
  5. Gå ind i mappen ”hyperdrive-master” og find mappen ”src”
  6. Omdøb den til ”hyperdrive”
  7. Upload denne mappe til /wp-content/plugins/
  8. Gå til /wp-admin/
  9. Aktiver Hyperdrive

Men øhh.. Yan.. Hvorfor installerer du det ikke bare fra Plugins i WordPress..?

Jo. Godt fanget af dig. Jeg installerer det på ovenstående måde fordi den version som ligger i WordPress Plugin Repository pt. ikke er den seneste fordi pluginnet stadig er et løbende eksperiment. På ovenstående måde får du den seneste version.

Efter du har aktiveret Hyperdrive

Nu kommer den væsenligste del. Du skal løbe din hjemmeside igennem og se om der er nogle ting som opfører sig underligt eller ikke fungerer som det skal.

Og virker alt som det skal? Så tillykke! Nu skulle din WordPress hjemmeside gerne være markant hurtigere.

Oplever du problemer og ved du ikke hvordan du skal rette det, så har du to muligheder. Send mig en mail eller deaktivér pluginnet.

Læsetid: 2 minutter

Har du en WordPress hjemmeside eller en WooCommerce webshop og kører den lidt sløvt i det? Så får du her min liste over de første ting du skal sikre dig for at opnå en hurtigere loadtid.

Jeg har skrevet et par indlæg om loadtider, optimering og performance over det sidste år. Det er et emne som bliver vigtigere og vigtigere for dig at have bare rimelig lidt styr på.

Dette indlæg er tænkt som en tjekliste, så du har styr på de lavt hængende frugter du kan plukke, som giver dig en hurtigere loadtid.

Indlægget her er ikke tænkt som en detaljeret gennemgang af hver punkt, men har du spørgsmål så skriv i kommentarerne.

Din webshops loadtid kan være en flaskehals for omsætningen

Hvis ikke du er klar over det, så hænger din loadtid meget tæt sammen med de potentiale for hvor meget din webshop kan omsætte for.

Brugerne på Internettet er nemlig blevet utålmodige og forvente. Antallet af brugere der er på nettet med deres smartphone er kun stigende og det betyder for dig, at hastigheden for din webshop er endnu væsentligere end før.

Før du går i gang, vil jeg anbefale at du tager en backup og noterer dig hvad du ændrer undervejs.

Sørg for at bruge et værktøj som f.eks. Pingdom Full Page Test til at teste undervejs, så du ved om du er på vej i den rigtige retning.

Er du klar? Her kommer ”tjeklisten”

Vælg en solid hosting udbyder

Sørg for at vælge en hosting udbyder der er kendt for kvalitet og god ydeevne. Du kan ikke forvente en sportsbils hastighed, til prisen af en kvægtransport.

Anvend PHP 7.0 eller PHP 7.1 med OP Cache.

Beklager de tekniske udtryk her, det er hvad det hedder – er du i tvivl om det er slået til, så spørg din hosting udbyder eller din webudvikler.

Husk at bekræfte, at din webshop stadig fungerer efter det er slået til. Det kræver nemlig en vis kodestandard for, at PHP7 kan anvendes.

Komprimér JavaScript og CSS filer

Et af mine favoritværktøjer til dette er Autoptimize, som jeg har skrevet om tidligere.

Opsæt Caching

Der findes et utal af Caching plugins og det kan være svært at vælge. Blandt dem som er nemmest at opsætte er WP Super Cache, WP Fastest Cache og WP Rocket.

Øg mængden af tilladt hukommelse for WordPress

Redigér din wp-config.php og tilføj følgende, lige før linjen

/* That’s all, stop editing! Happy blogging. */
define(‘WP_MEMORY_LIMIT’, ‘512M’);
define(‘WP_MAX_MEMORY_LIMIT’, ‘512M’);

Det sætter grænsen op for hvor meget hukommelse WordPress kan få lov til, at anvende. Værdien 512M er det minimale jeg ville acceptere for en solid hosting udbyder.

Du kan gøre meget mere end ovenstående

Ovenstående er de første relativt enkle ting at gå til og bør gøres på enhver webshop eller hjemmeside der har intentioner om, at have styr på loadtiden.

Der kan gås meget mere i detaljer, men det er ikke formålet her. Formålet er at du med relativt enkle midler, kan gøre din hjemmeside eller webshop hurtigere.

Hav en skøn dag 🙂

Læsetid: 2 minutter

WordPress er i sin grundform rigtig godt, særligt hvis du bruger en kvalitets hostingudbyder. Det værende sagt, så har WordPress også en flaskehals. Det er databasen som indeholder alle indstillinger, indlæg, sider, osv.

Ofte er dette ikke noget du vil mærke noget til, men i takt med at databasen begynder at vokse i størrelse kan det tage længere og længere tid at spørge om data. Det gør sig særligt gældende ved store webshops med tusindvis af produkter, eller store magaziner med tusindvis af artikler.

Hvorfor det tager længere og længere tid

Når hentes data fra databasen, gøres det ved, at lave en query – på Dansk, en forespørgsel. Denne forespørgsel kan variere i kompleksitet. Du kan sammenligne det med en bibliotekar der skal finde en bog frem.

Kære bibliotekar, find mig bogen hvis titel er Hobbitten og fortæl mig hvad der står på side 23, linje 1

Det er en rimelig enkel forespørgsel som formentlig ikke vil tage særlig lang tid. Det kunne svare til at spørge WordPress om: Find produktet hvis titel er Hobbitten og fortæl mig hvad prisen er.

Det tager næsten ingen tid at udføre, da der formentlig kun er ét produkt som matcher denne forespørgsel. Selv med tusindvis af produkter, vil det være hurtigt at udføre.

Det bliver hurtigt mere komplekst

Webshops og hjemmesider er dog opbygget af en lang række queries (database forespørgsler) som spørger på meget forskellig data.

Kære bibliotekar, find mig de bøger hvis titel starter med Hob, der har ordene “rød eller grøn, men ikke blå, i sig” og hvis forfatters navn starter med “J”.

Det er en noget mere kompleks forespørgsel, da bibliotekaren potentielt skal igennem mange bøger. Det er ikke noget problem med f.eks. 5 bøger. Overvej dog hvordan tiden stiger med 10 bøger, 100 bøger, 10.000 bøger?

Det er lige præcis problemet med store databaser, det tager længere tid at udføre de komplekse forespørgsler.

Der er brug for komplekse forespørgsler

Det ville være nærliggende at tænke “Jamen, kan vi ikke bare droppe de komplekse forespørgsler?”. Desværre er det ikke så enkelt.

Forestil dig hvordan en webshop uden produktsøgning eller sortering af farver, priser, etc. ville være for dig at anvende?

Det er måske fint hvis vi taler om 10 eller 50 forskellige produkter, men knap så spændende hvis der er 10.000 forskellige produkter.

Gør WordPress hurtigere med Elastic Search

En af måderne du kan gøre forespørgsler til databasen hurtigere er ved at anvende Elastic Search.

Elastic Search er et service lag der lægges ovenpå WordPress, hvor din WordPress database synkroniseres med Elastic Search databasen.

Det betyder at WordPress’ data bliver markant hurtigere at lave forespørgsler i, fordi Elastic Search er optimeret til søgninger, særligt komplekse søgninger.

Sådan kommer du i gang

For at kunne anvende Elastic Search har du først og fremmest brug for et sted hvor du kan køre et Elastic Search cluster, det kan du f.eks. gøre via https://www.elastic.co/ eller hos Amazon.

Herefter har folkene bag 10up udviklet to plugins som slutter Elastic Search sammen med WordPress og WooCommerce.

ElasticPress: https://wordpress.org/plugins/elasticpress/

ElasticPress WooCommerce: https://da.wordpress.org/plugins/elasticpress-woocommerce/

Og er du til det lidt mere nørdet omkring Elastic Search, så kan jeg anbefale denne præsentation fra WordCamp Europe 2016 i Wien