Tutorial WordPress

            Optimalisere WordPress for fart

Rune, IKT-Servicefag, Haugesund
5 April 2017

Å optimalisere WordPress for fart er et av de viktigste grepene du kan ta for å være konkuransedyktig på Internett.

Hvis du lurer på hvorfor din WordPress-side er treg, eller du har et ønske om å forbedre hastigheten på din side, vil vi i denne veiledningen påpeke kritiske og viktige modifikasjoner som garantert vil gi din nettside en fartsøkning.

Å drifte nettsider er en kontinuerlig prosess som krever svært mye tid og arbeid. Tiden det tar for nettstedet ditt å laste påvirker hvor vellykket nettsiden din vil bli.

Optimalisering av nettsiden din for fart, er en av de mest kritiske komponentene i den digitale brukeropplevelsen.

Skiftene i den digitale hverdagen går raskt, så det er viktig at du hele tiden implementerer nye løsninger for fartsoptimalisering så snart de blir tilgjengelige. Bare slik vil du være konkurransedyktig i forhold til dine konkurrenter.

Google Analytics inkorporerer statistikk som sideinnlastingstid, oppslag og sidestørrelse for å rangere nettsider i sin søkemotor. Nettopp fordi dette er svært viktig i et innholdsdrevet digitalt samfunn.

Å være høyt rangert, kan rett og slett bety om din bedrift lykkes eller ikke.

Før vi går igang med å optimalisere WordPress, anbefales det å sjekke status på ditt nettsted. Det finnes flere gode og gratis online-tjenester som du kan benytte. Ved å benytte disse gratisverktøyene vil du også få gode tips til hva du kan gjøre for å forbedre resultatene fra ditt nettsted basert på testresultatene.

Du kan sjekke ut Pingdom, GTMatrix og Google Pagespeed.

Valg av Webhost

Valg av host(leverandør) og  servertype vil ha effekt på hvor rask din nettside vil være. Hvilken løsning du velger nedenfor vil derfor avgjøre hvor bra ditt nettsted blir i forhold til fart.

Shared Hosting kan sammenlignes med å bo i et leilighetskompleks. Alle beboerne i leilighetene må dele tilgjengelige serverressurser med hverandre. Dette inkluderer bla. CPU, minne og diskplass. Dette er klart det billigste alternativet og det de fleste starter med når de oppretter en nettside for første gang.

På en Virtual Private Server (VPS), blir du tildelt en fast del av ressursene. En VPS har i utgangspunktet langt færre brukere enn shared hosting. Dersom det eksempelvis er 5 beboere i et leilighetskompleks, vil alle brukerne på en VPS få 20% av serverressursene, slikt som CPU, minne og diskplass. Dette sørger for mer kraft og fleksibilitet enn å være på en delt konto, som shared hosting er. Denne løsningene koster selvfølgelig noe mer, men du får da en mer driftsoptimalisert løsning.

Dedikert Hosting kan sammenlignes med å eie et hus. Du har full tilgang til alle tilgjengelige ressurser på serveren. Ingen andre vil være i stand til å benytte ressursene, de er kun dine. Dette er en relativt dyr løsning, men dersom ditt nettsted genererer mye trafikk, er dette et must.

Valg av Webserver

Når det gjelder valg av webserver, er det stort sett 3 ulike varianter som benyttes: Apache, Litespeed eller Nginx. Denne veiledningen vil ikke se på fordelene mellom de ulike webserver-typene. Det finnes imidlertid masse informasjon der ute hvor dere kan lese om disse forskjellene.

Det som er klart, er at Apache er en aldrende løsning som nok kommer til å bli forbigått av både Nginx og Litespeed. Dersom du gjennom din webhost får muligheter til å eksempelvis kjøre Litespeed, ville vi ikke nølt med å benytte denne typen webserver.

Vi på IKT-Servicefag benytter selv Litespeed og har opplevd en radikal fartsøkning etter overgangen fra tradisjonell Apache-Webserver.

PROISP i Sandnes

Anbefales av oss på IKT-Servicefag i Haugesund. De har ulike hostingplaner og webserverløsninger for de fleste behov.

Valg av Template

Hvilken template eller rammeverk du benytter, vil ha stor betydning på hvor rask din nettside vil bli. Det finne selvsagt mange gratis templates som du kan benytte, men disse er ikke alltid nødvendigvis optimalisert for fart. De som følger med i WordPress som default, er helt greie og raske nok, men ofte ønsker vi templates med litt mer funksjonalitet.

Vårt råd er at du finner et godt kodet template som responderer raskt i en nettleser. Gjennom et enkelt Google søk vil du raskt få en oversikt over aktuelle templates som er optimalisert for fart. Vi på IKT-Servicefag har valgt å benytte oss av templates fra Elegant Themes, og vi kan varmt anbefale denne aktøren. Elegant themes har ca 80 ulike templates du kan benytte deg av. Vi har valgt å benytte templaten Divi på vår nettside. Disse templatene koster noen kroner, men det synes vi det er verdt.

«Å optimalisere WordPress for fart, er en av de mest kritiske komponentene i en digital brukeropplevelse.«

Utvidelser- et onde eller et gode?

En vanlig årsak til at nettsiden din kan oppleves treg, er at du har for mange plugins installert. Hold antallet plugins til et minimum. Vær dessuten nøye med at de utvidelsene du benytter er godt kodet slik at det ikke går ut over raskheten på nettsiden din.

Etterhvert som du begynner å bli flinkere i WordPress, kan du kanskje selv velge å implementere deler av funksjonaliteten i enkelte plugins direkte inn i kjernefilene til WordPress. Dette vil ha postiv innvirkning på farten til ditt nettsted. Husk bare på at du gjør dette i et child-theme.

Database Optimalisering

Bruk av plugins

En WordPress-database kan generere mengder med revisjoner, kommentarer, spam og brukerdata som tar opp svært mye plass i databasen din. Derfor må databasen optimaliseres og også vedlikeholdes med jevne mellomrom.

Hvis du først har bestemt deg for at det nå er på tide med en vårrengjøring av WordPress, er det også andre elementer du kan optimalisere enn kun selve databasen. Da bør du slette ubrukte plugins, bilder, temaer, samt fikse ødelagte koblinger. Alle disse tiltakene vil gjøre siden din raskere.

Optimalisere databasen direkte

For å oppdatere databasen manuelt, logger du deg inn på CPanel. Her leter du deg frem til databaseverktøy. Gå deretter inn på phpMyAdmin for å optimalisere datbasen(e).

Gzip

Gzip- komprimering «pakker» nettsider på en webserver før sidene sendes til den besøkende. Dette sparer båndbredde og du vil umiddelbart oppleve en dramatisk nedgang i tiden som en nettleser bruker for å åpne en nettside. Gjestenes nettlesere pakker automatisk ut sidene. Denne sammenpressingen og utpakking tar kun brøkdelen av et sekund og er et av de viktigste grepene du kan ta for å optimalisere WordPress for fart.

GZIP komprimering anbefales for alle typer tekstfiler som:

HTML
Tekstfiler (filtypen txt)
CSS og Javascript
Webtjenester, for eksempel JSON

Du kan enkelt implementere Gzip-komprimering i Cpanel, slik den grafiske presentasjonen nedenfor viser.

Det anbefales ikke å benytte Gzip- komprimering på grafiske filer eller regulære Zip-filer. Disse filtypene er i utgangspunktet godt nok komprimert og du vil dermed ikke tjene noe spesielt på å komprimere dem. Tvert imot, kan du muligens oppleve en økning i tiden det tar å laste en side.

Post Revisions

Hver gang du lager en ny side eller en blog-post i WordPress, så lagres det såkalte revisions/midlertidige utgaver i et visst tidsintervall. Disse revisjonene kan det være kjekt å ha dersom du mister informasjon som du ikke har fått lagret. Da kan du alltid velge en tidligere revisjon, en slags backup-løsning.

Disse utkastene tar imidlertid relativ stor plass i databasen, og det er begrenset hvor mange revisjoner av hver post vi egentlig trenger. Dersom du jobber med en lengre tekst som strekker seg over flere dager, så kan det fort bli mange revisjoner av posten eller siden du lager.

En rask nettside krever at databasen ikke inneholder unødvendig med informasjon. I utgangspunktet er det stort sett ingen begrensninger på hvor mange slike utkast eller revisjoner som blir lagret av WordPress når du jobber på en ny side eller en blog-post.

Vi på IKT-Servicefag har valgt å forandre hvor mange revisjoner vår database skal inneholde. Ved å legge inn litt ekstra kode i wp-config.php-filen vår, kan vi nemlig forandre dette. Denne filen finner du i roten av ditt nettsted ved å eksempelvis benytte Cpanel.

Dersom du ikke har opprettet et Child theme av nettsiden din enda, anbefales det at du gjør dette nå. Ikke forandre direkte i kjernefilene til temaet ditt. Alltid foreta forandringer i filene som du legger i child-themet ditt. Informasjon om hvordan dette kan gjøres ble det  skrevet litt om i vår Tutorial om sikkerhet.

I koden ovenfor er det kun de to kodestrukturene som begynner med define på linje 1 og 2 du skal legge inn i filen din. Koden som er under dette ble kun tatt med for å vise at koden du legger inn i wp-config.php-filen må komme før ABSPATH-koden, ellers vil ikke den nye koden fungere.

Koden ovenfor vil fungere slik at den kun lagrer dine utkast hvert 250 sekund, og det vil kun lagres 3 revisjoner av hver artikkel du lager. Du står selv fritt til å bestemme intervallet for lagring og hvor mange revisjoner du vil ta vare på. Noen velger også å fjerne revisjonene helt, men det er ikke anbefalt. Uansett hva du velger å gjøre vil WordPress alltid lagre minst en revisjon. Dersom du ønsker å fjerne alle fremtidige revisjoner, kan du legge inn koden nedenfor.

Minify

Når en nettleser åpner siden din, laster nettleseren inn en rekke filer, inkludert HTML, CSS og Javascript. For at nettsiden din skal være raskest mulig, må koden i disse filene være så minimalistisk som mulig.

I utgangspunktet er kodestrukturen i disse filene skrevet for å bli lest av mennesker. Filene vil dermed inneholde tomrom, kommentarer og formateringer som datamaskinen ikke trenger for å kjøre koden. Koden trenger altså ikke å se fin ut for at datamaskinen skal kunne lese den. Heldigvis kan dette fikses. Metoden vi benytter for å fjerne det som er unødvendig kalles på engelsk for Minify.

Minify er et programmeringsbegrep som i utgangspunktet betyr å fjerne alle unødvendige tegn som ikke er essensielle for at koden skal utføres. Ved å forminske kodestrukturen vil vi dermed dramatisk øke innlastningsfarten av nettsiden i en nettleser. Dette er svært positivt for brukeropplevelsen og ikke minst i rangeringen av ditt nettsted i Google.

Internett kan sammenlignes med en motorvei der en viss mengde trafikk skal kanaliseres. Selv om båndbredden til de fleste i dag er meget god, er det likevel smart å benytte teknikker som genererer filer og kodestrukturer som tar minst mulig plass.

Legg imidlertid merke til at enkelte tema, som for eksempel Divi fra Elegant Themes, har denne funksjonaliteten innebygget. Dette betyr at du ikke trenger å legge inn funksjonaliteten minify. På andre tema kan det imidlertid være aktuelt.

 

PHP-Versjon

 

PHP 7 er den nyeste versjonen av PHP. PHPNG (PHP Next Generation) ble slått sammen med PHP 7. PHPNG er kjernen i PHP og erstattet Zend Engine 2, som ble brukt i PHP 5.x. PHPNG er skreddersydd for mer effektiv bruk av minne og ytelse, noe som fører til at ting går mye raskere. Illustrasjonen nedenfor viser klare ytelsesforbedringer ved bruk av PHP 7, kontra PHP 5.6, som var forrige versjon av PHP.

Resultater fra målinger viser at PHP 7 er omtrent 2-3 ganger raskere enn PHP 5,6 og i noen tilfeller til og med raskere enn HHVM (et populært alternativ til PHP).

Å forandre PHP-versjon gjør du enkelt inne i CPanel dersom din host har lagt til rette for dette. Trykk først på ikonet som ser omtrent ut som illustrasjonen nedenfor.

Deretter kan du forandre hvilken PHP-Versjon du ønsker å kjøre på, som vist nedenfor. Den siste PHP-versjonen er 7.3.

Dersom du av en eller annen merkelig grunn skulle få problemer etter at du har skiftet PHP-versjon, kan du alltids gå tilbake til forrige versjon. Legg imidlertid merke til at det vil kunne ta opp mot 5 minutter før den nye versjonen av PHP er klar til bruk.

Pingbacks og Tracebacks

Pingbacks og tracebacks er en funksjonalitet i WordPress for å finne ut om noen har lenket til nettstedet eller bloggen din. Tracebacks er manuelle mens pingbacks er automatiske. Problemet med disse funksjonalitetene er at 99% av alle trackbacks og pingbacks er spam. Da sier det seg selv at dette kan generere så mye spam i databasen din at det potensielt kan gå ut over hastigheten på nettstedet ditt. For å unngå dette problemet kan du rett og slett fjerne denne muligheten direkte i WordPress.

Gå til Innstillinger> Diskusjoner under Standard Artikkel- innstillinger for å deaktivere pingbacks og tracebacks.

Uansett om du krysser av for at du ikke ønsker at pingbacks og tracebacks skal være aktivert, så vil du uansett kunne oppleve å få noe spam. Du kan imidlertid benytte en plugin for å avhjelpe med dette. Akismet kommer ferdig installert på en ny WordPress-installasjon, så alt du trenger å gjøre er å registrere deg med en API-nøkkel. Denne er gratis. Vi har meget gode erfaringer med å benytte Akismet.

Cache

Jeg tror vi trygt kan si at Cache er det mest populære grepet man kan gjøre for å optimalisere WordPress for fart. Dette er en av de mest grunnleggende teknikkene du kan implementere for å redusere database- belastningen og samtidig sørge for at nettsiden din reagerer raskt.

Innenfor cache, har vi to ulike cache-metoder: server-side cache og cache på klientsiden. Det er viktig å implementere begge cache-typene på ditt nettsted for å sikre optimalisert fart og brukeropplevelse.

Client-Side Cache

Å implementere cache på klientsiden, innebærer at de som besøker din nettside gjennom en nettleser blir servert en statisk html-fil. Noe data blir automatisk cachet gjennom nettleseren slikt som Javascript og CSS-filer. For å kunne legge til rette for at mest mulig av din nettside blir cachet, og slikt sett vil lastes raskere i en nettleser, kan vi gjøre noen forandringer i det vi kaller for .htaccess-filen.

Ved å legge inn en kodestruktur i .htaccess-filen som forteller nettleseren hva som skal caches, betyr det at vi legger inn utløpsdatoer i headeren på siden. På engelsk heter dette «leveraging browser caching». Dette vil da fortelle nettleser hvor lang tid disse filene skal «leve».  Denne måten å drive cache på er et høyt prioritert kriterium i f.eks. Google Pagespeed- testen, som jeg nevnte innledningsvis.

Nedenfor finner du en kodestruktur som du kan legge inn i .htaccess-filen din. Men først må vi sørge for at du finner filen.

For å finne .htaccess- filen din, logger du deg inn i Cpanel–> File Manager –> Public_html –> Gå til Settings og huk av for; Show hidden files, ellers vil du ikke kunne se .htaccess-filen din.

Deretter lokaliserer du din .htaccess-fil og åpner den. Legg deretter inn koden nedenfor og trykk lagre til slutt. Du kan legge inn koden nedenfor hvor som helst i .htaccess-filen din.

 

Server- side cache

Når det gjelder server-side cache i WordPress, snakker vi egentlig om fire ulike typer cache for å gjøre siden vår raskere. Forskjellene forklares i korte trekk nedenfor.

Side Cache Sidene dine vil lagres som HTML-filer på din lokale server og vil vise statiske HTML-sider til de besøkende (Dette er tidligere genererte data). HTML er betraktelig raskere enn PHP.

Database Cache WordPress fungerer på en slik måte at det foretas spørringer mot databasen kontinuerlig når besøkende går inn på nettsiden din. Det sier seg selv at dette blir lite effektivt. Hvorfor skal vi kjøre de samme spørringene mot databasen hele tiden? Ved å benytte database- cache, lagres resultatene av spørringene lokalt på serveren, og dette genererer raskere søkeresultater for de besøkende.

Objekt Cache Uten å gå for mye i detaljer her, så er dette en intern API av WordPress som cacher komplekse dataspørringer.

Opcode Cache Lagrer kompilert PHP-kode mellom forespørsler. PHP-filer er i utgangspunktet et sett med instruksjoner til en kompilator. Ved å benytte cache, eskalerer vi hastigheten som kompilatoren bruker for å genererer kjørbar kode for web-serveren.

En enkel måte å sørge for at alle aspektene ovenfor blir ivaretatt, er å installere en plugins som gjør jobben for oss. Disse pluginsene har avansert funksjonalitet, men stort sett kan de kjøres «out of the box» for vanlige brukere. Dersom du har tenkt å finjustere internt i pluginsene, anbefales det at du tar backup og leser deg opp på de ulike funksjonalitetene før du foretar en installasjon av slike plugins.

Cache Plugins

 

WP Super Cache. Dette er en av de mest populære cache- utvidelsene for WordPress. Kort forklart fungerer WP Super Cache ved å generere statiske HTML-filer av nettsiden din. Hvor lenge disse statiske sidene skal «leve» bestemmes av intervallet du angir i instillingene på pluginsen.

W3 Total Cache W3 Total Cache utvidelsen er mer egnet for høyt trafikkerte nettsteder. Den har et bredt utvalg av innstillinger og er nok mer et alternativ for de som absolutt vet hva de holder på med. Dersom du velger dette alternativet, les deg godt opp på hva de ulike funksjonene gjør. Ikke glem å ta backup før du setter i gang med å modifisere i innstillingene.

Litespeed Cache Denne utvidelsen har ikke like mange brukere som de to andre utvidelsene. Bakgrunnen for dette er at det kun er brukere av Litespeed web-servere som skal benytte Litespeed Cache. Litespeed komme mer og mer, og det skulle ikke forundre meg om denne utvidelsen får sin storhetstid om ikke så alt for lenge. Flere og flere nettsider går nå over til å benytte Litespeed istedenfor Apache. Dersom du kjører på standard Apache-server, skal du altså ikke benytte denne utvidelsen.

CDN

 

Content Delivery Network (CDN) er en tjeneste mange nettsider benytter for å distribuere statiske filer som CSS, javascript, bilder og filer bort fra hovedserveren. Denne prosessen gjør at nettsiden din vil lastes raskere og er et viktig steg på veien mot å optimalisere WordPress.

 

Kort forklart fungerer dette slik at dersom din serverhost er lokalisert i Norge, og en bruker i New York prøver å laste nettsiden din, vil det å benytte en CDN føre til at alle de statiske filene vil lastes i fra et datasenter som ligger nærmest mulig New York. Fordelen med slike CDN-tilbydere er nemlig at de har et stort antall lokasjoner av servere der dine filer kan ligge lagret. Det sier seg selv at dette vil generere en langt raskere nettside og brukeropplevelse ettersom de statiske filene nå ikke trenger å lastes sammen med selve nettsiden.

 

Det finnes etterhvert mange gode aktører som tilbyr CDN-løsninger. De mest kjente er kanskje Stackpath CDN og CloudFlare. Sistnevnte tilbyr en gratisversjon med redusert funksjonalitet. Flere serverhoster har i den senere tid implementert Cloudflare- funksjonalitet direkte inn i Cpanel, slik som PROISP.

 

Legg imidlertid merke til at dersom du kjører et SSL-sertifikat på nettsiden din, at du har https:// i nettleservinduet ditt, så vil dette ikke fungere med gratisversjonen til CloudFlare. Det finnes løsninger på konflikten mellom SSL og CloudFlare, men det kan dere imidlertid lese mer om på nettet selv.

 

Google har gitt tydelige signaler om at nettsider med SSL-Sertifisering vil bli høyere rangert i deres søkemotor.

 

Bildet nedenfor viser ikonet du kan benytte i CPanel for å integrere CloudFlare på ditt nettsted.

AMP

Mange benytter i dag mobiltelefonen til å lese innhold på Internett. Google startet en tid tilbake et nytt konsept som de har kalt Accelerated Mobile Pages. Kort sagt AMP.

Formålet er selvsagt at dette skal generere raskere nettsider på mobiltelefon for brukerne.

AMP fører til at nettsider lastes umiddelbart på mobilen. For at dette skal skje, begrenser AMP hva du kan gjøre med vanlige nettsider. Man kan si det slik at fancy design blir byttet ut med ren HTML. En AMP-nettside blir dermed en nedstrippet versjon av nettstedet ditt som er mye raskere enn et tradisjonelt nettsted.

Fordelen med å benytte AMP-funksjonalitet, er at Google oppgir egne AMP-sider i søkeresultatene på en mobil, og hvem ønsker vel ikke det (Se skjermdumpen nedenfor og legg merke til AMP-signaturen)?

Ved å benytte AMP vil du dermed få en høyere rangering i Google når en bruker søker med mobiltelefon sin. Dette betyr helt klart at dette er et segment som vi ikke kan ignorere. Å optimalisere WordPress for mobil bør gjøres nesten umiddelbart.

 

Det finnes flere plugins du kan benytte i WordPress for å få AMP-funksjonalitet på nettsidene dine. Husk alltid på å velge plugins som blir oppdatert med jevne mellomrom og at de er kompatible med din versjon av WordPress.

 

Størrelsen

En vanlig årsak til at mange nettsider er trege, er at selve nettsiden er blitt for stor. Ved å benytte verktøy som Pingdom, Google Pagespeed og GTMatrix vil du raskt få en indikasjon på den totale filstørrelsen på nettstedet ditt.

Oversikten nedenfor gir deg en pekepinn på hvor bra ditt nettsted er.

  • Under 500kb er utmerket
  • Under 1MB er bra
  • 1-3 mb er akseptabelt
  • 3MB pluss krever handling

Den største synderen når det kommer til at nettsider blir for store og tunge, er bildene du benytter. Men hva hadde vel et nettsted vært uten bilder? Som en regel kan vi si at bilder ikke bør være større enn 100 kb og at du bør lagre bildene som JPEG. Det holder imidlertid ikke å kun finne bilder på nettet som du laster opp til din egen nettside. Her er det en rekke grep vi kan gjøre for å få nettsiden vår ned i en akseptabel størrelse slik at sidene våre laster raskere.

Vårt nettsted havner omtrent midt på treet når det gjelder total størrelse, ifølge Pingdoom Tools.

Vi kan selvsagt redusere størrelsen på noen av våre bilder enda mer for slikt sett å få ned den totale størrelsen på nettsiden, men ofte blir det slik at vi bevisst foretar et valg om at enkelte bilder skal ha en litt bedre kvalitet. Da øker selvsagt størrelsen på nettsiden.

Ingen er nok uenige i at bilder bringer liv til innholdet på nettstedet ditt. De engasjerer og har svært mange viktige funksjoner.

Men hvis bildene ikke er optimalisert, kan de skade mer enn å hjelpe. Før du laster opp et bilde på nettsiden din, anbefaler vi at du bruker et bildebehandlingsprogram for å optimalisere bildene dine for web. Det finnes flere slike programmer du kan benytte som Photoshop, Paint.NET og Gimp. De to sistnevnte er gratis. Vi benytter i denne veiledningen Photoshop, som dere har tilgang til via skolen.

I utgangspunktet kan bilder ha en relativt stor filstørrelse. Men basert på bildeformatet og komprimeringsgraden du velger i et bilderedigeringsprogram under lagring, kan du redusere bildestørrelsen dramatisk. Vi anbefaler at du bruker «save for web«- funksjonaliteten i Photoshop til å redusere bildestørrelsen på JPEG-filene dine. Filen under er redusert fra 1.22 mb til 86 kb uten at du ser en nevneverdig reduksjon i bildekvaliteten. Det er litt vanskelig å se på bildet under, men bruk gjerne lupe 🙂

Det sier seg selv at med en så stor reduksjon i filstørrelsen, vil siden din laste mye raskere. Har du mange bilder på nettstedet ditt, noe vi tror de fleste har, kan besparelsene her bli astronomiske. Tips: Dersom du er på jakt etter bilder du kan laste ned på en lovlig måte, benytt gjerne Freepik.com.

 

Lazy Load

Ved å benytte Lazy load- funksjonalitet, forteller vi nettleseren at bildene ikke skal lastes i nettleservinduet før brukeren faktisk har skrollet seg ned til der bildene befinner seg. Det er ingen vits i at nettleseren skal generere data som kanskje brukeren ikke kommer til å se.

Det finnes mange plugins der ute som gjør denne jobben for deg. Sjekk ut de ulike alternativene her.

Smush.it

Smush.it er en fantastisk tjeneste fra Yahoo som optimaliserer JPEG-kompresjonen på bildene dine og stripper ut metadata. Den fjerner ubrukte farger fra bilder, etc. Du kan bruke nettstedet direkte, men heldigvis finnes det en WordPress plugin som automatisk kjører alle bildene du legger i mediabiblioteket på WordPress.

Skaler bildene

Generelt kan vi si at det er dårlig praksis å bruke HTML til å skalere bildene våre på nettsiden vår. Dette vil også føre til at leseren av nettsiden må vente lengre og det genereres mer unødvendig data.

Bruk heller et bilderedigeringsprogram til å gi bildene dine den nøyaktige størrelsen de skal ha. Da sørger du for at du har en nettside som fungerer mer optimalt.

CSS Sprites

Hvis et nettsted har mange små bilder, vil hvert bilde kreve sin egen HTTP-forespørsel mot databasen. Hver forespørsel mot databasen vil skape ventetid.

Ved å benytte CSS sprites samler vi på en måte alle småbildene i en større fil for så å benytte CSS til å velge riktig bit av spriten som skal vises på nettsiden din. Dette reduserer ikke selve mengden av data som nettleseren må laste ned, men det kutter drastisk ned på hvor lenge forespørselen mot databasen tar. Nå er det tross alt kun en fil som det utføres spørring mot, og ikke flere.

Det finnes mange måter å generere slike CSS- Sprites, men den enkleste er kanskje CSS Sprite Generator.

Legg imidlertid merke til at CSS-Sprites krever litt kunnskap om CSS og HTML. Hvis du er komfortabel med å redigere i CSS filer, er dette et godt trekk for å øke raskheten på siden din. Sørg imidlertid for å ta backup før du begynner å modifisere enkeltfiler i WordPress.

Hotlinking

 

Hotlinking er en metode andre nettsider benytter for å vise dine bilder på sitt eget nettsted. Problemet med dette, er at de stjeler ressurser fra din webserver. Dette vil utvilsomt kunne gjøre din nettside tregere. For å forhindre dette kan du logge deg inn i CPanel og velge at hotlink protection skal være aktivert.

Du kan også benytte kode direkte i .htaccess- filen din for å stoppe hotlinking. Koden nedenfor gir et greit utgangspunkt, men du må selvfølgelig legge inn din egen nettadresse der det står yourwebsite.

/* hotlink blocking */
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yourwebsite.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?otherapprovedwebsite.com [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ – [F]

Om du velger å gjøre dette i CPanel eller i .htaccess, er helt opp til deg. Begge metodene fungerer like godt.

CSS og JS

Alle moderne nettsider består av CSS og JS. Men ikke alle templates som er utviklet i WordPress tar høyde for hvor CSS og JS skal plasseres i templatestrukturen for å være raskest mulig. Kort forklart, uten å gå for detaljert inn i dette, bør CSS-referanser befinne seg helt i toppen av nettsiden og JS i bunnen. Dette vil føre til at du vil få en raskere innlasting av nettsiden din. Både Pingdom Tools, Google Pagespeed og GTMatrix vil sjekke om ditt template er satt opp på en best mulig måte.

For å oppnå denne effekten er det enkleste å benytte en plugin som Autoptimize eller WPRocket.

Avsluttende ord

Nettstedets fart er noe som alle WordPress-brukere må ta på blodig alvor. Ingen gidder å vente på en treg nettside i dagens samfunn.

En lynrask nettside vil hjelpe på din rangering i Google, holde de besøkende fornøyde, og vil resultere i flere delinger og eventuelle salg.

Selv om mye av ordbruken i denne tutorialen kanskje bar preg av nye ord og uttrykk og en slags teknisk diskusjon, så ikke la det skremme deg.

Hvor optimalisert du ønsker at WordPress skal bli, er avhengig av en rekke faktorer. Om du ikke umiddelbart klarer å få implementert alle tipsene i denne tutorialen, vil du uansett kunne oppleve en svært mye raskere nettside om du bare får implementert noen av tipsene.

Jeg anbefaler at du tester ditt nettsted med f.eks. Pingdom tools både før og etter at du foretar optimalisering av WordPress for å sjekke etter om forandringene gav resultater.

Det finnes også flere tips og triks du kan gjennomføre for å gjøre siden din raskere, og har du kommet så langt at du allerede har fått implementert de fleste tipsene her på ditt eget nettsted, da vil du utmerket selv klare å finne den informasjonen du trenger på nettet.

Lykke til!

Vær blant de første til å motta våre nyhetsbrev!

Meld deg på her!

[et_bloom_inline optin_id=optin_1]
Wordpress
Sørg for å sikre din WordPress-side
PRAKSISORDNING
Ny Praksisordning på IKT-Servicefag
Business Intelligence

Nytt analyseverktøy i undervisningen