Determining trends for one specific year isn’t easy. Trends tend to bleed together year after year. There’s never a hard distinction between the time people test out a technique in say, 2014, and start doing it en-masse in 2015.
In landing page design, trends like minimalism, the use of flat design, videos, or even showcasing customers as social proof (testimonials, for example), have all been popular over the last couple of years. And all signs point to the possibility that they will continue to be so for many to come.
But for this article we’ve selected five landing page trends that started to catch fire around 2014, and are growing more and more popular, sure to be seen everywhere in 2015. Our challenge for you is to take these trends and learn how they work, and then use that knowledge to push the envelope. Create your own trends and help your work stand out among the millions of landing pages online right now!
1. The two-step signup
Positionly uses a two-step signup process
Remember how we used to see sign-up forms on the front of the landing page and above the fold? Those grids of white boxes asking you for your name and e-mail and phone number, like the landing page for Lodgify.com. Designers are more and more often shying away from that, hiding a longer form behind a single sleek button with a CTA that quickly converts a visitor to a user.
Complicating a single step process seems a bit counter-intuitive when it comes to quick conversions, but there is an intricate science behind it. Stated overly-simply, the theory is that you prevent a perceived friction on the front page by making the process look like it only takes one easy step. When the user makes it to the second page, they’ve already made a micro-commitment. It’s an investment, even if it’s not a big one and even if not every single user feels it, and it helps pull users into completing that form. We’ve all felt that feeling before — you’ve already started something, you might as well finish it.
2. Fullscreen contextual videos
Todoist’s creative contextual imagery
Videos have been big for a long time, but now we’ve hit the era of the auto-play video. You’re scrolling down Facebook and all of a sudden, a Youtube or Vine video starts playing right in your face. You didn’t even hit play.
The same thing is happening on landing pages. Arriving on a page delivers you to full-screen, contextual and mood-setting video imagery. To make the effect more soft and subtle, it’s often filmed to be a bit fuzzy, or shown with a lowered opacity or gradient layer. And whether or not the subject is using the product in the video, the friendly images passing across the screen build trust in a brand.
3. Floating navigation bar
Curt’s Special Recipe uses a floating navigation bar
Landing pages are getting longer and longer, incorporating all sorts of information below the fold. Often we scroll down-down-down only to find that we need to take action at the navigation bar at the top of the site. So we have to scroll up-up-up to get there.
To combat this frustrating UX, sites are bringing that navigation with you, the relevant information spread out over a thin horizontal line at the very top of your page, subtle enough to fit in with the design of the rest of the site, but static to contrast with the movement of your mouse down the page. Easy access to this information for the user means that they’re going to much more easily take the steps that a company wants them to on that first page they land on.
4. A guided tour of the product
LIX explains their tiny 3D printing pen
Products and services can be complicated, and sometimes it takes an explanation to show off the value of what you’re selling. Brands are coming up with new creative and direct ways of diagramming what their potential customers need to know.
Instead of following a link and clicking through a set of pages to find an explanation of what something does, we just have to scroll down through the landing page to find a clever use of icon, infographic, video, or animation.
5. Modular design
Made in Days uses a beautiful parallax modular format
When was the last time you hit up a landing page that didn’t have horizontal blocks of color or imagery that shifted vertically when you scrolled down the page? This is a versatile technique that is immensely popular and very flexible. Despite the millions of sites that use it, designers are constantly finding ways to work with this format now ingrained in user’s experiences in new and interesting ways. Parallax is a huge one, that you can read more about in our blog post The big web design trends of 2015.
What makes this tactic so useful is it’s ability to compartmentalize information, structuring it so that a company can address different questions a user might have about their product on a single page, without overloading the user with information.