Homepages: Part 4
Updated: Dec 29, 2022
HI HI HI, okay, new week, same me. Let's do it.
Last time I talked about ~ THE FOLD ~: what is it, why you care, and some controversy. Before the fold, I tried to convince you, my nameless audience (please say Hi if you actually read these, the internet is so lonely). Anyway - off to a new topic! Let's talk about movement. Specifically, movement on your homepage.
WHAT IS MOVEMENT
Are you old and did you use PowerPoint in high school / college like I did? Did you meticulously put in various transitions in order to entertain your classmates (think fade, dissolve, etc.)? Perhaps you remember Prezi being a new amazing presentation option. Ok if not perhaps you are young and I should just say GIF is to movement as Polaroid is to stillness. Movement (or motion) in websites refers to items / elements moving, rotating, scrolling, flashing, blinking, spinning, bouncing, and whatever other animation describing words you can think of.
DO I NEED TO ADD MOVEMENT
This is a question I cannot answer for you in a short blog so here are just a few considerations to guide you on your journey.
Who is your audience? Would they appreciate movement, would it make the website more engaging to them?
Accessibility should be considered in everything we do, especially websites. Check out W3C for updated accessibility standards / best practices. At a minimum: do not auto play sound or have videos that cannot be turned off easily.
What is the purpose of movement? Am I adding movement just because I think I need it? Does the movement highlight something particular about my work / page elements?
MY PERSONAL PREFERENCE
I don't like unnecessary movement. Its annoying and distracting to me. Extra dislike if I cannot turn off the movement easily and quickly. I do like movement that adds value to the element. What is an example of a website with unnecessary movement? Warning, loud website but here it is (https://www.lingscars.com/) [*side note: at this point Ling's Cars website is famously bad, so I like hate-like it]. What is an example of movement that adds value? Check out oddfellows homepage (https://oddfellows.tv/). oddfellows is a creative agency specializing in motion design and their website uses movement elegantly and fantastically. See my preferences on movement expressed in gifs below.
In Short - Make sure movement MAKES SENSE. Do not add movement for movement's sake. Good luck and remember the internet is a vast resource and you can spend hundreds of hours on this topic alone. You probably don't have time for that so remember tip #1 - Keep It Simple.
Example 1 - Beautiful, simple, movement in a gif
Example 2 - Annoying movement in a gif