7 måter å gjøre nettstedet ditt eller bloggen lastes raskere for besøkende
Langsom sidelasthastighet er en av hovedgrunnene til at nettstedet ditt ikke får de treffene det fortjener.
Ettersom publikums oppmerksomhet er på lavtider, er det noen gode tips for å øke hastigheten på nettstedet ditt for å sikre at de besøkende holder seg fast.
1. Reduser den faktiske størrelsen på nettstedet ditt
Hvis nettstedet ditt laster tregere enn tre sekunder, vil folk sannsynligvis forlate det selv før hjemmesiden laster. Hvis du bruker feil format for bildene dine, kan du enkelt oppblåse nettstedet ditt, og ødelegge en ellers flott nettleseropplevelse.
Over 70% av de mobile nettsidene er over 1 MB, og 12% er over 4 MB! Husk at det tar syv sekunder å laste ned 1,5 MB på en god 3G-tilkobling. Den beste fremgangsmåten er å beholde hver side under 0,5 MB.
Lær forskjellen mellom JPG, PNG og GIF, og sørg for at du bruker oppløsningen du trenger.
Ifølge GlobalStats er disse de mest brukte skjermoppløsningene for 2018:
- 22,55% bruker en oppløsning på 360 x 640 (mobil)
- 11,73% bruker en oppløsning på 1366 x 768
- 8,26% bruker en oppløsning på 1920 x 1080
- 4,91% bruker en oppløsning på 375 x 667 (mobil)
- 2,94% bruker en oppløsning på 1440 x 900
Dette er over 50% av alle brukere, så vurder dette når du legger til bilder på nettstedet ditt.
2. Design ditt nettsted for mobil
Ifølge forskning gjort av Google i fjor på mobil sidens hastighet:
Den gjennomsnittlige tiden det tar å fullføre en mobil destinasjonsside, er 22 sekunder, ifølge en ny analyse. Likevel forlater 53% av de besøkende på mobilen en side som tar lengre tid enn tre sekunder å laste. Det er et stort problem.
Over 75% av mobilnettstedene tar 10 sekunder eller mer å laste over 3G. Godt over halvparten av all trafikk er via mobilenheter, og dette er ikke sannsynlig å gå ned. Så hold en liten nettsideavtrykk for å gjøre mobile Internett-brukere lykkelige, og sørg for at de holder seg fast!
Hvis du bruker et CMS som WordPress, Joomla eller Drupal Drupal vs Wordpress: Hva er den beste Open Source CMS? Drupal vs Wordpress: Hva er den beste Open Source CMS? Planlegger å sette opp et nettsted, men kan ikke velge riktig åpen kildekode-CMS? Slik velger du mellom WordPress og Drupal. Les mer, det er plugins for å gjøre nettstedet ditt mer mobilvennlig.
Alternativt kan du bruke verktøy som bMobilized eller Duda Mobile til å konvertere skrivebordet ditt til mobil. Når det er sagt, er det ofte best å designe et eget nettsted for å sikre den beste opplevelsen for mobilbrukere.
Du bør også vurdere å tilby en forenklet versjon av nettstedet ditt ved hjelp av prosjektet Accelerated Mobile Pages (AMP). Ved å bruke AMP-sider, forbedres sidens lasthastighet på mobilen. Det er strenge retningslinjer for JavaScript og CSS, men fordelene er målbare.
Uansett hvilken rute du bestemmer deg for å gå ned, må du sørge for at mobilwebområdet ditt er et lett alternativ. Og prøv å holde under anbefaling på 0,5 MB per side.
3. Sørg for at nettstedet ditt er redusert
Hvis du skriver ditt eget nettsted fra bunnen av, må du redigere det regelmessig. Når prosjektet utvikler seg, vil du sannsynligvis lære mer effektive måter å gjøre ting på, så sørg for at du går tilbake gjennom koden din mens du forbedrer.
Minifiser og kombinere CSS, HTML og JavaScript. Hvis du for eksempel bruker en CDN som Cloudflare, er det en bestemt kategori for hastighetsforbedringer, der det første alternativet er Auto Minify. Hvis du bruker en nettsidebygger (som Squarespace eller Weebly), er dette sannsynligvis gjort for deg som standard.
Pass på at du tester nettstedet ditt etter å ha aktivert alt som kombinerer eller reduserer nettstedets ressurser. Eksperimenter med de forskjellige alternativene for å se hva som er best for nettstedet ditt, da noen funksjoner kan bryte med Minify aktivert.
4. Unngå å laste inn skript når det ikke er nødvendig
Å måtte laste flere JavaScript-filer før de trengs, vil redusere hastigheten på hele siden unødvendig. Unngå å laste inn skript fra tredjeparts servere hvis du kan.
Be om disse vil redusere lastingshastigheten din ytterligere og kan potensielt utgjøre en sikkerhetsrisiko. Hold dem på nettsiden din server når det er mulig.
Du kan bruke utsette eller async å forsinke lastingen av spesifikke JavaScript-filer for å redusere belastningen på de besøkende enhetene og forbedre lasthastigheten på sidene dine. Alternativt, for små skript, kan du på linje JavaScript direkte inn i HTML-dokumentet.
Async vil fortelle nettleseren å fortsette å analysere HTML samtidig som JavaScript-filene lastes ned. Pause vil da skje etter at filen er fullstendig nedlastet.
I mellomtiden vil utsette fortelle nettleseren å utføre JavaScript-filer etter nettleseren har fullført hele HTML-dokumentet.
En nettleser vil som standard sette pause på HTML-filer mens andre JavaScript-filer hentes og kjøres.
Inlining JavaScript i HTML-dokumentet vil hjelpe deg ved å redusere antall filer en nettleser må laste ned før du viser en side. Du kan legge inn JavaScript ved å legge til innholdet i en ekstern JavaScript-fil mellom skriptkoder.
Du kan trygt bruke defer og asynk på Google Analytics, Facebook Pixel og andre verktøy for analyse og feilrapportering uten å påvirke funksjonaliteten til siden.
Til slutt vurderer du om sporingskoder, analyser, ekstrafunksjoner og annonser du har kjørt på nettstedet ditt, er nødvendige. Bruk mer lette alternativer når det er mulig, og skrap dem hvis de ikke legger til noe av verdi for deg eller dine besøkende.
5. Bruk Caching og en CDN
Et Content Delivery Network (CDN) vil kopiere nettstedet ditt til servere over hele verden og redusere datas reisetid ved å koble besøkende til en server geografisk nærmere dem. Statisk innhold vil også bli cached og levert av CDNs servere.
Cloudflare er sannsynligvis den CDN du kjenner best, men Akamai og Amazon CloudFront er veletablerte alternativer.
Sørg for at du også bruker nettleserens caching. Dette er hvordan nettleseren din kompromitterer din personvern. Dette er hvordan nettleseren din kompromitterer din personvern. Din nettleser avslører massevis av informasjon om hvem du er, hvor du går, og hva du liker. Her er detaljene det lekker når du går online. Les mer for å forbedre lastingshastigheten på nettstedet ditt for gjentatte besøkende. Browser caching virker ved å laste ned disse filene fra serveren til brukerens enhet.
På ytterligere sidevisninger eller besøk belastes disse filene lokalt fra brukerens enhet i stedet for å be dem fra den eksterne serveren (avhengig av utløpsdatoen for filene).
6. Bli kvitt ikke-essensielle plugins
Plugins skal kun brukes når det er nødvendig. Dette er sant om du bruker Wix, Weebly, WordPress eller Squarespace Squarespace vs Wordpress: 7 Forskjeller som kan overraske deg Squarespace vs Wordpress: 7 forskjeller som kan overraske deg I verdenene av web hosting og nettstedbygging er få navn større enn WordPress og Squarespace. Men hvordan bestemmer du hvilken du skal bruke? Les mer eller noe annet. Eventuelle funksjoner du kan gjøre ved å legge til enkle CSS i stedet for et plugin, bør du. Bruk Code Injection on Squarespace, bruk CSS Customizer i WordPress og Custom CSS på Wix.
Plugins kan forårsake høy CPU eller minne på serveren din, og dette kan redusere eller til og med stoppe nettstedet ditt fra lasting.
Hvis du bruker WordPress, er det sannsynlig at du ikke bruker alle de innebygde funksjonene. Deaktiver disse med en plugin som Clearfy.
Overvei alltid pluginene du bruker. Hvis du bruker noen få funksjoner i plugins som JetPack, bør du vurdere å fjerne dem helt og erstatte dem med flere lette plugins som gjør den samme jobben.
7. Serverinnstillinger for å øke hastigheten på nettstedet ditt
Serverforsinkelse vil ha stor negativ innvirkning på sidens lasthastighet og PageRank.
Google anbefaler at tiden til første byte (TTFB) er 1,3 sekunder eller mindre. Dette er den lengste forsinkelsen før en enhet begynner å laste ned en side etter først å ha kontaktet serveren. Når det er sagt, har den gjennomsnittlige siden en TTFB på over 2 sekunder, godt over deres anbefaling.
Delte verter er vanligvis grunnen til dette, men det er noen innstillinger du kan konfigurere for å forbedre serverens svartid.
- Bruk den nyeste versjonen av PHP som nettstedet ditt er kompatibelt med. Den nyeste versjonen (PHP 7.2) har massive hastighetsforbedringer.
- Skru på “Holde i live”
- Aktiver HTTP / 2
- Benytt deg av HTTP Strict Transport Security (HSTS)
- Sett sikkerhetskopiene dine til slutt om natten
Hvis nettstedet ditt er laget i WordPress, må du sørge for at du bruker en vert som spesialiserer seg på WordPress-hosting, som Bluehost. Dette vil sørge for at serverinnstillingene er konfigurert spesielt for WordPress-ytelse.
Ferdig Tweaking? Test ditt nettsted nå
Nå som du vet den ideelle siden, lastetid, størrelse og Time to First Byte (TTFB) som du skal sikte på, hvordan vet du hva din er?
Her er noen av våre favoritt elektroniske verktøy for å teste nettstedet ditt:
- varvy.com: disse verktøyene vil teste hastigheten og ytelsen på skrivebordet og mobilen din, og gi deg verdifulle retningslinjer for hvordan du forbedrer nettstedet ditt
- Google PageSpeed Insight: nylig oppdatert, vil Google PageSpeed-verktøyet teste hastigheten din og gi deg forbedringsforslag
- GTmetrix: et flott verktøy med praktiske råd
- WebPageTest: Test nettstedet ditt på forskjellige enheter, operativsystemer og steder
- Pingdom: et veldig populært verktøy som ligner på WebPageTest med et bedre grensesnitt
Du kan teste ditt mobilnettsted med koblingene ovenfor, og også ThinkWithGoogle Mobile Test (drevet av WebPageTest). Resultatene gir deg spesifikke tips om hva du kan forbedre, med en estimert belastningstidsreduksjon hvis du følger tipsene.
De anbefalte beste rutene endres hele tiden, så kontroller sidenhastigheten regelmessig når du gjør forbedringer.
For enda mer verdifull innsikt i hvordan nettstedet ditt utfører, husk å bekrefte domenet ditt på Google og Bing. De 5 viktigste fordelene ved å verifisere domenet ditt på Google og Bing De fem viktigste fordelene ved å bekrefte domenet ditt på Google og Bing Hvis du har ditt eget nettsted, er det derfor du bør bekrefte domenet ditt på Google og Bing med verktøyene for nettredaktører. Les mer
Utforsk mer om: Webutvikling.