loading...

Five subtle animations to enhance your website

avatar

BY Haydon Macleod

{Designer}

10 October 2019

Reading Time: 1 minute

Your content might be great, your imagery may be engaging, but does your website still feel a little flat? Let me show you a few easy ways you can enhance your user engagement with some nifty CSS tricks.

Parallax scroll

People are drawn to images! They are used to engage the user and compliment the information on a page. Adding a parallax scroll to your website helps create layers and depth, it makes the imagery that little bit more interesting and engaging. The Firewatch website is a great example of an effective parallax scroll.

Source

 

Button hovers

A subtle colour change is often all that’s needed, but a little goes a long way when it comes to subtle button animations. Really let that user know that this is an important button, It may even entice them to actually click it!

Source

 

Image hover

Similarly to button hovers, subtle image animations add a little something extra to your website. The extra interactivity helps keeps your users engaged.

Source

 

Roll out type

Do you have a title that you really want people to read? Let it unroll in front of their eyes, this will make sure they are paying attention to it. We created this kind of effect for Escient, do you think it’s effective?

Source

 

Delayed loading

This effect can be as simple or as complex as you wish. It takes the user on a journey instead of plopping them down on a static page. Elements loading in as the user navigates the page helps your website feel more responsive to their actions.

Source

 

So there we have it! Five subtle animations that could enhance your website, mostly done with simple CSS.

If you’d like some help zhooshing up your own website, please get in touch.

Like what you see?
Subscribe now to receive regular updates

ABOUT THE AUTHOR

Haydon Macleod

Haydon is a member of our design team, and has already shown comprehension and collaboration skills beyond his years. Top it all off with a wicked (if not sometimes weird) sense of humour - the perfect fit for our team!

avatar
MORE ARTICLES LIKE THIS