Skip to content

SEO Tip III: Snellere laadtijd website

seo - Google Search_1283171600111

Een van de zaken die belangrijk zijn voor de algemene bereikbaarheid en zoekmachine optimalisatie van een website is de snelheid waarmee een pagina geladen kan worden. En dat is eigenlijk heel logisch. Als een website te traag laadt dan zijn bezoekers al weer vrij snel vertrokken. In dit blog zullen we een paar tips tonen hoe je je website sneller kan maken.

WP Minify

Door middel van WordPress minify kun je al je javascripts en css bestanden die je gebruikt op je website comprimeren en op de juiste plek plaatsen. Dit bevordert de laadtijd en zorgt ervoor dat de scripts op de meest efficiënte manier worden geladen zonder het spyderen door zoekmachines te onderbreken c.q. storen. Dit is dus een een van de methodes waarvoor je simpelweg en plugin kunt activeren om de vruchten van geminimaliseerde javascripst en css te ondervinden.

WP Super Cache

Plugin installeren en activeren. Met deze plugin wordt er cache van alle pagina’s opgebouwd zodat een bezoeker niet iedere keer  alle data hoeft op te vragen in de database. In plaats daarvan zal deze een staitische versie geserveerd krijgen die in de WP Super Cache map wordt opgeslagen. Je kunt zelf bepalen hoelang de cache bestanden blijven staan. Verder kun je ook bepalen dat alle Cache wordt vernieuwd zodra er een een nieuwe blog of pagina wordt aangemaakt.

Aanpassingen in de .htaccess

NB 1 Maak een backup van je .htaccess zodat deze teruggezet kan worden, mocht je een Error 500 krijgen!

NB 2 Zet al deze toevoegingen na de WP Super Cache gegenereerde code!

Er zijn een aantal wijzigingen die je in de .htaccess in de root kunt aanbrengen die de laadtijd van een website dramatisch kunnen verbeteren. Deze opties zijn alleen mogelijk als de desbetreffende modules aanwezig zijn.

Gzippen van de meeste bestanden

Alle Apache servers kunnen bestanden gecomprimeerd naar de bezoeker toesturen. Aangezien gecomprimeerde bestanden kleiner zijn dan de standaard bestanden kan de bezoeker zaken sneller bekijken en zal geneigd zijn langer op de site te blijven

Stap een: Controleer of uw server de Gzip Module of de Deflate Module gebruikt

De meeste Apache 2 servers gebruiken Deflate. Dit geldt ook voor Webreus waarmee Doede.net veel werkt. Controleer dit alsvolgt

  • Maak een map aan in de root met de naam mods
  • Maak daar in een .htaccess aan met deze content:
    SetEnv MOD_mod_deflate 0
    SetEnv MOD_mod_gzip 0
    SetEnv MOD_mod_headers 0
    SetEnv MOD_mod_expires 0
    <IfModule mod_deflate.c>
    SetEnv MOD_mod_deflate 1
    </IfModule>
    <IfModule mod_gzip.c>
    SetEnv MOD_mod_gzip 1
    </IfModule>
    <IfModule mod_headers.c>
    SetEnv MOD_mod_headers 1
    </IfModule>
    <IfModule mod_expires.c>
    SetEnv MOD_mod_expires 1
    </IfModule>
    
  • Maak een bestand index.shtml.txt aan in diezelfde map
  • Zet dit in de index
    <!--#printenv -->
  • Upload de map inclusief de .htaccess en index.shtml.txt naar server met je favoriete FTP programma
  • surf naar http://domain.nl/mods/index.shtml.txt
  • Als er een 1 staat achter gzip dan grebruikt de server Gzip, staat er een 1 achter deflate dan wordt deflate gebruikt

Na deze test weer de map mods verwijderen aangezien hackers deze data niet hoeven te weten.

Stap 2a: Aanzetten Deflate

Aangezien de meeste nieuwe servers Deflate gebruiken zetten we de volgende code in de .htaccess in de root:


# BEGIN Compression (DEFLATE)
<IfModule mod_deflate.c>
# Enable compression
AddOutputFilterByType DEFLATE text/css text/javascript application/x-javascript text/html text/plain text/xml image/x-icon
<IfModule mod_setenvif.c>
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
</IfModule>
<IfModule mod_headers.c>
# Make sure proxies deliver correct content
Header append Vary User-Agent env=!dont-vary
# Ensure proxies deliver compressed content correctly
Header append Vary Accept-Encoding
</IfModule>
</IfModule>
# END Compression (DEFLATE)

Stap 2b Aanzetten Gzip

Mocht uw webserver gebruik maken van Gzip dan moet de volgende code in de .htaccess gezet worden:


Gzip
RewriteEngine on
#Check to see if browser can accept gzip files. If so and we have it - serve it!
ReWriteCond %{HTTP:accept-encoding} gzip
RewriteCond %{HTTP_USER_AGENT} !Safari
#make sure there's no trailing .gz on the url
ReWriteCond %{REQUEST_FILENAME} !^.+\.gz$
#check to see if a .gz version of the file exists.
RewriteCond %{REQUEST_FILENAME}.gz -f
#All conditions met so add .gz to URL filename (invisibly)
RewriteRule ^(.+) $1.gz [QSA,L]

# If they accept gzip and there isn't one - make one
<IfModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_keep_workfiles No
mod_gzip_can_negotiate Yes
mod_gzip_add_header_count Yes
mod_gzip_send_vary Yes
mod_gzip_command_version '/mod_gzip_status'
mod_gzip_min_http 1000
mod_gzip_minimum_file_size 300
mod_gzip_maximum_file_size 512000
mod_gzip_maximum_inmem_size 60000
mod_gzip_handle_methods GET POST
mod_gzip_temp_dir /tmp
mod_gzip_item_include file \.html$
mod_gzip_item_include file \.php$
mod_gzip_item_include file \.pl$
mod_gzip_item_include file \.rb$
mod_gzip_item_include file \.py$
mod_gzip_item_include file \.cgi$
mod_gzip_item_include file \.css$
mod_gzip_item_include file \.js$
mod_gzip_item_include mime ^application/javascript$
mod_gzip_item_include mime ^application/x-javascript$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^httpd/unix-directory$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include handler ^server-status$
mod_gzip_item_include handler ^server-info$
mod_gzip_item_include handler ^application/x-httpd-php
mod_gzip_item_exclude mime ^image/.*
</IfModule>

Stap 3 Testen

Na deze aanpassingen Browser Cache loaden en de site testen met Yslow en als alles goed is gedaan zal er het volgende getoond worden:

Een A voor Gzipped, dus het werkt. Een andere manier om te testen of Gzip werkt is door de de site url op deze website in te vullen.

Werken met expire header

Om de browser (Internet Explorer, Firefox, enzovoorts) niet de hele tijd onnodig bepaalde bestanden te laten laden kun je in de .htaccess aangeven wanneer bepaalde bestanden verlopen. Voeg de volgende code toe:


# BEGIN Expire headers
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)(\.gz)?$">
Header set Expires "Thu, 15 Apr 2012 20:00:00 GMT"
Header unset ETag
FileETag None
</FilesMatch>
# END Expire headers

Deze code zorgt ervoor dat afbeeldingen, flash bestanden en favicons niet de hele tijd weer worden geladen. Ze zullen pas opnieuw worden geladen in 2012 of wanneer de browser cache geleegd is. Etags is uitgezet zodat het werken met standaard Cache goed werkt. Hierover zullen we een andere keer schrijven.

Bronnen

http://wordpress.stackexchange.com/questions/199/what-steps-can-i-take-to-optimize-wordpress-in-regard-to-server-load/340
Stack Exchange Voeg Verlopen header aan de website. Htaccess + Cache-control-headers

http://wordpress.org/extend/plugins/wp-minify/
Verkleinen JavaScript en CSS laadtijd door minification / compressie

http://zemalf.com/1076/blog-htaccess-rules/
Test om te zien of de website gzip of deflatie gebruikt d.m.v. met een bestand speciaal +. htaccess.

http://blog.aidentailor.net/2010/01/25/speeding-up-wordpress-with-mod_deflate/
Mod Deflate: code die je moet zetten in je .htaccess om je website te laten werken met Mod Deflate

http://devmoose.com/coding/20-htaccess-hacks-every-web-developer-should-know-about # highlighter_43890
Lijst met nuttige .htaccess trucs voor het optimaliseren en beveiligen van uw website met behulp van .htaccess.

http://icanhazdot.net/2010/03/23/some-wordpress-stuff/

http://wordpress.org/extend/plugins/wp-super-cache/
Link naar WP SuperCache

http://www.whatsmyip.org/http_compression/
Controleer of de site werkt met behulp van Deflate zippen of Gzip werkt

http://davidwalsh.name/yslow-htaccess
Verval headers met etags uitgeschakeld voor betere caching

Gepubliceerd door Jasper Frumau op maandag 30 augustus 2010

Van → SEO

2 Reacties
  1. Hierboven noem je eigenlijk alleen maar toevoegingen. Om een site, en vooral bij WordPress, echt snel te laten zijn moet je het zo minimalistisch houden.

    – Weining Plugins
    – Geen grote afbeelding op index
    – geen flash op je index
    – Geen widget die data van derden op haalt.
    – en probeer dingen die lange laadtijd nodig hebben onderaan de pagina te zetten

    Met mijn eigen site janhoek.com ben ik hierover een proef begonnen. Leuk project en zeker de moeite om te volgen

  2. Bedankt voor de reactie Jan. Je moet inderdaad nooit je site zwaarder maken dan nodig. Er zijn echter altijd afwegingen te maken t.a.v. de verschillende kanten aan de bezoekersvriendelijkheid van een website. Wil je bijvoorbeeld een Twitter api – widget die data haalt bij derden – gebruiken om Twitter activiteit te tonen en populariteit van een artikel te tonen aan bezoekers of het weglaten ervan om de website sneller te laten laden. Wat er in een bepaald geval het beste is verschilt van geval tot geval.
    Zal je website janhoek.com in de gaten houden ;-)

Laat een reactie achter

NB: XHTML is toegstaan. Je email adres wordt niet gepubliceerd.

Abonneer je op de reacties op dit artikel via RSS

*