Welke cache headers kan ik gebruiken voor optimalisatie van de laadtijd?

Veel mensen zijn in de veronderstelling dat slechts de snelheid van de hosting relevant is voor de laadtijd van hun site, maar niets is minder waar! Een groot deel van je laadtijd wordt bepaald door hoe goed je website geoptimaliseerd is.

Je kunt voor requests naar jouw site headers meesturen, die helpen bij deze optimalisatie, waarmee je dus jouw laadtijd omlaag kunt halen. We leggen in deze handleiding uit hoe je dit precies doet!

• Ga naar je .htaccess bestand
• Voeg de caching headers toe
• Sla de wijzigingen op en klaar!

Ga in DirectAdmin naar de File Manager toe.

Hier ga je naar domains > voorbeeld.nl > public_html om bij de bestanden van je site te komen. Hier staat in de meeste gevallen al het bestand .htaccess tussen. Als deze erbij staat, druk je naast het bestand op Edit om deze aan te passen.

Mocht je nog geen .htaccess bestand hebben, dan kan je deze onderaan nieuw aanmaken.

Typ naast “Create New File” de naam: .htaccess Druk hierna op Create.

De headers plaatsen we onderaan in de .htaccess, omdat deze anders voor problemen kunnen zorgen. De regels die we gaan toevoegen zijn de volgende:

# START GZIP COMPRESSION <ifModule mod_gzip.c>     mod_gzip_on Yes     mod_gzip_dechunk Yes     mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$     mod_gzip_item_include handler ^cgi-script$     mod_gzip_item_include mime ^text/.*     mod_gzip_item_include mime ^application/x-javascript.*     mod_gzip_item_exclude mime ^image/.*     mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.* </ifModule> # END GZIP COMPRESSION # START DEFLATE COMPRESSION     AddOutputFilterByType DEFLATE "application/atom+xml" \     "application/javascript" \     "application/json" \     "application/ld+json" \     "application/manifest+json" \     "application/rdf+xml" \     "application/rss+xml" \     "application/schema+json" \     "application/vnd.geo+json" \     "application/vnd.ms-fontobject" \     "application/x-font" \     "application/x-font-opentype" \     "application/x-font-otf" \     "application/x-font-truetype" \     "application/x-font-ttf" \     "application/x-javascript" \     "application/x-web-app-manifest+json" \     "application/xhtml+xml" \     "application/xml" \     "font/eot" \     "font/otf" \     "font/ttf" \     "font/opentype" \     "image/bmp" \     "image/svg+xml" \     "image/vnd.microsoft.icon" \     "image/x-icon" \     "text/cache-manifest" \     "text/css" \     "text/html" \     "text/javascript" \     "text/plain" \     "text/vcard" \     "text/vnd.rim.location.xloc" \     "text/vtt" \     "text/x-component" \     "text/x-cross-domain-policy" \     "text/xml"     AddOutputFilterByType DEFLATE application/javascript     AddOutputFilterByType DEFLATE application/rss+xml     AddOutputFilterByType DEFLATE application/vnd.ms-fontobject     AddOutputFilterByType DEFLATE application/x-font     AddOutputFilterByType DEFLATE application/x-font-opentype     AddOutputFilterByType DEFLATE application/x-font-otf     AddOutputFilterByType DEFLATE application/x-font-truetype     AddOutputFilterByType DEFLATE application/x-font-ttf     AddOutputFilterByType DEFLATE application/x-javascript     AddOutputFilterByType DEFLATE application/xhtml+xml     AddOutputFilterByType DEFLATE application/xml     AddOutputFilterByType DEFLATE font/opentype     AddOutputFilterByType DEFLATE font/otf     AddOutputFilterByType DEFLATE font/ttf     AddOutputFilterByType DEFLATE image/svg+xml     AddOutputFilterByType DEFLATE image/x-icon     AddOutputFilterByType DEFLATE text/css     AddOutputFilterByType DEFLATE text/html     AddOutputFilterByType DEFLATE text/javascript     AddOutputFilterByType DEFLATE text/plain     AddOutputFilterByType DEFLATE text/xml # END DEFLATE COMPRESSION # START ENABLE KEEP ALIVE     Header set Connection keep-alive # END ENABLE KEEP ALIVE # START EXPIRES CACHING #     ExpiresActive On     ExpiresByType text/css "access 1 month"     ExpiresByType text/html "access 1 month"     ExpiresByType image/gif "access 1 year"     ExpiresByType image/png "access 1 year"     ExpiresByType image/jpg "access 1 year"     ExpiresByType image/jpeg "access 1 year"     ExpiresByType image/x-icon "access 1 year"     ExpiresByType image/svg+xml "access plus 1 month"     ExpiresByType audio/ogg "access plus 1 year"     ExpiresByType video/mp4 "access plus 1 year"     ExpiresByType video/ogg "access plus 1 year"     ExpiresByType video/webm "access plus 1 year"     ExpiresByType application/atom+xml "access plus 1 hour"     ExpiresByType application/rss+xml "access plus 1 hour"     ExpiresByType application/pdf "access 1 month"     ExpiresByType application/javascript "access 1 month"     ExpiresByType text/x-javascript "access 1 month"     ExpiresByType text/x-component "access plus 1 month"     ExpiresByType application/x-shockwave-flash "access 1 month"     ExpiresByType font/opentype "access plus 1 month"     ExpiresByType application/vnd.ms-fontobject "access plus 1 month"     ExpiresByType application/x-font-ttf "access plus 1 month"     ExpiresByType application/font-woff "access plus 1 month"     ExpiresByType application/font-woff2 "access plus 1 month"     ExpiresDefault "access 1 month" # END EXPIRES CACHING # # BEGIN Cache-Control Headers         Header set Cache-Control "public"         Header set Cache-Control "public"         Header set Cache-Control "private"         Header set Cache-Control "private, must-revalidate" # END Cache-Control Headers  Je kunt deze regels gewoon 1 op 1 overnemen uit bovenstaande voorbeeld in jouw .htaccess.

Dit werkt als het goed is voor iedere website!

Vervolgens hoef je alleen nog maar de wijzigingen op te slaan.

Druk op de knop “Save As” om de wijzigingen op te slaan. Nu ben je klaar!

Je hebt nu de headers van je site geoptimaliseerd voor een snellere website!