Hurtig hjemmeside
Din ultimative guide til den hurtigste hjemmeside
Sådan laver du den hurtigste hjemmeside i wordpress
En hjemmeside er ikke noget man bare laver når den samtidig skal være hurtig, man skal nemlig tænke sig om for at hjemmesiden er hurtigt i sit udgangspunkt og man ikke ender ud i at skulle lave mange optimeringer efterfølgende. Det er ofte dyrere at rette til frem for at lave det rigtigt fra start.
Hvordan laver jeg hurtigt en hjemmeside i 2024?
Det være svært at overskue hvad man skal være opmærksom på når vi snakker hastighed. Jeg har prøvet at lave en guide som du kan følge og bruge når den nye hjemmeside og indholdet skal laves. Jeg starter fra en ende af, med de vigtigste punkter først. Og prøver at give dig en forklaring på hvad og hvorfor. Det gør det selvfølgelig til lidt mere end en simpel checkliste, men det er nødvendigt for at du kan træffe de rette valg.
Lidt om min baggrund: Jeg er udvikler og har været det i mere end 25 år. Mit fokus har altid været Hastighed og teknisk SEO. I starten byggede jeg mit eget CMS som var langt foran wordpress og andre open source systemer på markedet. I dag udvikler jeg mest i wordpress og har lavet alt fra konvertering af sites og redesign til medlemshjemmesider og webshops – Så vil du ikke selv så kan du selvfølgelig kontakte mig og få et godt tilbud.
Vil du også have Danmarks hurtigste hjemmeside? Ja selvfølgelig er dit svar vel 🙂 Du kan se de virkelige hastigheder længere nede i listen. Man skal nemlig ikke bare tage en score for gode vare.
Er du klar til at få dig en lynhurtig hjemmeside, præcis som kim-tetzlaff.dk? Cool, lad os gennemgå listen nedenfor.
Når hjemmesiden bygges
Lad mig stå for din nye hjemmeside
Med mere end 25 års erfaring med udvikling af hjemmesider, har jeg prøvet lidt af hvert.
Kontakt mig for et godt tilbud på din nye super hurtige hjemmeside
Anbefalede plugins til wordpress
Du kommer ikke udenom at skulle bruge plugins i den ene eller den anden form. Så tænker du sikkert, jamen plugins gør jo hjemmesiden langsom? Og ja det gør den langsommere, men for at få en hurtig hjemmeside som man kan bruge til noget, skal man faktisk bare tænke sig om før man installerer plugins.
WordPress er reelt kun lavet til simple sites i sit udgangspunkt, så hvis man gerne vil mere, skal man også installerer lidt plugins. Her er mit bud på nogle af de must have plugins jeg vil anbefale. Mangler du et plugin? så lad Kim Tetzlaff stå for at lave det helt rigtige plugin til din hjemmeside.
Som en sidenote, undlad at installerer for mange plugins, da en hurtig hjemmeside ikke kommer til at ske med for mange plugins. Installer kun hvad du har brug for, og undersøg altid om det du prøver at lave med et nyt plugin, i virkeligheden kan lade sig gøre i temaet eller de plugins du allerede har installeret.
Der findes mange plugins til at håndtere den interne SEO på hjemmesiden. Her tænker jeg på om du husker de rette søgeord, om det står alle steder det skal, om der er andre ord du kan bruge i dit indhold mm. altså om du får lidt hjælp til at lave din SEO – På denne hjemmeside bruger jeg Rank Math, som jeg har fundet betydeligt nemmere og bedre alternativ til de dyrere af slagsen. Rank Math er hurtigt, og sløver ikke siden på samme måde som jeg har set i andre plugins. Så du vil stadig have en hurtig hjemmeside efter installering af dette plugin.
Rank Math, fås både som gratis og betalt udgave.
WP Rocket er det plugin jeg benytter mest til yderligere optimering af hastigheden, men først når hjemmesiden er færdig. WP Rocket giver dig en hurtig hjemmesside, selvfølgelig ud over de hastigheder man opnår ved at følge denne guide som du har gang i at læse lige nu.
Det er et godt plugin fordi den ud af boksen tager højde for ret mange ting. Og man skal som bruger bare hakke af hvor det giver mening for lige din hjemmeside, og så efterfølgende teste hjemmesiden. Jeg har lavet en guide til opsætning af WP Rocket her.
WP Rocket tager sig blandt andet af:
Reklame
En hurtig hjemmeside er også lig med godt komprimerede billeder og de rette formater – Jeg benytter altid Imagify plugin til at komprimere billeder når de oploades til hjemmesiden. Dette plugin er også godt til webP formatet og skifter automatisk billederne ud på hjemmesiden når der er genereret et webP format.
Bruger du andre temaer, kan det være nødvendigt at programmere lidt for at klasser kommer med og opretholder det oprindelige design. Men det er sjældent det skal til. Komprimering af billeder og de rette formater, skal til for at kunne få en hurtig hjemmeside.
Assets Cleanup Pro er essentielt når man vil have en hurtig hjemmeside, men det plugin bruger jeg til når jeg skal fjerne CSS og js filer som ikke bruges på enkelte sider eller hele hjemmesiden. Det er godt fordi du på hver side kan sige her skal denne fil ikke loades, men du kan også gøre det globalt og fjerne filer fra hele siden.
Pluginet kan meget mere, man kan også forhindre andre filer, snippets af kode og hele plugins fra at loade på specifikke sider og eller hele siden. Så skal man have en hurtig hjemmeside, ja så er dette et vigtigt plugin. Alternativet er at programmere det ind i temaet, hvilket kan lade sig gøre. Har jeg selv gjort mange gange, jeg er så også udvikler.
Bruger jeg til backup af siden, både når jeg udvikler men også når siden er live. Den er god fordi den kan tage backup af siden når jeg fx opdaterer hjemmesiden, så jeg altid kan gå tilbage hvis noget skulle gå galt. Men også fordi jeg kan oploade backuppen eksternt på fx Dropbox eller lign.
Du kommer ikke udenom at skulle bruge en form på den ene eller den anden måde. Kadence blocks har allrede en form, test den først, før du benytter andre plugins, det kan jo være det er nok. Er det ikke nok, findes der som sagt en masse plugins til formålet. fx:
SMTP plugin er nødvendigt i de fleste tilfælde, for at du kan sende mails til fx brugerne på din hjemmeside, eller ordredetaljer mm. Ellers ender man med at de ryger i spammappen, også hos dig selv. Nogle af ovenstående har allerede den funktion indbygget, så du kan evt gå med det, eller installlerer et plugin til formålet:
Hastighedsoptimeringen
Ja, selvom man bygger siden med det bedste udgangspunkt for god hastighed og derfor får en hurtig hjemmeside, vil der alligevel være noget man skal tage hånd om. Heller ikke wordpress er 100% optimeret, ej heller de plugins man installerer. Det bedste er at du optimere hastigheden når du har lavet indhold, da hastighedsoptimering jo reelt går ud på at vise indholdet så hurtigt som muligt for dine besøgende.
Som du måske kan se på ovenstående er det yderst vigtigt når man skal have en hurtig hjemmeside, at basen bliver helt perfekt. Hastighedsoptimering efterfølgende er selvfølgelig med til at gøre basen endnu bedre, men har du ikke en hurtig base, kræver det meget mere arbejde med hastigheden at optimere på den og vedligeholde hastigheden. Så en hurtig hjemmeside kræver en god base.
Vil du hellere have professionel hjælp til optimering af hastigheden?
For at du kan få en nogenlunde ide om hvordan hastigheden er på din hjemmeside og se på hvad du kan gøre ved den. Skal du benytte et testværktøj. Her har jeg valgt Google Pagespeed Insights, mest fordi det er nemmest at bruge når man ikke har den store erfaring med hastighedsoptimering. Men også fordi det er den de fleste ser på når de skal vurdere om det er en hurtig hjemmeside – Det kunne lige så godt have været GT Metrix eller et lign værktøj som rent faktisk måler på hastigheden.
Google PageSpeed Insights, måler nemlig ikke hastigheden, den emulerer hastigheden, samtidig er der stor forskel på resultatet, altså man kan ikke nøjes med at se på scoren, da det ikke fortæller om hjemmesiden er hurtig. Man kan nemlig godt få en score der er på 100, men 3-4 gange langsommere end nedenstående test.
Når du tester, er det derfor vigtigt ikke kun at se på selve Scoren som Google spytter ud, den siger nemlig ikke meget om hastigheden på siden, du skal kigge på tallene der står under scoren. Alt for mange der laver hastighedsoptimering viser dig kun scoren når de skal fortælle omverdenen hvor gode de er, hvilket giver et forvrænget billede af hvordan hastigheden er. Men også du kan få en hastighed som på kim-tetzlaff.dk
Skal man have en hurtig hjemmeside, skal caching af html og statiske filer aktiveres – WP Rocket, aktiverer allerede caching når pluginet aktiveres, så denne del skal du ikke tænke så meget over hvis du bruger WP rocket som beskrevet ovenfor og har aktiveret det. Er denne del af hjemmesiden allerede super hurtig. Det eneste du skal være obs på er om du har et andet design på mobil, da du her også skal aktivere caching for mobile enheder, ellers vil det være samme cachet fil alle brugere får serveret.
HTML-cache er et system, der bruges til at gemme en kopi af en webside, så den kan indlæses hurtigere, når den besøges igen. Når en webside er gemt i cache, skal den nemlig ikke indlæses fra serveren, hvilket betyder, at siden indlæses meget hurtigere, hvilket er godt for brugeroplevelsen.
HTML-cache er en af de mest effektive måder at forbedre websidens hastighed på. Det er også en af de mest almindelige metoder til at optimere websider. Man opnår op imod en besparelse på 0.5-2 sekunder, og yderligere en forbedring i performance på op imod 700-1000 gange.
Der findes mange måder at finde ud af hvilken kode der bruges og ikke bruges. At fjerne ubrugt kode, giver en hurtig hjemmeside, da browseren ikke skal fortolke nær så meget kode. Jeg selv benytter Google Chrome og Coverage funktionen. Så kan man navigere på siden, og se hvor stor en procentdel der ikke bruges. Er den 100%, ja så kan filen fjernes helt, er den fx 95%, så kan det være du lige skal ind dybere og se om du bare skal kopiere noget af den brugbare kode, og fjerne filen efterfølgende.
Men det er en yderst vigtig manøvre, da kode der ikke bruges, læses alligevel og skal gennemses af browseren for at kunne definere om det skal bruges eller ikke. Så det er renderingsblokerende at der er for meget kode som reelt ikke bliver brugt.
En hurtig hjemmeside er ikke foreneligt med contentbuildere af ekstern art – Ja, jeg har selv været der engang.
Jeg brugte meget Visual Composer, fordi jeg synes det gjorde arbejdet nemt, og man kunne designe alle mulige ting med det. Men jeg blev klogere efter jeg for den 1000 gang jeg skulle optimere dens kode for at der ikke var for meget overhead.
Dette gjaldt også kunders hjemmesider som brugte Elementor eller andre lign. værktøjer. Ud over det kom WordPress også på banen med deres Gutenberg editor, som i starten var en meget udskældt editor, men nu hvor der findes udvidelser og plugins så er den slet ikke så tosset endda. Hele denne hjemmeside er designet med Gutenberg.
Jeg har konverteret mange hjemmesider fra fx elementor til gutenberg, og altid med samme resultat. En meget hurtig hjemmeside, med samme funktionalitet og samme design.
Som beskrevet før, en hurtig hjemmeside kommer ikke med dårligt komprimerede billeder, men heller ikke med for store billeder – Før du oploader billeder til hjemmesiden, tag en snak med din udvikler om hvilken størrelse billederne skal bruges i, når der er tale om den største størrelse på hjemmesiden.
Det er nemlig sådan at billedernes fulde størrelse helst skal svare til den største størrelser der er brugt på hjemmesiden. Andre billeder vil blive genereret ud fra det, og blive indsat i forskellige responsive størrelser. At billeder ikke bliver for store, vil skabe en hurtig hjemmeside, alene fordi brugeren skal hente mindre ned.
Lazyload er en teknik, der gør det muligt for hjemmesider at indlæse billeder, når de er nødvendige. Det betyder, at hjemmesider ikke skal indlæse alle billeder på én gang, men kun dem, der er nødvendige for at vise brugeren det, de har brug for. Dette gør det muligt for hjemmesider at indlæse hurtigere og spare båndbredde.
Det du dog skal være opmærksom på er at billeder over folden, ikke skal lazyloades, da det skaber forsinkelse på det brugeren ser og det kan forhøje CLS og rendering. Så fx et toplogo skal ikke lazyloades, ej heller ikoner eller andet der er i toppen. Lazyload er med til at skabe en hurtig hjemmeside, da billeder først loades når brugeren gerne vil se dem, fx scroller ned på siden.
Generatepress benytter allerede SVG ikoner i temaet, men vil du fx gerne have ikoner andre steder synligt, er det bedre at de er indlejret i HTML koden, sådan at de ikke først skal hentes ned. Undbå helst ikon fonte, da de sløver siden i form af at du jo aldrig bruger alle ikonerne i den font. Ofte bruger du måske 2-5% af dem. Nogle vil nok sige at det har ingen betydning for hvor hurtig hjemmesiden bliver, men det har stor betydning.
Gengivelsesblokerende elementer og filer, gør at siden lader vente på sig i forhold til at blive vist (renderet). Det betyder at renderingen sker senere og siden derfor også vises senere.
Hurtigt fortalt, en hjemmeside bliver af browseren læst fra top til tå, hvilket også vil sige at det bedste vil være hvis CSS starter i toppen, bortset fra den CSS der først skal bruges senere. Og javascript skal helst ligge i bunden af siden og loades senere. En hjemmeside skal helst være brugbar også selvom javascript ikke loades, dette er dog ikke tilfældet hos de fleste, heller ikke hos mig. Men at det loades senere, gør at siden kan blive renderet før javascript læses og tolkes. Og det skaber altså en hjemmeside der er meget hurtigere over folden.
Dernæst skal man også se på hvad man ellers loader. Men har du en ny hjemmeside skal du ikke tænke så meget over det, andet end baggrunde også kan være blokerende, så hold igen med det 🙂
Når man bruger fonte fra fx Google, så det der sker er egentlig følgende:
- Der laves en CSS fil hvori der står hvilke fonte der skal hentes
- Anden CSS henviser til hvilke dele af hjemmesiden der skal bruge hvilken font
- Først når begge er hentet, hentes den specifikke font ned for så at blive vist
For at gøre denne proces hurtigere, skal man kopiere den css kode som står i filen fra Google, og indsætte under Tilpas -> CSS i wordpress. Derefter kan du bruge Assets CleanUp Pro, til at fjerne den css fil der hentes fra Google.
Selv med ovenstående metode, så går der alligevel noget tid med at hente de rette fonte. Dette kan du optimere på ved at preloade dem. Først skal du finde ud af hvilke fonte der bruges, og derefter kan du via Assets CleanUp Pro eller WP Rocket preloade fontene. Du kan bruge browseren eller GT Metrix til at se hvilke fonte der hentes, de der hentes sent, skal preloades.
Eksterne scripts og css er det eneste du ikke kan styre 100%. Så der er ikke langt fra at du har en hurtig hjemmeside, til at den pludselig er langsom fordi fx Facebook er langsom, eller en anden tredjepartkode er langsom. Så enten skal du hoste den eksterne kode selv, eller du skal undlade at bruge så meget af det. En måde at komme lidt udenom, er ikke at følge de anbefalinger som den eksterne har til placering af koden, fx anbefaler mange at koden placeres i head, men placer den i stedet lige før det afsluttende bodytag, da det så IKKE er blokerende for dit eget indhold.
Det gælder fx ved FB pixel og andre pixler, Google Tag Manager, hotspot, chats, trustpilot mf. Fælles er dog, kan du undlade det, så gør det.
CDN benyttes når statiske filer (billeder, css og js filer) skal loade hurtigt uanset hvor i verdenen man som bruger er. Jeg bruger Cloudflare som CDN, det gør jeg fordi de har mange servere rundt om i verdenen, men også fordi de har både sikkerhed og hastighed inden over.
Det vil sige, fx kan den on the fly komprimere css og js filer, den kan lave billeder i de rette størrelser og formater, den kan også lave redirects mm. Det gode her er at Cloudflare er det man også kalder en DNS server, det vil sige, det er det første brugeren møder når de besøger din hjemmeside, og derfor vil nogle ting være meget hurtigere der end hvis brugeren først skal ramme din hjemmesides server.
Hjemmesiden hostes stadig hos den udbyder du nu har valgt at bruge, det er kun domænenavnet der ligger hos cloudflare så at sige.
Ja, først og fremmest er slidere ude, de var ret brugt engang, men brugerne gider dem ikke og scroller bare forbi, så hvorfor have dem på din hjemmeside? mit bud er at det mest er for din egen skyld hvis du bruger slidere, det er i hvert fald ikke for brugerens skyld 🙂
Skal du have en hurtigere WordPress hjemmeside?
Med mere end 25 års erfaring med hastighed på hjemmesider, er jeg den første i DK til at sætte fokus på hastighed,
og den første i DK til at hastighedsoptimere hjemmesider.
Kontakt mig for et godt tilbud og få en lynhurtig wordpress hjemmeside.
Målbart og No Cure No Pay
Søgemaskineoptimering og Teknisk SEO
Når man har en hurtig hjemmeside, skal man også have besøgende ind på hjemmesiden, dette er der mange måder man kan få det. Søgemaskineoptimering er en af dem, sammen med den tekniske del som kommer i form af at hjemmesidens base er god. Nu er websitet hurtigt og derfor kan du hakke den af, men du skal også lige tjekke nogle andre ting, og have i tankerne hvad der er godt for netop din hjemmesides søgemaskineoptimering.
Title tagget er den man udfylder for at få en overskrift i browserens fane, men også i søgeresultatet på fx google og andre søgemaskiner. Den er nok en af dine vigtigste at få udfyldt korrekt. Den skal både være sælgende så folk vil klikke på den i søgemaskinen, men den skal også være relevant i forhold til det der findes på lige netop den side. Du skal ikke lade systemet selv lave en title, da du ofte ender ud i titles som er meget korte og ikke rigtig sælger.
ofte vil man udfylde den ca sådan:
Fokus søgeord, sælgende tekst, relateret søgeord
Husk at de ord du bruger, også skal være en del af din H1 overskrift, men det skalikke være den samme.
Dette Metatag har ikke indflydelse på dine placeringer, men det har indflydelse på hvor godt siden sælger i søgemaskinerne. Altså CTR på søgeresultatet. Men det er vigtigt at bruge og skrive manuelt, da WordPress ellers bare vil tage et udsnit af det content som er på siden. Og det er ikke sikkert det sælger helt så godt. Det bruges også i nogle tilfælde når du deler siden på de sociale medier.
Der skal være mindst en H1 overskrift på siden, derunder kan der være flere underoverskfiter i form af H2 og H3. Husk at der er et hierarki i den måde det skal være:
- H1
- tekst
- H2
- tekst
- H3
- tekst
- H2
- tekst
Du skal oprette hjemmesiden i Google Search Console. Man kan bruge det til flere ting, men vigtigst er nok at man kan se hvor stor en synlighed man har på Google. Man kan både se eksponeringer og klik. Man kan også se hvor mange sider man har indekseret, indsende XML sitemap, om der er noget man skal være obs på i forhold til fejl på siden etc. Så det er et must hvis du gerne vil kunne holde øje og gøre det bedre.
Ja det er ingen hemmelighed, der skal være indhold på dine sider i form af tekst, billeder, links mm. En god tommelfingerregel er:
Det er vigtigt at du benytter billeder på de enkelte sider. Dette er både fordi det giver lidt mere til brugeren der søger, billeder siger ofte mere end 1000 ord. Men det er også fordi billeder også kan vise sig i søgeresultater, billeder bruges når sider deles, men det bruges også til optimering af hjemmesiden.
Dette skal du huske når du har med billeder at gøre:
Google følger links rundt om på nettet, og det er stadig meget vigtigt for hjemmesiden, at andre hjemmesider linker til netop din hjemmeside. Det anses nemlig som en stemme på din hjemmeside, og det kan google godt li. Jo flere der linker jo bedre, men links skal helst komme naturligt. Og det kommer de ved at du laver noget godt indhold som folk gerne vil linke til.
Men ud over det findes der gode alternativer til at få links, som reelt også er naturlige, men det kræver at du lægger noget arbejde i det.
fx kan du oprette dig på fora, skrive gæste indlæg, artikler i online aviser. Det er en start, og det gør også at du breder kendskabet til dig og det du laver.
Du skal også huske selv at linke ud til andre, det er nemlig også godt for dine placeringer at du i dine tekster, f linker til andre relevante artikler om det emne du skriver om. Husk på, google følger links og vil gerne at deres brugere får de bedste resultater.
Kategorier er godt til bloggen og shoppen når man har mange indlæg eller produkter, men du skal IKKE altid have dem indekseret. Det kommer meget an på mønstret af din blog, antallet af indlæg og artikler, antallet af produkter, det unikke for den enkelte kategori mm.
Nogle eksempler:
Har du fx 20 indlæg/produkter, hvor de fleste er i samme kategori, men nogle er også delt ud i underkategorier. Så skal kategorierne ikke indekseres.
Har du få indlæg/produkter, behøver du ikke kategorisere dem, men i stedet bare vise alle indlæg/produkter på en selvstændig side.
Samtidig skal du tænke over om det måske gavner kategorien, at der kommer en god unik beskrivelse ind på for at give den mere content, men også for at undgå at de samme produkter på hver kategori skaber dobbelt indhold.
Interne links er med til at gøre så Google kan finde alle dine sider på hjemmesiden. en hurtig hjemmeside gør at google kan finde dem hurtigere – Du skal derfor tænke over at der skal være interne links i teksten, eller på den enkelte side. Interne links bruges også af google til at se på hvilke sider du som hjemmesideejer synes er de vigtigste. Jo flere interne links en side får jo vigtigere er den i dine øjne. Google skal ikke følge det, men det skaber det man kalder sitelinks:
Uden en statistik af den ene elelr den anden art, kan du ikke følge udviklingen på din hjemmeside og se hvor mange besøgende du har. Opsæt Google analytics på siden, så du har noget at forholde dig til og tage beslutninger ud fra.
Google my business er endnu en ting du kan gøre for at oppe synligheden på Google. Du kan få stor synlighed på søgeord, firmanavn mm. som har relevans for din hjemmeside og virksomhed.
Ankerlinks er links til områder på en given side. Fx de links du ser i toppen af denne side, hvor der er lavet en indholdsfortegnelse, det er ankerlinks. Det øger både sandsynligheden for at din side bliver besøgt, da ankerlinks også vises i søgeresultater når det er relevant.
Ankerlinks laves ved at man linker til den ID som en boks har, selve linket er bare #IDnavnetPåBoksen.
FAQ på relevante sider kan oppe din synlighed på søgemaskiner som Google. Udformes de korrekt med FAQ Schema, så vil de med stor sandsynlighed blive vist i søgeresultatet på Google.
Ja, der er reklamer i dette indlæg
Jeg anbefaler ikke noget bare for at tjene penge, that’s a NoGo
