Breng snelheid in je site voor gebruikers en zoekmachines

Het is een hot onderwerp: de snelheid van je site wordt steeds belangrijker. Bezoekers hebben snelle sites altijd al prettig gevonden en Google gaat het daarom nu ook meenemen in het bepalen van je ranking. Mede hierom ben ik eens flink bezig gegaan met het optimaliseren van mijn site. De genomen stappen en de resultaten wil ik graag met jullie delen.
Welk stappen heb ik genomen
Om de snelheid van het laden van mijn site te versnellen heb ik de software (Wordpress), de server, de broncode (HTML, CSS en Javascript), de plaatjes aangepakt. Elke verbetering heb ik vervolgens gemeten met de tools Google Page Speed en Yahoo! YSlow, beide weer aanvullingen op de populaire developers tool Firebug. Een hoop kleinere wijzigingen zal ik hier niet behandelen, maar de echte impact-makers zal ik zeker noemen.
Meer over: Breng snelheid in je site voor gebruikers en zoekmachines »
Voorbeelden veel gebruikte .htaccess regels
Een tijdje terug heb ik al eens over de kracht van reguliere expressies in Google Analytics filters geschreven. Maar naast het gebruik van reguliere expressies in GA kun je ze ook nog ergens anders gebruiken: in de .htaccess op je server.
Het .htaccess bestand staat vaak in de root van je server (bij Apache tenminste) en is bedoeld om een aantal instellingen van een folder aan te kunnen passen. Wanneer hij gebruikt wordt in de root kun je de instellingen van alle subfolders aanpassen. Veel van deze instellingen hebben te maken met het afhandelen van binnenkomend verkeer.
Ik wil hieronder een aantal voorbeelden plaatsen van .htaccess regels die veel gebruikt worden. En waarom: omdat ik ze niet uit mijn hoofd ken en ergens een plek wil hebben waar ik ze weg kan knippen en plakken ![]()
Voordat een aantal zaken gerewrite worden moeten eerst wat algemenere zaken aangepakt worden:
Uitgaande links simpel meten met Google Analytics
Soms kan het best handig zijn om te zien welke uitgaande links mensen volgen vanaf bepaalde pagina's. Voor de mensen die er mee bekend zijn: MyBlogLog kan het ook voor je doen, je ziet direct welke links populair zijn en welke niet. Standaard zit deze functionaliteit niet in Google Analytics, maar natuurlijk kan dat wel opgelost worden.
Om een link te kunnen meten zal er bij een klik een script aangeroepen moeten worden die de meting verricht. Dit kan middels een onclick event op de link:
<a href="http://www.voorbeeld.nl" onclick="pageTracker._trackPageview()"></a>
Meer over: Uitgaande links simpel meten met Google Analytics »
Google Analytics en 2 letter domeinen in IE
In de afgelopen periode leer ik steeds meer en meer over Google Analytics en de daarbij behorende tekortkomingen, mogelijkheden, enz. Ik kan mij inmiddels een redelijk gevorderde gebruiker en beheerder noemen, en vanuit dat perspectief kan ik ook zeggen dat ik goed tevreden ben over dit pakket.
Maar wat ik vandaag heb uitgevonden slaat naar mijn mening alles. Ik heb een website die uit 2 letters bestaat, we nemen hier als voorbeeld maar het bekende nu.nl. En Google Analytics (GA) doet het daar niet door Internet Explorer. Om de geschiedenis even langs te lopen zal ik alle genomen stappen toelichten en uitwerken.
DHTML AsTree
AsTree is een javascript tree zoals in de windows explorer waarmee op een simpele manier veel items in 1 menustructuur gegoten kunnen worden. Geinspireerd op een versie die ik ergens online gezien had maar die bij 2000 items veels te traag werd. Daarom ben ik zelf bezig gegaan om een snellere versie te ontwikkelen, en dit is het resultaat geworden.
Deze tree is momenteel de snelste die er op internet te downloaden is, ik heb er uitgebreid mee getest en nog geen snellere gevonden. Na diverse kleine tweaks heb ik de opbouw van 1000 nodes van 7130ms naar 5210ms naar 4670ms naar 3790ms gekregen. Die kleine tweaks waren onder andere het veranderen van de volgorde in if-statements, het de andere kant op laten lopen van for lussen en het vervangen van innerHTML door createTextNode (DOM).
Met of zonder www, vertel het aan Google
Je kunt een site onderhouden met of zonder www in het adres. De één vindt met www mooier en de ander zonder, maar functioneel gezien zit er geen verschil in zolang je maar consequent bij 1 versie blijft.
Zoekmachines kunnen aan de hand van je interne links en de externe inkomende links bepalen welke vorm zij gaan indexeren. Daarbij kan dus gebeuren als veel mensen www gebruiken in links naar je site toe dat zoekmachines de www versie gebruiken terwijl je zelf zonder www wilde. Ook kan het gebeuren dat zoekmachines beide versies gaan indexeren, dan kun je dus met een duplicate content probleem komen te zitten en zal je PageRank verdeeld worden over beide versies.
De mailto: zou verboden moeten worden
Een bekend fenomeen wat nog steeds geliefd is onder veel webbeheerders is het mailto: gebruik in links en formulieren. Nog steeds komen in het Webdesign, Markup & Clientside Scripting forum op Tweakers.net er vragen over. En al die keren zie ik het artikel over de Mythical Mailto: voor me, tijd voor een vertaling naar het Nederlands met een eigen touch.
Breadcrumbs, verplichte kost voor elke site
Het is een mooi sprookje wat bijna elke Nederlander wel kent: Hans en Grietje die broodkruimels achterlaten om de weg terug te kunnen vinden. Deze methode heeft zijn weg gevonden naar het internet en heeft er dezelfde naam gekregen als in het sprookje: breadcrumbs.
Breadcrumbs zijn dus bedoeld om de weg terug te kunnen vinden, maar hoe ziet dat er uit voor een website? De volgende situatie geeft een overzicht van een kleine website weer:

