De website heeft een professioneel en industrieel design dat is gericht op de maritieme sector. De hoofdpagina toont een bedrijfsfilm met de tekst “The power of teamwork” wat goed weergeeft wat Remat doet en voor staat.
Klanten en projectreferenties worden ook prominent uitgelicht, wat de ervaring en betrouwbaarheid van het bedrijf onderstreept. De navigatie is subtiel en responsief, geoptimaliseerd voor verschillende apparaten. De site gebruikt een kleurenschema van voornamelijk blauwtinten en wit, met eigen custom achtergrond wat consistentie, eigenheid en frisheid uitstraalt. Het geheel past goed bij de maritieme branche waarin Remat actief is. De website is volledig tweetalig opgezet.
Voor deze webshop is er veel aandacht besteed aan de vormgeving en het gebruikersgemak. Snel je het goede product vinden is waar de focus op ligt en kan hier door 2 verschillende zoek manieren. De standaard zoek methode en een custom made zoek filter. Op die manier vind je altijd snel het product dat je nodig hebt.
Deze semi-custom made website is geoptimaliseerd voor een snelle laadtijd en mobiele weergaven.
Speed is what we need! Deze populaire uitspraak dekt eigenlijk wel de lading. Snel of nog sneller graag. Niemand vind wachten fijn. Websites die 5 seconden of meer tijd nodig hebben om de content te laten zien is niet wat bezoekers willen. Het is op een mobiele telefoon veel moeilijker om je website snel te laden dan op een desktop.
Page speed, de laadsnelheid van een website of webshop is belangrijk. Het wordt eigenlijk steeds belangrijker. Resultaten op de mobiel zijn leidend voor je scores. Google gaat mede hierop je ranking in de zoekmachine bepalen. Dus als je website traag is geeft dit een negative ervaring voor de bezoeker.
Dit is ook een van de redenen waarom mijn website recentelijk geheel is vernieuwd met de nieuwste technieken. Ik wil laten zien dat de manier hoe een website is gebouwd een groot verschil kan maken. Mijn website gaan we gebruiken als case om je de verschillen te laten zien.
Het probleem
De grootste tekortkoming van mijn oude website was de laadsnelheid op mobiele telefoons . Het kon wel tot 5 seconden duren voordat alle content was ingeladen en zichtbaar was voor de bezoeker. Dat willen we natuurlijk niet. Het belangrijkste is dat een bezoeker binnen 1 seconde beeld heeft.
Meten is weten
Met erkende meettools wil ik laten zien wat de verschillen zijn tussen mijn oude en mijn nieuwe website. Hiervoor zijn verschillende meet momenten gebruikt om een zo betrouwbaar mogelijk beeld te krijgen. De Meet tool van Google pagespeed werkt met een scores. 100 is de maximale score. Mijn oude website heeft voor mobiel een score van 27.
Voor de nieuwe website is de score mobiel 91. Een duidelijk verschil dus.
Waar komt het verschil vandaan?
De oude website was gebouwd met een template. Wat is een template? Een template kun je vergelijken met een kant en klaar huis dat voor zoveel mensen ‘passend’ is gemaakt. Het nadeel van dit kant en klare huis is dat het tegelijkertijd veel ingebouwde ballast heeft die je nooit allemaal nodig hebt. Daardoor wordt de website onnodig zwaar belast wat als effect heeft dat de website traag wordt.
Voor de nieuwe site ben ik begonnen met een blanco framewerk, een kaal casco huis, om in de ‘huis’ termen te blijven. Vanuit dit framewerk wordt de website opgebouwd met alleen de functionaliteiten en wensen die nodig zijn. Een custom made website is dus te vergelijken met een maatwerk huis zoals jij dat wenst.
Deze manier van bouwen geeft voordelen
Verschillende factoren bepalen de score
Laten we wat dieper op de scores ingaan. Die scores zijn gebaseerd op verschillende factoren.
Met onderstaande meetresulaten uit Pingdon wil ik in onderstaand voorbeeld waarde 2 en 4 uitlichten. De 2e waarde geeft de pagina grootte aan en de 4e waarde het aantal script opvragingen.
OUD. Resultaten voor de oude site.
NIEUW. Resultaten voor de nieuwe site.
Bij waarde 2 zie je duidelijk dat de nieuwe site een stuk lichter is geworden. De pagina grootte is afgenomen van 2.6 MB naar 1.8 MB. Dat is dus een deel van ballast die is verminderd. Bij waarde 4 is te zien dat het aantal requests is afgenomen en zelfs is gehalveerd. (requests zijn opvragingen die ook vertragend werken) Dit wil je ook zo laag mogelijk houden.
De manier van je “huis” bouwen is dus uiterst belangrijk voor de snelheid van je website. De score op de mobiel is verbetert van 27 naar 91 op een score schaal van 100. Dit resulteert in een snellere manier van laden, hogere ranking in de Google zoekmachine en niet te vergeten een blije bezoeker.
André den Breejen
Wil je weten wat Impress voor jouw website kan betekenen of wil je meer weten over laadsnelheid verbetering?
Dit zijn een aantal kernwoorden die in het ontwerp terug moeten komen. Een maatwerk website waarbij gebruik is gemaakt van professionele fotografie. Er is veel aandacht besteed aan de vormgeving en het gebruikersgemak.
Deze custom made website is verder geoptimaliseerd voor een snelle laadtijd en een perfecte mobiele weergave.
Dat kan met deze custom made website voor schoonheidssalon Beauty Natural. Een maatwerk website waarbij gebruik is gemaakt van professionele fotografie. Er is veel aandacht besteed aan de vormgeving en het gebruikersgemak voor een optimale ‘look and feel. Volledig responsive voor alle schermen.
Heb jij al een website voor je schoonheidssalon die voor je werkt? Want jouw klanten zoeken je online! Je website moet dus snel vindbaar zijn in Google. Daarbij moet de 1e indruk kloppen. Hoe beter de ‘look en feel’, hoe meer kans op een nieuwe klant aanvraag.
Tijd dus voor een professionele website en meer aanvragen.
Schoonheidssalon website laten maken
Als je je afvraagt hoe je een website voor een schoonheids – of beautysalon kunt laten maken die de aandacht van jouw potentiële klanten zal trekken, ben je op de juiste plek.
Je kunt de websites altijd makkelijk zelf beheren. Je kunt ook alles door laten verzorgen. Zo kun jij je blijven focussen op jouw business.
Makkelijk en super snel online je auto reserveren. Redesign en vernieuwen van bestaande website. Emigreren naar nieuwe domein naam. Responsive wordpress website met gebruiksvriendelijk content management systeem (CMS) en gebouwd met de nieuwste technieken..
Custom made webshop gebouwd met Woocommerce. De oude Magento webshop is vervangen door een Woocommerce webshop. Maatwerk design voor de homepagina, categorieën en productpagina’s. Volledig responsive voor alle schermen. Complete product import van Magento naar Woocommerce.
De standaard Woocommerce mogelijkheden zijn nog verder uitgebreid. Zo zijn er nu uitgebreide offerte mogelijkheden vanuit de back end, is er een Mega menu met Ads per categorie, custom made categorie banners en zeer flexibele maatwerk Up sells bundels. Zelf volledige controle over producten, instellen van diensten , bulk-import en categorieën.
De webshop draait op een razendsnelle dedicated webserver voor de ideale gebruikerservaring.
Alweer een mooi project mogen afronden. Vorige week is de nieuwe website van De Visser Optiek live gegaan. De vormgeving van deze homepage maakt dat deze website zich onderscheidt en tegelijk een grote herkenbaarheid bewerkstelligd. Met een uitgekiende navigatie is het voor de bezoekers zo makkelijk mogelijk gemaakt om de benodigde informatie te vinden. Deze website is verder geoptimaliseerd voor een snelle laadtijd en een perfecte mobiele weergave.
De term pagespeed optimalisatie zie je steeds vaker voorbij komen en dat is niet voor niets. Met de term Pagespeed wordt bedoelt; hoe lang duurt het voordat de website in zijn geheel getoond wordt aan de bezoeker.
Vind jij het fijn om lang te wachten bij de slager? Nee, natuurlijk niet. En net zo min vindt je bezoeker het fijn om lang te moeten wachten tot jouw website of webshop op zijn of haar scherm verschijnt.
Als je thuis of op je werk over een snelle internetverbinding beschikt (bijvoorbeeld 100MB) kan het op het eerste gezicht nog wel meevallen met de laadtijd van je website. Bezoek je deze website dan via een gemiddeld wifi netwerk of via het mobiele netwerk dan merk je dat het allemaal een stuk minder snel gaat.
Nu wordt pas goed duidelijk of je website op een snelle server is gehost, of er bijvoorbeeld afbeeldingen zijn optimaliseert en of er compressie technieken zijn toegepast. Kortom, staat de meter in groen of in het rood?
Pagina wachttijd.
Hoe snel moet je website dan zijn? Dat hangt af van de situatie en het geduld van die persoon. Zelf ben ik aardig ongeduldig en heb een tijdspanne van 4 á 5 seconden maximaal. In 2011 heeft onderzoek uitgewezen dat bezoekers binnen 10 seconden beslissen of ze op de site blijven of niet. In 2017 ligt de situatie heel anders. Uit een onderzoek van jan. 2017 blijkt dat als je website niet binnen 3 seconden is geladen zal je bezoeker verder zoeken.
Samenvattend : Zorg dat het in ieder geval onder de 5 seconden is maar 3 sec.is beter.
Ranking Behalve het feit dat je niet wilt dat je bezoeker weg klikt van je site door een trage laadtijd speelt er mee dat Google een steeds groter belang toedicht aan snelle websites. In november 2016 publiceerde Google dit bericht.
“Our algorithms will eventually primarily use the mobile version of a site’s content to rank pages from that site”
Uiteindelijk zal dus de laadtijd van de mobile versie van de website bepalend worden voor de algemene ranking in de zoekmachines.
Redenen genoeg om te investeren in de snelheid van je website. Ik kan je website sneller maken.
Wil jij een speedboost voor je website?
Ik bied een page speed optimalisatie pakketten aan waarbij je website tot wel 85% sneller wordt. Daarbij werken we met aantoonbare resultaten met meet gegevens van voor en na optimalisatie.
Recentelijk werd ik door een klant benaderd over een van zijn websites. De laden van de website duurde in zijn ogen te lang. Ok, wanneer is een website te traag? Daar zijn diverse getallen en meningen over te vinden op het internet, maar je merkt het zelf wanneer je een webshop of website bezoekt. Meer als 10 seconden ervaart men als echt teveel. Zelf heb ik de regel, maximaal 5 seconden, maar onder de 3 seconden is beter.
Doormeten van de website
Als eerste begin ik dan met het doormeten van de website. Dit doe ik op verschillende momenten en met meerdere tools om een zo goed mogelijk beeld te krijgen. Zo krijg ik in beeld hoe de laadtijd is op de verschillende devices, mobiel, tablet en desktop. Tevens geven een meerdere testen een beter beeld. Eén meting snel of traag, kan een incident zijn. Het kan namelijk zo zijn dat je even een slechte server response of een lagere internet snelheid hebt.
De verschillende aspecten van laadsnelheid.
Belangrijk is ook om even onderscheid te maken. Er zijn verschillende fasen in laadsnelheid. > Time to first byte (TTFB): dit is de tijd die het kost om de eerste byte aan informatie binnen te krijgen. De TTFB-waarde geeft de snelheid van het netwerk, de server én de site weer. De time to first byte is deels afhankelijk van de locatie van waaruit je de gegevens opvraagt. Meer over TTFB kun hier lezen.
> Start render: dit is de tijd die het kost voordat een bezoeker de eerste informatie op het scherm ziet staan.
> De totale laadtijd: Dit is wanneer alle elementen van een pagina (images, CSS, Video’s en JavaScript) ingeladen zijn.
Om het niet al te ingewikkeld te maken gebruiken we in de metingen die hier genoemd worden alleen de totale laadtijd als meet resultaat.
Laadsnelheid voor optimalisatie
De website PremiumKeur Alkmaar die ik heb doormeten is was al eerder geoptimaliseerd en heeft en geeft een keurige 80 / 92 waarde op de Google pagespeed ranking.
Dit betekent dat je volgens Google een goede en snelle website hebt maar dat is niet helemaal waar. Het betekent meer dat je volgens de Google normen de basics goed voor elkaar hebt maar het zegt weinig over de laadsnelheid van je site.
Als we deze website met meerdere tools gaan meten krijgen we andere waarden te zien. De meet tool die ik veel gebruik is bijvoorbeeld GT Matrix. Hiermee kan je goed de laadtijden en oorzaken uitlezen.
Nu zie je wat de echte laadtijd is , namelijk 17,7 seconden. Dit is de tijd die nodig is om de gehele pagina te laden.
Oorzaak Het probleem zijn de 8 video’s die in de loop van de tijd geplaatst zijn. Die maken de pagina zwaarder en geven een aanzienlijke toename van de laadtijd.
Oplossing Wat ik gedaan heb is een script geschreven dat niet de video’s laadt maar een afbeelding van de video. Een afbeelding of ook wel tumbnail genoemd heeft slechts een fractie van de grootte van een video.
Het script zorgt ervoor dat niet de video wordt ingeladen maar een tumbnail van de video. De video speelt nu pas af wanneer de gebruiker op de tumbnail drukt.
Laadsnelheid na de optimalisatie
Wat is nu de laadsnelheid na deze optimalisatie? Na de implementatie van het script gaan we opnieuw testen. Zoals je ziet is de snelheid spectaculair verbeterd. Nu zien we een laadtijd van 2.4 seconden
Dit is verbetering van 637% ! Ook kun je zien dat de pagina grootte (page size) en de request sterk zijn gereduceerd.
Laadsnelheid van uw website is?
Bent u benieuwd of uw website een goede laadsnelheid heeft? Mail uw website gegevens naar [email protected] en ik laat uw de mogelijkheden tot verbetering zien.
André den Breejen
Wil je weten wat Impress voor jouw website kan betekenen?
