Websiteprestaties: Een prestatiegerichte website ontwerpen
Leestijd 4 minuten
Websitepagina's met relevante en overzichtelijke inhoud hebben over het algemeen een betere laadtijd en zorgen voor een soepelere gebruikerservaring voor bezoekers.
Verbeter de prestaties van je webpagina's door de onderstaande ontwerptips op te volgen, zoals het optimaliseren van het gedeelte boven de vouw en het maken van speciale pagina's.
In dit artikel lees je meer over:
Tip:
We raden aan om extra aandacht te besteden aan de Homepage, aangezien dit over het algemeen de eerste pagina is die je bezoekers zien.
Laadvolgorde van elementen
Elementen op je website worden in een specifieke volgorde geladen. Elementen die statisch zijn of een lage resolutie hebben, worden sneller geladen dan zware of interactieve elementen.
De volgorde waarin elementen op je website worden geladen, is als volgt:
- Statisch: elementen die een lage resolutie hebben en over het algemeen niet geanimeerd zijn, zoals tekst en vormen.
- Vloeiend: elementen die veel inhoud bevatten en mogelijk een hogere resolutie hebben, zoals afbeeldingen of video's.
- Interactief: inhoud die interactief is en mogelijk externe code bevat, zoals iFrames en apps van derden.
Houd rekening met de laadvolgorde bij het structureren van je website en het toevoegen van inhoud. We raden aan om elementen die het snelst laden toe te voegen aan het gedeelte boven de vouw, omdat dit de eerste inhoud is die wordt weergegeven wanneer een bezoeker je website opent.
Boven de vouw
Het gedeelte boven de vouw van je website is het gedeelte dat bezoekers kunnen zien zonder te hoeven scrollen. Het is meestal het eerste deel van de website dat wordt geladen.
Wij raden aan om waar mogelijk alleen noodzakelijke statische elementen toe te voegen en het ontwerp van dit gedeelte simpel en relevant te houden.
De elementen die wij aanbevelen voor het gedeelte boven de vouw van je website zijn:
- Tekst: Tekst geeft bezoekers een duidelijk idee van waar je website of merk voor staat. Verder kan het worden geïndexeerd door zoekmachines en kan het de SEO van je website verbeteren. We raden aan om het bij systeemlettertypes te houden en overmatig gebruik van verschillende lettertypefamilies of -zwaartes te vermijden. Lees meer over het optimaliseren van text op je website
- Oproepen tot actie (Calls to Action - CTA's): CTA's zijn knoppen en links die bezoekers helpen een gewenste actie op je website uit te voeren, zoals een aankoop doen of contact opnemen met je bedrijf. CTA's moeten duidelijk worden omschreven. We raden aan geen elementen in de buurt van CTA's toe te voegen die bezoekers kunnen afleiden.
Galerijen, video's en animaties
Vloeiende en hoge resolutie elementen kunnen beweging en leven aan je website toevoegen. Ze kunnen er echter ook voor zorgen dat de website langzamer wordt geladen en daardoor de prestaties negatief beïnvloeden.
We raden aan voorzichtig om te gaan met deze elementen. Gebruik ze alleen als het echt nodig is en probeer ze niet in het gedeelte boven de vouw van je website te plaatsen.
Speciale pagina's en paginalengte
Wix biedt een breed scala aan apps die je kunt toevoegen aan je website, waaronder Stores, Blog, en Video.
Wij raden aan om speciale pagina's voor deze apps te hebben die niet de Homepage van de website zijn. Zo voorkom je dat je Homepage overbelast raakt, wat van invloed kan zijn op je laadtijd. Je kunt vervolgens vanaf je Homepage naar deze speciale pagina's linken met behulp van elementen zoals knoppen, menu-items en links.
Het toevoegen van speciale pagina's kan ook de paginalengte verminderen. Dit is het aantal schermen waar een bezoeker doorheen moet scrollen om een volledige websitepagina te bekijken. Wij raden aan om de paginalengte tot acht schermen of minder te beperken door alleen noodzakelijke onderdelen toe te voegen en het gebruik van CTA's te optimaliseren.
Knoppen
Knoppen zijn een handige manier om een voorbeeld van de inhoud van je website te bekijken zonder dat dit ten koste gaat van de prestaties.
Voeg statische elementen (zoals tekst) toe aan je Homepage om bezoekers een voorproefje te geven van de inhoud van je website. Voeg vervolgens een knop toe die naar de betreffende pagina verwijst. Bijvoorbeeld: "Bekijk mijn blog", "Bekijk meer" of "Start met winkelen".
Vond je dit artikel nuttig?
|