Are you keeping up with the latest in fashionable web design? If you aren’t following what’s hot in web design trends for 2017, you might as well deck out your site in magenta and switch out your fonts for Comic Sans.
Ok, it’s not quite that bad. However, it’s important for web designers and website owners to keep on top of the latest design trends. It’s not only about looks – your website design can make or break trust with your reader and either convert them to a buyer or send them running to your nearest competitor.
What we consider “well-designed” changes over time in response to trends. Keeping up to date with the latest trends on your site shows your readers that you’re invested in and take pride in your site and your business. You want to stay relevant – it could mean the difference between making a sale and sending your visitor to your competition.
It’s a fascinating time to be in web design right now, so let’s explore what we’re going to see more of in 2017!
What’s Influencing Design in 2017?
One of the biggest influences on web design is technology. And, there’s been some exciting new developments that are starting to go mainstream, like wearable tech and virtual reality.
Wearable Tech and Micro Design
Smartphone screens have been getting bigger over the years, but wearable tech has been a huge leap backward to the tiny screen. This is a challenge for designers – how do you craft meaningful and functional design for a screen the size of a watch face?
App creators looking to expand onto the wearable tech platform will be most affected as they seek to adapt their designs to the micro screen. However, some micro design trends will spill over into web design. We’ve already seen trends towards the micro in the tiny logo trend, where it’s situated top left. Here’s an example from Airbnb:
The Rise of Virtual Reality (VR) and the 360-degree video
VR was huge in 2016. The Google Daydream made waves in a big way.
And VR isn’t just for gamers anymore. It’s opened up a whole new world for marketers and web designers for VR and 360-degree video. The opportunities are limited only by imagination, and automobile companies like BMW and Peugeot have jumped on it. BMW recently had one of the most viewed ads on YouTube with their “Eyes on Gigi” ad.
Peugeot 208 also has a recent promotion campaign called “Catch the Dragon” that contains a VR and 360-degree video (your choice), that starts out with an ordinary car ride and ends with, you guessed it, a dragon.
VR has the unique ability to immerse viewers in an experience. It’s interactive because viewers must turn their head to see the full view, and it feels intimate, because viewers are watching through the headset.
As VR technology becomes more mainstream, expect to see more VR incorporated into web design.
Mobile-first Indexing
Mobile browsing now exceeds desktop by more than double. Mobile’s share of digital time is 65%, with desktop falling behind to 35%.
From a user experience perspective, mobile responsiveness in any website is mandatory. Up to 40% of visitors to your site will leave and choose another search result if your site isn’t mobile-friendly. It’s simply too difficult to navigate a non-responsive site on a small screen and users don’t have the patience for it.
Google is also rolling out significant changes this year with its new mobile-first indexing. Google is shifting its search to use the mobile pages of websites to rank pages.
What does this mean for web design?
Responsive design is not optional.
Typography in the Spotlight
There are several trends going strong in typography that are set to continue in 2017 – text is getting larger and it’s being used decoratively. Effects are also being used on text to make it more interesting.
Supersize Me (typography edition)
Supersized text is increasingly used as a decorative element. It became popular to add oversize text in minimalist designs with a lot of white space and an absence of other decorative elements. However, it’s not exclusively the realm of minimalism anymore.
Here’s an example from Nurture Digital:
Notice the huge letter dominating the screen. This letter changes in sequence to spell out Nurture.
Using effects on text is another growing trend. In the Nurture Digital example, it’s using a video that’s taking place inside the text. The text is used as a frame for the video, giving an intriguing effect like we’re looking through a window.
Other trending effects include animated text, moving text, and text on or overlapping video.
Move Over Minimalism
There’s a strong push away from minimalism and towards the use of more decorative elements. These decorative elements might be in the background, or even animated so that they move when scrolling.
You can see on Uber’s site that they’ve added decorative grid lines to their background and some animated elements.
Order or Chaos?
Rather than clean white space where everything has a place and serves a function, we’re also seeing a trend towards random, somewhat chaotic, elements.
Here’s a great example from Sequence.
Decorative geometric elements hang in a random arrangement on the page. There’s no symmetry to the design. On scroll, these elements animate and shift position at different speeds to each other. Some elements are deliberately animated to overlap before they disappear entirely off screen.
Video Rising
Video has always been popular, but in 2016, there was a veritable explosion. This is due in part to ever-improving internet speeds and technology.
How is video being incorporated into web design?
A major trend right now is the use of full width video backgrounds. Coulee Creative puts this trend to excellent use on their homepage with several video backgrounds for the different sections of their page.
The video trend doesn’t only include full-width videos. Brands like Uber and Nurture Digital are experimenting with different types of video display. For example, on Uber’s homepage, there is a narrow video on the right-hand side of the text. And Nurture Digital uses video played within text.
What About Animation?
Animation is growing up and becoming more sophisticated. Overall the trend is toward less overt, in-your-face animation and more integrated animation that supports the page narrative. Rather than animation being added to the page after it was created, pages are being developed with animation playing a key role.
This example from National Geographic uses animation to tell the story of a bear in Yellowstone National Park. It’s extraordinarily effective at telling the story through a combination of video, timed animations, scrolling, and maps.
Open Composition
Another trend powered by animation is the creation of seemingly random elements that move about the page as you scroll. Some of these elements are animated in a way that makes them seem to exist off-screen which gives a peculiar sense of depth.
What about Images?
Another shift has been occurring in the types of images we see on websites. Cheesy stock photos are on the decline in favor of custom photography, real-life corporate shots, and user-generated images.
Everyone has a great quality camera on hand at all times (it also doubles as a social media lifeline, and can even be used as a phone), so overall the average person can take a much better shot than even a decade ago.
Brands are also looking to build their image and authenticity by using real photos of their people and their customers using their product “in the wild.” Swapping out the cheesy stock photos for candid shots and customer photos can have a huge impact on a business’s bottom line.
Gradients are back
Another trend making a comeback is the gradient. This trend disappeared for a time but it’s now back, and it’s bolder and brighter than ever.
Two-tone gradients are popularly used as a photo overlay. It adds interest to a photo and can be quite stunning. Another popular trend is to simply use a gradient on an otherwise plain page with no imagery. Here’s an example of that trend from Symodd.
The colors add visual interest to what would otherwise be a boring page.
It’s a Wrap
There are many exciting trends to look forward to in 2017. New technology like wearable tech and VR can’t help but bring about major changes to the way we experience the web, and the huge change to Google’s search will also have a big impact on the results we see.
The main trends we’ll see in 2017 are web designers taking advantage of new technology to bring innovative and sophisticated designs to life, more complexity in design in reaction to minimalism, and the powerful pull of real-life images and videos.
Over to you – which trends are you excited about? Any that you don’t like? Let us know!