Website sneller maken. Hoe doe je dat?

Waarom je website sneller maken

Snelheid is meer dan ooit belangrijk bij webdesign. Bezoekers en gebruikers zijn in 2016  inmiddels gewend aan pagina’s die snel laden. Wanneer jouw website daar niet in slaagt, dan zal die al snel weg geklikt worden. De gebruiker zal snel doorgaan naar de volgende website die wel super snel is. Het is nu eenmaal niet anders, mensen hebben geen tijd en geduld om te wachten tot jouw prachtige banner zich geladen heeft.

Webdesigners moeten dus niet alleen een website maken die leuk oogt, maar ook een website ontwerpen die snel is en snel reageert. Je klanten verwachten van jou dat je daar rekening mee houdt. Je zult je nu afvragen wat een snelle website is en of je zoiets kunt meten.

Afgaande op de gegevens uit verschillende onderzoeken kunnen we het volgende stellen:

• 47 % van de gebruikers willen dat een website binnen de twee seconden geladen is (bron: onderzoek Akamai);
• E-commerce shoppers vinden 2 seconden snel genoeg, maar Google streeft naar een laadtijd van minder dan een halve seconde (volgens Google Searchconsole);
• 57 % van de gebruikers haken af van een mobiele site wanneer die er langer dan drie seconde over doet om te laden (volgens een onderzoek van Mobify).

De conclusie is duidelijk: hoe sneller je website is, hoe beter. Snelheid wordt door gebruikers als positief ervaren. Daarom volgen nu enkele fantastische  ideeën waarmee je de sites van je klanten sneller kunt maken.

Houdt het ontwerp minimalistisch

Skip overbodige opsmuk en details. Het is logisch dat een “uitgeklede” website minder elementen zal bevatten die geladen moeten worden dan een volledig opgetuigde website. Hoe minder er geladen hoeft te worden, hoe sneller de site.

Als je dit van het begin af aan in gedachten houdt, kun je jezelf een hoop ellende besparen. Slim ontwerpen voorkomt dat er zaken of elementen tussen zitten die het laden van de site vertragen.

Ontwerpers moeten zich dus beperken tot de principes van het minimalisme zodat ze een soort “lightversie” van een website te krijgen waarbij je supersnel van de ene pagina naar de andere kunt hoppen.

Minimalistische eigenschappen zijn bijvoorbeeld:

• Een hamburger menu in plaats van de standaard navigatiebalk
• Meer witte of negatieve ruimte
• Korte web formulieren
• Kleinere afbeeldingen
• Slechts één font gebruiken in plaats van meerdere verschillende fonts types op je website

Wikipedia is een goed voorbeeld van deze uitgeklede benadering van webdesign. Wanneer je op de homepagina je zoekterm in vult, bijvoorbeeld “tijger”, duurt het minder dan een seconde om op de betreffende Tijger-Wikipedia pagina te komen. Wanneer je naar de Alexa toolbar extension kijkt, kun je controleren dat dat inderdaad zo is!

 

Laat het lijken alsof je website snel is

Zelfs bij webdesign, is er geen verschil tussen perceptie en werkelijkheid. Dit betekent dat wanneer mensen een bepaald ontwerp als zeer bruikbaar ervaren, zo’n website niet immens snel hoeft te zijn om dezelfde gebruikers tevredenheid op te leveren of een waargenomen, uitmuntende UX te scoren.

Hoewel het erg belangrijk is om een snelle website te hebben, kun je de gebruikers dus enigszins om de tuin leiden door ze het idee te geven dat de website snel is. En wanneer de website snel lijkt, zijn je gebruikers er meestal wel content mee.

Luke Wroblewski heeft in een video uitgelegd hoe dat werkt. Hij geeft aan dat snelheid een kritische factor is van de gebruikerservaring. In plaats van gecompliceerde technische oplossingen te gebruiken om de responsetijd van de site te verbeteren, kunnen we met het juiste ontwerp van de website, ervoor zorgen dat het lijkt alsof de prestaties beter worden en daarmee de interface sneller laten lijken.

Schakel Google in voor hulp

Google wil dat jouw website sneller wordt. Want daarmee wordt het internet sneller. En dat is wat Google beloofde bij het uitbrengen van de compressie technologie genaamd Brotli, vorig jaar. Dus waarom zou je geen gebruik maken van de geweldige tools die Google jou kan bieden als webdesigner?

De beste plek om te beginnen is Google Developers eigen “maak het web sneller” pagina. Hier vind je een uitgebreid assortiment van tools waarmee je jouw webdesign kunt versnellen.

Eén van de beste tools die Google aanbiedt is Pagespeed Insights (inzichten in pagina snelheid). Deze tool laat zien hoe het komt dat je website traag is. Het geeft je gedetailleerd inzicht krijgt in de oorzaken. Het mooiste van deze tool is dat je gedetailleerde verslagen en aanbevelingen kunt krijgen voor zowel mobiele als desktop versies van jouw site. Oftewel, vanaf nu heb je geen enkel excuus meer om met een trage website aan te komen bij je klanten.

Hoe werkt Pagespeed Insights?
Nadat je de URL van je website hebt ingevuld, krijg je een lijst met zaken te zien die je moet aanpakken om de snelheid en de gebruikerservaring van je website te verbeteren.

Op mijn website bijvoorbeeld, zien we een 80/100 score bij de snelheid, wat goed is, maar overduidelijk niet geweldig. Onder deze score zien we een heleboel aanbevelingen over wat ik zou moeten doen om mijn website veel sneller te maken zodat ik dichter bij de 100/100 score kom. Ondanks de snelheidsscore, blijkt de mobiele site toch een bijna perfecte eindscore te hebben, waarmee maar gezegd is dat snelheid niet de enige bepalende factor is bij het vast stellen van de mobiele UX. Hierbij scoort mijn website namelijk 99/100. Niet slecht 🙂

Wanneer we vervolgens klikken op het tabje “desktop”, dan zien we een aanzienlijk betere snelheidsscore van 82/100. Ook hier gevolgd door een lijst met aanbevelingen om de snelheid op te krikken.

Het mag duidelijk zijn dat hoe meer van die aanbevelingen je opvolgt en implementeert, hoe sneller de website van je klant wordt.

Wordt lui met laden

Heb je ooit wel eens gehoord van “lazy loading” ofwel “lui laden”? Het gaat om een ontwerppatroon dat objecten pas laat laden wanneer ze daadwerkelijk nodig zijn. Bijvoorbeeld dat objecten onder de vouw pas geladen worden wanneer gebruikers inderdaad naar beneden scrollen. Deze “alleen- wanneer-nodig” ontwerp benadering zorgt ervoor dat je website minder bronnen hoeft te gebruiken waardoor de prestaties verbeteren.

Dus: wanneer je pagina veel content heeft en het dus noodzakelijk is dat gebruikers veel scrollen, dan is lazy loading natuurlijk uitermate effectief. Wanneer je een lange scrol- pagina ontwerpt, gebruik dan altijd lazy loading omdat het de snelheid en de gebruikerservaring sterk verbetert.

Webcare4all is gespecialiseerd in het maken van websites voor bedrijven die online meer klanten en omzet willen genereren. Bel ons eens op of stuur een berichtje. Wij komen graag eens ‘sparren’ over hoe we je website voor JOU kunnen laten werken.