7 manieren om uw website of blog sneller te laten laden voor bezoekers
Langzame laadsnelheid van de pagina is een van de belangrijkste redenen waarom uw website niet de hits krijgt die het verdient.
Omdat de aandacht van het publiek zich op een dieptepunt bevindt, volgen hier enkele tips om uw site te versnellen om ervoor te zorgen dat uw bezoekers blijven rondhangen.
1. Verlaag de werkelijke grootte van uw website
Als uw website langzamer dan drie seconden wordt geladen, verlaten mensen deze waarschijnlijk nog voordat de startpagina is geladen. Het gebruik van het verkeerde formaat voor uw afbeeldingen kan uw website gemakkelijk doen zweten en een anderszins geweldige surfervaring verpesten.
Meer dan 70% van de mobiele webpagina's is meer dan 1 MB en 12% is meer dan 4 MB! Houd er rekening mee dat dit duurt zeven seconden om 1,5 MB te downloaden op een goede 3G-verbinding. De beste werkwijze is om elke pagina onder 0,5 MB te houden.
Leer het verschil tussen JPG, PNG en GIF en zorg ervoor dat u de resolutie gebruikt die u nodig hebt.
Volgens GlobalStats zijn dit de meestgebruikte schermresoluties voor 2018:
- 22.55% gebruikt een resolutie van 360 x 640 (Mobiel)
- 11,73% gebruikt een resolutie van 1366 x 768
- 8.26% gebruikt een resolutie van 1920 x 1080
- 4,91% gebruikt een resolutie van 375 x 667 (Mobiel)
- 2,94% gebruikt een resolutie van 1440 x 900
Dit is meer dan 50% van alle gebruikers, dus overweeg dit wanneer u foto's aan uw website toevoegt.
2. Ontwerp uw website voor mobiel
Volgens onderzoek van Google vorig jaar op mobiele paginasnelheid:
De gemiddelde tijd die het kost om een mobiele bestemmingspagina volledig te laden, is 22 seconden, volgens een nieuwe analyse. Toch verlaat 53% van de mobiele sitebezoekers een pagina die langer dan drie seconden duurt om te laden. Dat is een groot probleem.
Meer dan 75% van mobiele sites kost 10 seconden of meer om via 3G te laden. Meer dan de helft van al het verkeer is via mobiele apparaten, en dit zal waarschijnlijk niet ten onder gaan. Houd dus een kleine voetafdruk van de website om mobiele internetgebruikers tevreden te houden en zorg ervoor dat ze blijven hangen!
Als u een CMS gebruikt zoals WordPress, Joomla of Drupal Drupal versus Wordpress: Wat is de beste open source-CMS? Drupal versus Wordpress: wat is de beste open-source CMS? Wilt u een website opzetten, maar kunt u niet het juiste open source CMS kiezen? U kunt als volgt kiezen tussen WordPress en Drupal. Meer lezen, er zijn plug-ins om uw website mobielvriendelijker te maken.
Als alternatief kunt u tools zoals bMobilized of Duda Mobile gebruiken om uw desktopwebsite naar mobiel te converteren. Dat gezegd hebbende, is het vaak het beste om een afzonderlijke website te ontwerpen om de beste ervaring voor uw mobiele gebruikers te garanderen.
U moet ook overwegen om een vereenvoudigde versie van uw website aan te bieden met behulp van het AMP-project (Accelerated Mobile Pages). Het gebruik van AMP-pagina's verbetert de laadsnelheid van de pagina op mobiel. Er zijn strikte richtlijnen voor JavaScript en CSS, maar de voordelen zijn meetbaar.
Welke route u ook kiest om naar beneden te gaan, zorg ervoor dat uw mobiele website een lichtgewicht optie is. Probeer onder de aanbeveling van 0,5 MB per pagina te blijven.
3. Zorg ervoor dat uw website is verkleind
Als u vanuit het niets uw eigen website schrijft, moet u deze regelmatig bijwerken. Naarmate uw project zich ontwikkelt, leert u waarschijnlijk efficiëntere manieren om dingen te doen, dus zorg ervoor dat u teruggaat naar uw code terwijl u verbetert.
Verklein en combineer uw CSS, HTML en JavaScript. Als u bijvoorbeeld een CDN zoals Cloudflare gebruikt, is er een specifiek tabblad voor snelheidsverbeteringen, waarbij de eerste optie Automatisch verkleinen is. Als u een website builder gebruikt (zoals Squarespace of Weebly), is dit waarschijnlijk standaard voor u gedaan.
Zorg ervoor dat u uw website test nadat u alles hebt ingeschakeld dat de bronnen van uw website combineert of verkleint. Experimenteer met de verschillende opties om te zien wat het beste is voor uw website, omdat sommige functies kunnen breken met Minify ingeschakeld.
4. Vermijd het laden van scripts wanneer dat niet nodig is
Als u meerdere JavaScript-bestanden moet laden voordat ze nodig zijn, wordt de snelheid van de hele pagina onnodig langzamer. Vermijd het laden van scripts van servers van derden als dat mogelijk is.
Het aanvragen van deze vertraagt uw laadsnelheid, verder en kan mogelijk een beveiligingsrisico vormen. Bewaar ze indien mogelijk op de server van uw website.
Je kunt gebruiken uitstellen of async om het laden van specifieke JavaScript-bestanden te vertragen om de druk op de apparaten van bezoekers te verminderen en de laadsnelheid van uw pagina's te verbeteren. Als alternatief kunt u voor kleine scripts in lijn JavaScript direct in het HTML-document.
Async zal de browser vertellen om door te gaan met het ontleden van de HTML op het moment dat de JavaScript-bestanden worden gedownload. De pauze zal dan plaatsvinden nadat het bestand volledig is gedownload.
Ondertussen laat uitstel de browser weten JavaScript-bestanden uit te voeren na de browser is klaar met het ontleden van het volledige HTML-document.
Een browser pauzeert standaard het parseren van HTML-bestanden terwijl JavaScript-bestanden worden opgehaald en uitgevoerd.
Het invoegen van JavaScript in het HTML-document zal helpen door het aantal bestanden dat een browser moet downloaden te verminderen voordat een pagina wordt weergegeven. U kunt JavaScript inline plaatsen door de inhoud van een extern JavaScript-bestand tussen scripttags toe te voegen.
U kunt veilig uitstel en async gebruiken op Google Analytics, Facebook Pixel en andere tools voor analyse en foutrapportage zonder de functionaliteit van de pagina te beïnvloeden..
Bepaal ten slotte of de trackingcodes, analyses, extra functies en advertenties die u op uw website uitvoert, noodzakelijk zijn. Gebruik indien mogelijk meer lichtgewichtopties en schrap ze als ze niets van waarde toevoegen aan u of uw bezoekers.
5. Gebruik Caching en een CDN
Een Content Delivery Network (CDN) kopieert uw site naar servers over de hele wereld en vermindert de reistijd van de gegevens door bezoekers te verbinden met een server die zich geografisch dichter bij hen bevindt. Statische inhoud wordt ook in de cache opgeslagen en wordt geleverd door de servers van CDN.
Cloudflare is waarschijnlijk het CDN dat u het beste kent, maar Akamai en Amazon CloudFront zijn gevestigde alternatieven.
Zorg ervoor dat u ook gebruikmaakt van browsercaching. Dit is hoe uw browser uw privacy schendt. Dit is hoe uw browser uw privacy schendt. Uw webbrowser onthult een hoop informatie over wie u bent, waar u heen gaat en wat u leuk vindt. Hier zijn de details die het lekt wanneer u online gaat. Lees meer om de laadsnelheid van uw website te verbeteren voor terugkerende bezoekers. Browser-caching werkt door deze bestanden van de server naar het apparaat van de gebruiker te downloaden.
Bij verdere paginaweergaven of bezoeken worden deze bestanden lokaal geladen vanaf het apparaat van de gebruiker in plaats van deze bij de externe server aan te vragen (afhankelijk van de vervaldatum van de bestanden).
6. Verwijder niet-essentiële plug-ins
Plug-ins mogen alleen worden gebruikt als dat nodig is. Dit is waar of je Wix, Weebly, WordPress of Squarespace Squarespace vs. Wordpress gebruikt: 7 verschillen die je misschien verrassen Squarespace versus Wordpress: 7 verschillen die je kunnen verbazen In de wereld van webhosting en het bouwen van sites, zijn maar een paar namen groter dan WordPress en Squarespace. Maar hoe bepaal je welke te gebruiken? Meer lezen of iets anders. Alle functies die u kunt doen door eenvoudige CSS toe te voegen in plaats van een plug-in, zou u moeten doen. Gebruik Code Injection op Squarespace, gebruik de CSS Customizer in WordPress en Custom CSS on Wix.
Plug-ins kunnen een hoge CPU- of geheugenbelasting op uw server veroorzaken en dit kan uw website vertragen of zelfs stoppen met laden.
Als u WordPress gebruikt, is het waarschijnlijk dat u niet alle ingebouwde functies gebruikt. Schakel deze uit met een plug-in zoals Clearfy.
Houd altijd rekening met de plug-ins die u gebruikt. Als u enkele functies in plug-ins zoals JetPack gebruikt, overweeg deze dan allemaal te verwijderen en vervang ze door meer lichtgewicht plug-ins die hetzelfde werk doen.
7. Serverinstellingen om uw website te versnellen
Serververtraging zal een grote negatieve invloed hebben op de laadsnelheid van uw pagina en uw PageRank.
Google beveelt aan dat de tijd tot de eerste byte (TTFB) 1,3 seconden of minder is. Dit is de langste vertraging voordat een apparaat begint met het downloaden van een pagina nadat hij voor het eerst contact heeft gemaakt met de server. Dat gezegd hebbende, heeft de gemiddelde pagina een TTFB van meer dan 2 seconden, ruim boven hun aanbeveling.
Gedeelde hosts zijn meestal de reden hiervoor, maar er zijn enkele instellingen die u kunt configureren om de reactietijd van uw server te verbeteren.
- Gebruik de nieuwste versie van PHP waarmee uw website compatibel is. De nieuwste versie (PHP 7.2) heeft enorme snelheidsverbeteringen.
- Schakel in “In leven houden”
- Schakel HTTP / 2 in
- Profiteer van HTTP Strict Transport Security (HSTS)
- Stel uw back-ups in om 's nachts te voltooien
Als uw website is gemaakt in WordPress, moet u een host gebruiken die is gespecialiseerd in WordPress hosting, zoals Bluehost. Dit zorgt ervoor dat de serverinstellingen specifiek zijn geconfigureerd voor WordPress-prestaties.
Klaar met tweaken? Test nu uw site
Nu u weet wat de ideale laadtijd, grootte en tijd tot de eerste byte (TTFB) van de pagina is waarnaar u moet streven, hoe weet u wat van u is??
Hier zijn enkele van onze favoriete online hulpmiddelen om uw site te testen:
- varvy.com: deze tools testen de snelheid en prestaties van je desktop en mobiele pagina en geven je waardevolle handleidingen voor het verbeteren van je website
- Google PageSpeed Insight: onlangs bijgewerkt, test de tool Google PageSpeed uw snelheid en geeft u suggesties voor verbetering
- GTmetrix: een geweldige tool met bruikbare adviezen
- WebPageTest: test uw website op verschillende apparaten, besturingssystemen en locaties
- Pingdom: een zeer populaire tool, vergelijkbaar met WebPageTest met een mooiere interface
U kunt uw mobiele site testen met de bovenstaande links en ook de ThinkWithGoogle Mobile-test (mogelijk gemaakt door WebPageTest). De resultaten zullen u specifieke tips geven over wat u kunt verbeteren, met een geschatte verlaging van de laadtijd als u de tips volgt.
De aanbevolen praktische tips veranderen voortdurend, dus houd regelmatig uw paginasnelheid bij terwijl u verbeteringen aanbrengt.
Als u nog waardevoller inzicht wilt krijgen in de manier waarop uw website presteert, moet u uw domein verifiëren op Google en Bing. De 5 belangrijkste voordelen van het verifiëren van uw domein op Google en Bing De 5 belangrijkste voordelen van het verifiëren van uw domein op Google en Bing Als u een eigen website heeft, moet u daarom uw domein op Google en Bing verifiëren met hun webmasterhulpprogramma's. Lees verder
Meer informatie over: Webontwikkeling.