Hoe gebruikers integreren met animaties?
Om een gebruiker nog meer te betrekken bij een website wordt er vaak gebruik gemaakt van animaties, dit omdat sommige elementen zonder animaties wellicht niet zo duidelijk zijn of een bepaalde pagina te lang moet inladen.
Zo heb je soms een knop die niet altijd naar een nieuwe pagina gaat, om dit duidelijk te maken wordt er een scroll-animatie toegevoegd die er zo uitziet:
Gebruikers met trage internetverbinding
Gebruikers die met een kleine bandbreedte surfer kunnen soms al wat wachten op bepaalde scripts of afbeeldingen, om de webdesigner niet te weerhouden van zijn creatieve geest maken we gebruik van lazy-loading alsook multi-part loading. Dit zorgt ervoor dat de belangrijkste elementen op de webpagina eerst ingeladen worden en daarna pas de animaties etc.
Afbeeldingen kunnen we ook op deze manier controleren, waarom zou je als je de pagina inlaad afbeeldingen willen zien die zich onderaan de pagina bevinden? Niet! Daarom worden de afbeeldingen pas ingeladen wanneer deze zichtbaar zijn op het scherm, dit zorgt voor een supersnelle laadtijd voor elke pagina van de website.
Gebruiker focussen op belangrijkste elementen
Elke website heeft een doel (call-to-action): Producten verkopen, naambekendheid maken, advertenties weergeven, contacteren, .. . Om dit doel te bereiken wordt de focus van de gebruiker vaak bepaald aan de hand van animaties.
Elementen inladen achteraf
Elementen die achteraf inladen zijn degene die de gebruiker het laatst in zijn geheugen heeft, dus dit is waar momenteel zijn focus is. De laadtijd van elementen kunnen wij zelf bepalen dus bijvoorbeeld een call-to-action knop zoals 'Contacteer ons hier' maximaal één seconde later doen inladen kan al wonderen doen.
De bezoeker op de hoogte houden
Ooit een contactformulier ingevuld zonder eigenlijk te weten of deze nu aangekomen is of niet? Dit kan opgelost worden aan de hand van animaties, bijvoorbeeld bij het sturen van een email inplaats van een 'succes tekst' een leuke animatie toe te voegen aan de knop, en daarna een popup animeren met bevestiging van je inzending.
Niet alleen bij een contactformulier is dit handig, alsook bij een winkelmandje in een webshop, hoevaak voeg je een element in je winkelmand en vraag je je dan af waar het winkelmandje is? Te vaak! Door het animeren bij het klikken op de knop en een vloeiende beweging richting je winkelmand zal elke klant een aangenaam gevoel geven.