Snelheidsoptimalisatie is net zo belangrijk als een beter UI- en UX-ontwerp en een algeheel esthetisch gevoel in termen van webdesign. Uw website kan waardeloos zijn als het voor uw beoogde bezoekers een eeuwigheid zou duren om zelfs alleen uw startpagina te laden. Net als bij elk ander probleem zijn er echter altijd oplossingen.
In deze tutorial kun je zoiets bereiken:
01.
Verwijder inactieve plug-ins en thema’s
Laten we beginnen met iets relatief eenvoudigs. We beginnen met het verwijderen van ongebruikte plug-ins en thema’s. Zelfs als ze gedeactiveerd en inactief zijn, verbruiken ze nog steeds opslagruimte op uw server. Het verminderen van de werklast van uw server zou dus de eerste stap moeten zijn om de laadsnelheid van de pagina te verhogen.
U kunt P3 Profiler gebruiken om te controleren welke actieve plug-ins uw site ook belasten, zodat u kunt controleren en eventueel kunt overschakelen naar alternatieven die veel beter zijn geoptimaliseerd.
02.
Maak alle prullenbak leeg
Vervolgens controleert u elke prullenbak.
Wat ik bedoel met elke prullenbak is letterlijk hoe het klinkt. Eerst controleer je het Cpanel van je site of zoiets en controleer je of er bestanden in de prullenbak staan. Als dat het geval is, verwijder ze dan permanent. Je verwijdert ze niet als je ze nodig hebt, toch?
Ten tweede controleert u op weggegooide pagina’s en berichten. Verwijder ze ook. Zoals ik al zei, ze mogen in de eerste plaats niet in de prullenbak terechtkomen als ze belangrijk zijn.
We willen het opslagverbruik van de server zo minimaal mogelijk maken.
U kunt deze stap upgraden door de wpconfig.php van uw Elementor-website te wijzigen, zodat u dit niet elke keer, op elke pagina, bij elk bericht hoeft te doen.
Standaard bewaart WordPress de prullenbak voor minimaal 30 dagen. Zullen we het in plaats daarvan terugbrengen tot zeven dagen?
definiëren ('EMPTY_TRASH_DAYS', 7);
Of als u volledig begrijpt dat prullenbak prullenbak is, schakelt u het prullenbaksysteem volledig uit:
definiëren ('EMPTY_TRASH_DAYS', 0);
03.
Schakel Gzip-compressie in
Dit is waar het een beetje lastig wordt; code is nu betrokken.
In het informatietijdperk en de opkomst van internet, waar opslag overal belangrijk is, is compressie onze heer en redder. Hetzelfde geldt voor het optimaliseren van uw Elementor-website. Gzip is een functie waarmee u de totale grootte van uw website met gemiddeld 70% kunt verkleinen, wat betekent dat u ook de laadsnelheid van uw grootte met 70% kunt verminderen. Gelukkig is het activeren van gzip-compressie (als je dat nog niet hebt gedaan) vrij eenvoudig. U schakelt gzip-compressie in door simpelweg uw .htaccess- bestand te wijzigen:
<IfModule mod_deflate.c> # Comprimeer HTML, CSS, JavaScript, tekst, XML en lettertypen AddOutputFilterByType DEFLATE applicatie / javascript AddOutputFilterByType DEFLATE applicatie / rss + xml AddOutputFilterByType DEFLATE applicatie / vnd.ms-fontobject AddOutputFilterByType DEFLATE-toepassing / x-font AddOutputFilterByType DEFLATE-toepassing / x-font-opentype AddOutputFilterByType DEFLATE-applicatie / x-font-otf AddOutputFilterByType DEFLATE-toepassing / x-font-truetype AddOutputFilterByType DEFLATE-applicatie / x-font-ttf AddOutputFilterByType DEFLATE-toepassing / x-javascript AddOutputFilterByType DEFLATE-toepassing / xhtml + xml AddOutputFilterByType DEFLATE applicatie / xml AddOutputFilterByType DEFLATE font / opentype AddOutputFilterByType DEFLATE font / otf AddOutputFilterByType DEFLATE font / ttf AddOutputFilterByType DEFLATE afbeelding / svg + xml AddOutputFilterByType DEFLATE afbeelding / x-icon AddOutputFilterByType DEFLATE text / css AddOutputFilterByType DEFLATE text / html AddOutputFilterByType DEFLATE tekst / javascript AddOutputFilterByType DEFLATE text / plain AddOutputFilterByType DEFLATE text / xml # Verwijder browserbugs (alleen nodig voor echt oude browsers) BrowserMatch ^ Mozilla / 4 gzip-only-text / html BrowserMatch ^ Mozilla / 4 \ .0 [678] no-gzip BrowserMatch \ bMSIE! No-gzip! Gzip-only-text / html Koptekst toevoegen Vary User-Agent </IfModule>
04.
Profiteer van caching
Dit is waar het echt ingewikkeld wordt.
Aangezien de kans groot is dat we de grootte van uw website al met 70% hebben verkleind, laten we deze niet verder verkleinen door uw website niet telkens te hoeven laden wanneer de gebruiker deze opent.
Hoe? Natuurlijk door middel van “caching”.
Als u het nog niet weet, is caching wanneer de browser of een netwerk automatisch de zware bestanden van de site op uw website opslaat, zodat u ze niet opnieuw hoeft te downloaden voor het geval u terugkomt.
Het scheelt een hoop tijd!
Er zijn veel manieren om dit te doen.
De eerste is het inschakelen van browsercaching. U kunt dit doen door uw .htaccess- bestand aan te passen en dit codefragment toe te voegen:
## VERVALT CACHING ## <IfModule mod_expires.c> Verloopt actief op ExpiresByType afbeelding / jpg "toegang 1 jaar" ExpiresByType image / jpeg "access 1 year" ExpiresByType afbeelding / gif "toegang 1 jaar" ExpiresByType afbeelding / png "toegang 1 jaar" ExpiresByType text / css "toegang 1 maand" ExpiresByType text / html "toegang 1 maand" ExpiresByType-applicatie / pdf "toegang 1 maand" ExpiresByType text / x-javascript "toegang 1 maand" ExpiresByType-applicatie / x-shockwave-flash "toegang 1 maand" ExpiresByType image / x-icon "access 1 year" Verloopt standaard 'toegang 1 maand' </IfModule> ## VERVALT CACHING ##
Wat de bovenstaande code doet, zou al duidelijk moeten zijn.
Ten tweede is het installeren van een WordPress cache-plug-in. Als u een webontwikkelaar bent, is dit een taak van 10 seconden. Zo niet, dan is dit een taak van 1 minuut. In beide gevallen redelijk eenvoudig.
Aan de premium kant kunnen we de WordPress caching-plug-in WP Rocket aanbevelen voor de volgende functies:
- Eenvoudige, snelle en intuïtieve installatie.
- Paginacaching wordt onmiddellijk geactiveerd.
- Google Fonts Optimization minimaliseert HTTP-verzoeken.
- JavaScript-bestanden worden uitgesteld totdat de pagina wordt weergegeven.
- Integreert naadloos met Cloudflare.
Aan de gratis kant raden we W3 Total Cache aan, niet alleen omdat het gratis is, maar voordat we WP Rocket ontdekten, gebruikten we W3 Total Cache ongeveer acht maanden.
En ten derde is het gebruik van een Content Delivery Network of CDN zoals Cloudflare.
Niet alleen dat het uw site 10 keer versnelt, maar het beschermt uw website (s) ook tegen DDoS-aanvallen, sessiefixatie en andere vormen van brute-force website-hacking-penetratie.
05.
Verklein, comprimeer en optimaliseer
Voorkomen is de beste remedie.
Zoals door ziek te worden, ja, sommige ziekten kun je genezen, maar zou het niet beter zijn als je ze niet eens had? Het zou u tijd, geld en moeite hebben bespaard die u net zo goed aan andere productieve dingen had kunnen besteden.
Een ding is het optimaliseren van uw mediabestanden voordat u ze uploadt naar uw website. Er zijn alleen compressietools voor afbeeldingen zoals Tiny PNG die de grootte van uw afbeeldingen in JPG- of PNG-indeling met 50% tot 90% kunnen verkleinen zonder de kwaliteit te verminderen. Het lijkt magie.
Als je echter geen zin hebt om dit elke keer te moeten doen alsof je elke dag blogposts maakt, kun je de Tiny PNG-plug-in gebruiken. Het is niet gratis, maar u krijgt wat u betaalt!
Behalve het comprimeren van afbeeldingen, kunt u ook de javascript- en CSS-bestanden van uw site optimaliseren, comprimeren en “verkleinen”.
De meeste WordPress caching-plug-ins hebben ze al, dus daar zou geen probleem mee moeten zijn. CSS-verkleining werkt in principe als volgt: Laten we zeggen dat dit uw CSS is:
#rood { lettergrootte: 1em; kleur rood; }
Nu, nadat het is verkleind, ziet het er als volgt uit:
#red {font-size: 1em; color: red;}
Ja, het vermindert in feite gewoon die ruimte en nieuwe regels. Als u echter een hoop CSS op uw site heeft, zou het veel tellen. 10% tot 20% extra verkleining van de bestandsgrootte is niet slecht.
Naast het legen van uw prullenbak, wilt u misschien ook de opslag van revisies op uw site uitschakelen of verminderen, vooral op pagina’s en berichten die veel worden gewijzigd.
Stel je voor: stel dat je een blogpagina hebt met 5000 woorden. Dat is al 10kB. Dus, wat als u ongeveer 20 revisies van die pagina heeft? Je 10 KB wordt 20 keer opgeblazen tot 2 MB. Kijk hoeveel ruimte u kunt besparen. En dat is gewoon tekst, wat voor afbeeldingen?
U optimaliseert uw site om het meest optimale aantal revisies te hebben door het bestand wpconfig.php opnieuw te wijzigen:
definiëren ('WP_POST_REVISIONS', 3);
Of als u wilt, kunt u het revisiesysteem helemaal uitschakelen. Houd er echter rekening mee dat het revisiesysteem, ondanks de optimalisatie-implicaties ervan, soms nuttig kan zijn.
define ('WP_POST_REVISIONS', false);
06.
Beste webhosting
De bovenstaande stappen en tips lijken misschien achterhaald als de oorzaak van uw optimalisatie- en paginasnelheidsproblemen van uw server en hostingprovider zelf komt. Daarom moet je ervoor zorgen dat je het juiste hostingplan hebt gekozen. Een aanbevolen hosting zou de beste mogelijkheid moeten hebben om HTTP-verzoeken en MySQL-commando’s in zo min mogelijk tijd te verwerken.
U kunt proberen op internet te zoeken naar aanbevolen hosting. Maar hier bij Elementor Resources hebben we SiteGround aanbevolen . Lees waarom op onze post Waarom we SiteGround aanbevelen .
07.
Snelste WordPress-thema
Het kiezen van het beste Elementor-thema klinkt misschien eenvoudig, maar wetende hoeveel WordPress-thema er bestaat, kan deze taak je meteen hoofdpijn bezorgen. Veel WordPress-thema’s zouden beweren dat ze het snelste, lichtste en gewoon het beste WordPress-thema zijn. Maar je kunt het nooit echt weten, tenzij je ze echt probeert.
We besparen dus gewoon tijd en geven u een lijst met Elementor-thema’s die deze website aanzienlijk lichter en sneller maken door deze simpelweg te gebruiken:
0 Comments