hoe uw Website te versnellen

als u een beginner en nieuwe website-eigenaar bent, zult u zich in de meeste gevallen geen zorgen maken over de snelheid van de website.

nadat u uw website hebt gebouwd of uw blog hebt opgestart, voelt het misschien alsof alles op zijn plaats is. Uw site is mooi, dus dat moet betekenen dat mensen geen probleem hebben wachten een paar seconden meer om het goed te laten laden, toch?

Nee, dat is niet het geval.

volgens Google research, hoe langer het duurt voordat een pagina wordt geladen, hoe meer mensen een website verlaten.

ook, Google heeft geïntroduceerd Web Core Vitals (dat geldt als een ranking factor voor websites) die gaat in nog meer detail als het gaat om de snelheid van het laden van websites. Hoe sneller uw website, hoe beter uw kansen om naar de eerste pagina van Google zoekresultaten.

14 stappen om de snelheid van de website te verbeteren

• Stap 1: Voer een snelheidstest uit
• Stap 2: Krijg snelle en betrouwbare webhosting
• Stap 3: Implementeer een Content Delivery Network (CDN) – service
• Stap 4: Minify CSS-en JavaScript-bestanden
• Stap 5: Browser caching inschakelen
• Stap 6: optimaliseer en reinig de WordPress-database
• Stap 7: gebruik geoptimaliseerde/premium en eenvoudige thema ’s
• Stap 8: optimaliseer alle afbeeldingen op uw website
• stap 9: Lazy load images and video’ s
• stap 10: voorkom hotlinking van afbeeldingen
• stap 11: Host video ‘ s op services van derden en offload grote media
• stap 12: Keep plug-ins minimaal/zoek de plug-ins die u vertragen
• stap 13: beheer omleidingen op uw website
• stap 14: Optimaliseer inhoud (gebruik fragmenten, splits lange artikelen en opmerkingen, enz.)

Stap 1: Voer een snelheidstest

uit voordat u iets doet, is het belangrijk dat u een goede test uitvoert. Hoewel je veel kunt doen, zelfs zonder een, ik raad het uitvoeren van ten minste één snelheidstest, zodat u een benchmark die u zal helpen om te begrijpen hoe goed uw site presteert, en hoe goed het resultaat is nadat u klaar bent met alle van de verbetering stappen.

free tools

gelukkig zijn er voor iedereen vrije snelheidstests beschikbaar. Je hoeft alleen maar een te kiezen, voer uw URL, en laat de tool zijn magie uit te voeren.

Google ’s PageSpeed Insights

aangezien de meeste mensen hun site optimaliseren voor Google, is de eerste tool die Ik zal noemen Google’ s PageSpeed Insights. Het is heel eenvoudig, en je kunt het resultaat in een kwestie van seconden hebben.

1. Open Google ‘ s PageSpeed Insights.
2. Voer de URL van uw site in.
3. klik op de knop” Analyseren”.

in mijn geval duurde het slechts 10-15sec voordat de test was voltooid en me de resultaten in de onderstaande schermafbeelding liet zien.

na het zien van het groene nummer op de top waar u streeft naar een score van 100 te krijgen, zullen er verschillende andere segmenten die u wilt onderzoeken. Dat zijn:

• eerste Contentful Paint (FCP)
• grootste Contentful Paint (LCP)
• cumulatieve lay-Outverschuiving (CLS))

alle drie de elementen zijn een onderdeel van Web Vitals die nu zijn opgenomen in de belangrijkste statistieken van Google die zal laten zien hoe snel of traag uw site is. Meer informatie over Web Vitals vindt u in onze gids over hoe u uw mobiele site kunt optimaliseren.

GTmetrix

een van de meest populaire websitesnelheidstests is GTmetrix. Het is volledig gratis, en kan worden gedaan in minder dan een minuut:

1. Ga naar GTmetrix.
2. Voer de volledige URL van uw site in.
3. druk op de knop “test uitvoeren” en wacht ongeveer 30 seconden.

daarna krijgt u een cijfer dat u laat zien hoe snel uw website is. De test zal ook tonen u details zoals de prestaties van uw site, de structuur, evenals Web vitals die nu een core ranking factor voor Google.

Als u nog niet actief hebt gewerkt aan het optimaliseren van uw site voor snelheid, dan is de kans groot dat u niet een perfecte score te krijgen. Maar maak je geen zorgen, u kunt werken in de richting van dat als je begint met het volgen van alle stappen.

Stap 2: Krijg snelle en betrouwbare webhosting

een snelle website begint met goede hosting. Het maakt niet uit hoe hard je probeert om de beste gebruikerservaring te leveren, als uw hosting zuigt, zal de snelheid van uw website eronder lijden.

de beste hostingbedrijven zorgen voor alles, en het is niet nodig dat u begrijpt wat er achter gesloten deuren gebeurt. Van de kwaliteit en goed onderhouden hardware tot regelmatig bijgewerkte software componenten, Er is veel dat een hosting service kan doen om de snelheid van uw site te verbeteren.

om op de juiste manier te beginnen, wordt uw site gehost met Bluehost, een van de zeldzame hostingbedrijven die officieel wordt aanbevolen door WordPress.org. jarenlange ervaring en miljoenen gehoste websites maken van dit hostingbedrijf een van de beste in hun vakgebied – iets dat gemakkelijk zal vertalen in het hebben van een robuuste website.

Stap 3: Implementeer een Content Delivery Network (CDN) service

onze wereld is een grote plaats. Hoewel de internetsnelheden in de loop der jaren drastisch zijn verbeterd, speelt de fysieke afstand tussen computers en servers nog steeds een belangrijke rol in de Online snelheid. Dit betekent dat het laden van informatie van een server uit uw land over het algemeen sneller zal zijn dan het laden van gegevens van over de hele wereld, net zoals het gemakkelijker is voor u om een salontafel te kopen bij IKEA in uw woonplaats in plaats van te rijden om er een in een ander land te krijgen.

Dit is waar Content Delivery Networks een rol spelen. Hiermee kunt u uw website gehost op verschillende servers over de hele wereld. CDN kan de dichtstbijzijnde locatie herkennen bij elke individuele lading van uw site en de inhoud van de dichtstbijzijnde server laden. Dus, als een bezoeker probeert om uw site te laden uit de VS, zullen ze de inhoud van een van de VS servers, terwijl iemand uit Europa zal uw site te laden via een server in de buurt van hen, bijvoorbeeld in Londen.

als u de site host op Bluehost, kunt u hun TrueSpeed CDN vinden in het bedieningspaneel. Gewoon door het op te zetten, zal uw site wereldwijd worden en sneller laden naar mensen uit de hele wereld.

u kunt ook CDN-diensten van derden krijgen. De meest populaire CDN ‘ s zijn:

• Cloudflare
• KeyCDN
• StackPath
• Google Cloud CDN
• Rackspace
• CacheFly
• Amazon CloudFront

Stap 4: Verklein CSS en JavaScript files

Moderne websites worden gevuld met CSS en JavaScript files die samen werken om web-pagina ’s op zoek naar mooi en werken in gebruikers’ gunst. Regel na regel code maakt deze bestanden onnodig groot, die snel kan vertragen uw site.

webdesigners (dezelfde mensen die de sjablonen bouwen die u uiteindelijk koopt) houden hun code graag netjes. Dit betekent dat ze houden de code er mooi en gemakkelijk te begrijpen. Het hebben van die witruimtes, extra regels en tekens verhoogt echter alleen het gewicht van het bestand, dat gemakkelijk kan worden verminderd door minifying.

hier is een voorbeeld van eenvoudige CSS-code:

het kan worden verkleind tot dit:

hoewel dit eenvoudige verschil geen significante impact zal hebben op uw site, Stel je voor wat er gebeurt als je duizenden en duizenden onnodige witruimtes en lijnen hebt.

gelukkig hoeft u niet door de code te gaan en de wijzigingen zelf aan te brengen om uw CSS-en JavaScript-bestanden te minifyen. Er zijn plugins die dit automatisch voor u doen en ervoor zorgen dat alles correct werkt:

Stap 5: browser caching

inschakelen door browser caching in te schakelen, staat u toe dat de inhoud wordt opgeslagen in browsers van mensen. Dat betekent dat als een bezoeker besluit om terug te komen naar uw site, ze zullen niet alle bestanden van de server opnieuw te downloaden als ze al hebben opgeslagen in hun browser.

browsercaching kan de snelheid van uw website voor terugkerende gebruikers aanzienlijk verbeteren.

om dit op uw site mogelijk te maken, heeft u alleen een Gratis WordPress plugin nodig, zoals:

• W3 Total Cache
• WP snelste Cache
• WP Super Cache

Als u bijvoorbeeld W3 Total Cache gebruikt, hoeft u alleen de plugin te installeren:

de plugin zal automatisch het opzetten van uw caching-instellingen en ze zullen onmiddellijk beginnen te werken in uw voordeel. Als u besluit om in meer details te gaan, kunt u het tabblad Prestaties dat nu zichtbaar is aan de linkerkant van het WordPress menu waar alle plugin-instellingen zichtbaar zijn te openen. Hier, kunt u andere opties indien nodig wijzigen.

Stap 6: optimaliseer en reinig de WordPress-database

uw WordPress-website kan niet werken zonder een database. Alles wat je doet en hebt op de site wordt daar opgeslagen. Zoals u zich kunt voorstellen, thema ‘ s en plugins niet altijd schoon te houden, dus zelfs als u een specifieke plugin te verwijderen, zal het een aantal gegevens in uw database. Na verloop van tijd zal de database rommelig en inefficiënt worden, wat zal resulteren in een trage website.

hoewel het mogelijk is om de database handmatig op te schonen, betekent dit dat u moet begrijpen hoe het werkt. En zelfs als je dat doet, is de kans groot dat je het nog steeds kunt verpesten.

gelukkig zijn er gratis WordPress plugins beschikbaar die de database voor u optimaliseren en opschonen. Echter, voordat u iets doet, zorg ervoor dat u een volledige back-up van uw website of een manier om wijzigingen ongedaan te maken. Hoewel WP-Optimize een bekende en veilige plugin is, kan het direct bewerken van een database soms fout gaan.

dus, in het geval er iets mis gaat, stel ik WP Reset voor. Deze plugin zal een momentopname van uw site te maken en kunt u snel terug te rollen eventuele wijzigingen gedaan. Dus, in het geval er iets mis gaat, kunt u uw database te herstellen in een paar minuten, in tegenstelling tot het herstellen van een volledige back-up die meer tijd kan duren.

Stap 7: gebruik geoptimaliseerde / premium en eenvoudige thema ‘s

sjablonen en thema’ s zijn niet alleen visueel. Om ze te maken, webdesigners moeten coderen in functies, opties, en afbeeldingen invoegen die allemaal zullen combineren in een enkele werkthema.

zoals u zich kunt voorstellen, zal een sjabloon dat bijvoorbeeld vijf bestanden en drie afbeeldingen laadt, veel sneller laden dan het sjabloon dat vol zit met tien bestanden en twintig afbeeldingen. Het grote aantal is niet de enige belangrijke factor, maar hoe goed alles is geoptimaliseerd komt ook in aanmerking.

omdat er zoveel WordPress thema ‘ s en sjablonen beschikbaar zijn, is het moeilijk om de beste te bepalen. Hier zijn enkele van de populaire WordPress thema ‘ s die zijn ontworpen om er goed uitzien en snel laden:

• Hallo Elementor
• Astra
• GeneratePress
• OceanWP
• Sydney

Stap 8: Optimaliseren van afbeeldingen op uw website

Afbeeldingen kunnen eenvoudig een van de belangrijkste problemen snelheid van uw website. Ongeoptimaliseerde afbeeldingen blijven onnodig groot en moeilijk te downloaden. Als u te veel van hen gebruikt, zullen gebruikers een harde tijd het laden van de hele pagina van uw website, en waarschijnlijk uiteindelijk verlaten voordat ze de inhoud te zien.

gelukkig is het niet zo moeilijk om afbeeldingen geoptimaliseerd te houden. Het is belangrijk dat u uw thema/sjabloon onderzoekt om te leren welke afbeeldingsformaten u nodig hebt. U kunt dan zorgen voor de afbeelding voordat u deze uploadt door het formaat ervan te wijzigen en de kwaliteitsinstellingen te wijzigen.

als u slechts een paar afbeeldingen wilt optimaliseren, kunt u een service van derden zoals TinyPNG gebruiken. Met deze image optimization tool kunt u uw bronafbeeldingen uploaden en wordt deze vervolgens automatisch geoptimaliseerd. Sleep gewoon & de afbeeldingen laten vallen en laat de Panda zijn werk doen. U krijgt dan de geoptimaliseerde versies van uw afbeeldingen die u veilig op uw website kunt zetten Downloaden.

Als u al een actieve website hebt en geen tijd hebt om afbeeldingen één voor één te optimaliseren, is er een freemium plugin die al uw problemen oplost. ShortPixel Image Optimizer zorgt voor al uw afbeeldingen die beschikbaar zijn in uw mediabibliotheek. Het werkt ook geweldig met NextGEN, Foo Gallery, evenals andere gallery en slider plugins.

met de gratis versie kunt u tot honderd afbeeldingen verwerken. Enkele van de functies omvatten:

• het optimaliseren van de grootte en kwaliteit van de beelden.
• formaten converteren naar een ander.
• werkt met WebP en AVIF.

het enige wat u hoeft te doen is de plugin te installeren en de instellingen aan te passen aan de manier waarop u wilt. Kies de compressie die u nodig hebt, stel de grootte van de afbeeldingen in en druk op de knop wanneer u klaar bent voor de plugin om het optimalisatieproces te starten.

stap 9: Lazy Load afbeeldingen en video ‘ s

meestal, wanneer een gebruiker een website opent, begint de gehele inhoud die moet worden weergegeven automatisch te laden. Dus, zelfs als een gebruiker alleen de bovenstaande fold inhoud nodig heeft, zouden ze nog steeds alles beschikbaar op die pagina geladen.

door luie afbeeldingen en video ‘ s te laden, kunt u gebruikers alleen inhoud laten laden die zichtbaar is op het scherm. Zodra de gebruiker begint te scrollen, afbeeldingen en video ‘ s die bewegen in het zichtbare gebied van het scherm zal beginnen met laden. Op deze manier zal de hele site sneller laden en een betere gebruikerservaring mogelijk maken.

lazy loading inschakelen in WordPress:

stap 10: voorkomen dat image hotlinking

Hotlinking is een actie waarbij de bron van een afbeelding van de ene website wordt gekopieerd om deze op een andere website te gebruiken. Hoewel de afbeelding zal worden weergegeven zonder problemen, is het eigenlijk niet laden van uw server. In plaats daarvan gebruikt het alle bronnen van de oorspronkelijke site en wordt het als illegaal beschouwd.

door hotlinking te voorkomen, kunt u voorkomen dat andere mensen uw afbeeldingen stelen. Op deze manier bespaart u resources op uw eigen hosting service, wat betekent dat uw site de enige zal zijn die deze resources gebruikt, wat resulteert in een snellere website voor uw bezoekers.

er zijn verschillende manieren om hotlinking te voorkomen:

• met behulp van een CDN: de meeste populaire CDN ‘ s zoals Cloudflare en KeyCDN hebben al hotlinking bescherming ingeschakeld.
• met behulp van beveiligingsplugins: alles in één WP Security & Firewallplugin geeft u controle over hotlinking.
• klik met de rechtermuisknop op uw afbeeldingen uitschakelen: gebruik een plugin zoals Contentdiefstal voorkomen .
• wijzigend .htaccess-bestand: meer geavanceerde gebruikers kunnen hotlinking direct uitschakelen door het wijzigen van de code in de .htaccess-bestand.

stap 11: Host video ’s op diensten van derden en offload grote media

wanneer u een website start, is het zinvol om al uw video’ s en grote mediabestanden op uw eigen server te hebben. Echter, wat je misschien ontbreekt is dat het opslaan en reproduceren van grote bestanden neemt serverbronnen. Als het gaat om de snelheid van uw site, het is veel handiger om offload video ‘ s en grote mediabestanden op 3rd party services om bandbreedte te besparen.

een video geladen vanaf YouTube zal net zo goed werken (zo niet beter) dan geladen vanaf uw server. En als je meer verkeer hebt, betekent dit de minder impact op uw bandbreedte, wat resulteert in een snellere site.

als het gaat om video ‘ s, kunt u ze hosten op:

• YouTube;
• Vimeo; of
• Wistia.

stap 12: plug-ins minimaal houden/Zoek de plug-ins die u vertragen

elke plug-in verbetert uw website. Echter, elke nieuwe functie betekent ook nieuwe bestanden die ruimte en bandbreedte in beslag nemen. Ook, niet alle plugins zijn hetzelfde gecodeerd, dus de kans is groot dat u een plugin die vertraagt uw site door het laden van onnodige elementen die u misschien niet eens bewust van.

voordat u alle plugins uitschakelt, stel ik voor om een snelheidstest te doen.

deze plugin zal een aantal tests uit te voeren op uw website en tonen u een grafiek en details. Wat u geïnteresseerd bent in Hier is de” runtime door Plugin ” tab die een grafiek toont u al uw actieve plugins en hun impact op de site zal trekken.

Controleer op de grootste “pieces of cake” in uw grafiek die de plugins toont die het langzaamste zijn op uw site. Merk op dat dit niet betekent dat je om zich te ontdoen van die specifieke plugin.

met deze test kunt u al uw add-ons analyseren, zodat u de voor-en nadelen kunt afwegen en kunt beslissen welke langzame plug-ins u kunt verwijderen of een alternatief kunt vinden.

stap 13: Beheer omleidingen op uw website

het hebben van omleidingen verbetert de gebruikerservaring, en kan zelfs uw SEO verbeteren indien correct gedaan. Het hebben van actieve omleidingen zal geen negatieve invloed hebben op uw site. Echter, met elke redirect, uw site wordt een beetje langzamer. Dus, als je uiteindelijk met te veel redirects (het creëren van een zogenaamde redirect keten), milliseconden zal optellen, en uw site zal langzamer worden.

een van de meest populaire tools voor het omgaan met omleidingen is Screaming Frog. U kunt ook uitchecken:

• Redirect Checker
• Sitebulb
• Deepcrawl

door de software te installeren of een online scan uit te voeren (afhankelijk van het gereedschap dat u kiest), kunt u uw website scannen. Het toont u een gedetailleerde analyse van de website, en snel laten zien dat u doorgestuurd URL ‘ s. Omdat alleen te weten dat een URL wordt omgeleid zal niet veel zin, u zult houden van de functie die u de bron van een omleiding toont. Dit zal u helpen om uw website te begrijpen, en kunt u handelen op de omleidingen door het verwijderen van degenen die niet nodig zijn.

als u een redirect-keten vindt die uw site vertraagt, is de oplossing eenvoudig – in plaats van omleiden van link A naar link B die naar link C gaat, moet u gewoon de omleiding wijzigen naar de laatste link in de keten.

voor het verwerken van omleidingen in WordPress kunt u een gratis WP 301 Redirects plugin gebruiken die u zal helpen al uw omleidingen te beheren.

stap 14: Optimaliseer inhoud (gebruik fragmenten, splits lange artikelen en opmerkingen, enz.)

soms kunt u veel doen door kleine dingen te veranderen. Als u een blog schrijft, kunt u een snellere site bereiken door de inhoud te controleren. Bij het tonen van de nieuwste artikelen van de blog, gebruik fragmenten in plaats van het laden van het hele artikel.

Als u een klassieke editor gebruikt, is het tonen van een aangepast fragment relatief eenvoudig:

nu, het tonen van het Uittreksel op uw homepage hangt af van uw thema. Het kan al zijn ingeschakeld of je kan hebben om de optie ergens in uw thema te controleren. Ik stel voor om de documentatie te controleren of contact op te nemen met ondersteuning omdat elk thema anders is.

als u de neiging hebt om lange artikelen te schrijven, kunt u ze snel in twee of meer delen splitsen. Als u een blok-editor gebruikt, hebt u geen externe plug-ins nodig. Bewerk gewoon een lange post, klik op het symbool” plus “en vind het blok” Pagina-einde ” dat uw artikel in tweeën splitst.

ten slotte, voor degenen die veel opmerkingen hebben, kunt u ervoor kiezen om opmerkingen te pagineren in plaats van ze allemaal tegelijk te laden:

blijf De snelheid van uw website

testen zelfs als u elke stap uit deze handleiding doet en uw website succesvol versnelt, betekent dat niet dat u klaar bent. Dingen kunnen snel veranderen, en je weet nooit hoe goed uw site zich morgen of in een maand zal gedragen. Daarom is het van cruciaal belang dat u regelmatig snelheidstests doet en uw site regelmatig verbetert.

u kunt een bladwijzer maken voor het geval u vergeet waar en hoe u uw site wilt testen, en om te onthouden welke stappen u moet doorlopen om het te versnellen.

hoe een trage website u kan kwetsen

zelfs als u het niet erg vindt om te wachten tot sites worden geladen, hebben de meeste mensen daar een probleem mee. En als je het probleem verwaarloost, kan het je op de lange termijn pijn doen. Hoe?

• hogere bounce rates-zelfs als uw bezoeker besluit te wachten tot een pagina wordt geladen, betekent dat niet dat ze geduldig zullen zijn gedurende hun hele bezoek. U riskeert hogere bounce rates die ervoor zorgt dat mensen uw site verlaten nadat ze de eerste pagina bezoeken.
• geld verliezen – als u producten of diensten op uw website verkoopt, zal een trage site potentiële kopers en toekomstige klanten afstoten.
• verkeer verliezen-wilt u meer verkeer dat uw site vooruitstuwt? In dat geval kunt u zich niet veroorloven om een bezoeker te verliezen omdat uw site niet goed is geoptimaliseerd.
• lagere SERP-ranking-Google en andere zoekmachines houden rekening met de laadsnelheid. Een langzamere pagina kan resulteren in wordt geduwd verder naar beneden de zoekmachine resultaten pagina, zelfs als uw inhoud is goed.

vindt snelheid nog steeds niet belangrijk? Ik hoop dat deze vier redenen zullen u overtuigen hoe de snelheid van een website is cruciaal, en dat je klaar bent om de jouwe beter te maken.

conclusie

iedereen houdt van mooie en goed ontworpen sites. Echter, als dat betekent wachten op een paar extra seconden voor de website te laden, is de kans groot dat u een bepaald percentage van de bezoekers te verliezen.

dus, wat u ook doet, geef geen snelheid op voor esthetiek. Het is mogelijk om beide te hebben; je hoeft alleen maar geduldig te zijn en te werken aan uw website om het te verbeteren.