Web design is always on the flux, the shape of the web changing as leading companies have major redesigns or new toolsets like Bootstrap make web development more accessible.
In 2016, we’ve got faster connections and more variety in screen sizes than ever before. More users are browsing on the go, but still expecting media-rich, tailored experiences.
The following ten web design trends are all either making an explosive rise to popularity, or the technology has finally solidified and become advanced enough for them to be in full swing this year. You probably will recognize a number of these features from the websites you use every day.
1. Background Video
How many times have you found yourself scrolling through your Facebook newsfeed just to stop at a quick video?
Video draws attention. This is important in today’s Internet of short attention spans. Having a background video playing on your home page draws the attention of the user and makes them stay on your website.
Background video is also very effective at quickly establishing a mood. For example, a background video going through shots of your employees collaborating, hard at work, and then relaxing after work over a couple beers gives off the vibe of a fun office that works hard and plays hard.
When you go to IUQO’s website, you are immediately greeted with an enchanting background video of the sky. The video is high quality, interesting and immediately establishes a peaceful atmosphere.
2. Highly Saturated Design
Much like the video background, a logo with saturated colors can make you stand out and draw attention to your website.
Neon colors seem to be the latest way to make your website stand out. WhatsApp’s logo has neon green in it, popping it out from the black background. Companies like Spotify and Medium have also recently changed their logos to a neon color.
3. Storytelling as Design
Your story is important, to you and to the user. You should use your website design to help tell your story.
There are a lot of ways to do this. Sometimes, a single image can tell the user everything that they need to know about you and your website. You can also make it interactive and have the user play out your story like a video game.
IGN did just that with The Museum of Mario. This interactive web page takes you on a journey through time by scrolling through the different eras of Mario games. The user feels like they are involved with Mario’s evolution, and they become a part of the story.
4. Card-Based Design
Card-based design seems to be a growing trend that will really take off in 2016.
“Card-based” means that the content on the website is organized into squares or rectangles that fall into structured rows or patterns. This design is neat and orderly, and it looks great on a mobile device. Although Pinterest made this design popular, many other websites are starting to use it as well.
Cards are a great way of packing information into a small, organized and compact space. The Verge uses cards with bright and colorful gradient filters to pull together the headlines into an attractive front page. If you have a lot of content on your website, packing them into cards is the way to go.
5. Stylish Loading Bars
One of the main web design challenge in 2016 will be fighting users’ short attention spans. A poorly designed loading page will quickly drive users from your page. At the same time, web design has evolved so that rich media is more important than ever before.
If your website takes time to load, then you can take advantage of a loading page to keep the users’ interest. Much like the web page itself, the loading page can add to your story. If you sell cars, make your loading bar look like a car driving to the finish line. Here’s a nice one that would work great for a golf course:
Be creative and make sure that your user is engaged while they wait. Otherwise, you can say goodbye.
6. Material Design
Material design has taken off since Google introduced it in 2014. This design style layers elements on top of each other, much like in flat design. However, material design includes shadows and a sense of space to add depth to the web page.
Many of Google’s various projects use material design in their web design. One example is Google Wallet, which features subtle shadows and interactive elements, along with an arrow button to urge users down the page that seems to sit on top of everything else. Like several other sites by Google, the Google Wallet website uses the Material Design Lite Framework.
7. Emphasis on Unique Typography
The typeface that you use is incredibly important. A quick Google search shows that there is an abundance of free typefaces available to you, so there’s no reason to use Times New Roman on your website. Font Squirrel, Google Fonts, and Adobe Edge Web Fonts all have free web fonts you can easily use on your website.
The typography that you choose gives your website a unique look. This is important for branding because the user will recognize your company as soon as they see the typeface. You want users to have a special experience on your website, and there’s no better way to do that then with a distinctive typeface, like the portfolio above.
8. Infinite Scrolling
Infinite scrolling is already a popular design trend that will continue to grow in 2016.
This is a popular feature on any website that has a lot of content, like social media or news sites. Infinite scrolling means that the user can keep scrolling down and more content will load and appear. It makes for a truly immersive experience; there is no pagination getting in the way of the user continuing to discover interesting content.
The image above shows Pinterest a split second before more content is loaded. If your website has a lot of content, this might be the feature for you. Users will stay on your site for a long time because new content will keep appearing.
9. Mobile-First Design
Your website has to be equipped for mobile use. There is no way around it: 80 percent of internet users own a smartphone and use it to surf the web.
Mobile-first design as a principle takes the idea of mobile-friendly design one step further: not only is it smartphone compatible; it was designed first and foremost for small screens.
As you can see, Evernote’s logo is clearly displayed on the top, a hamburger menu sits in the corner, and the CTA fits perfectly above the fold despite the small screen.
10. Personalized Content
One of the biggest emerging web design trends is the ability to personalize your homepage or other landing pages to make them more engaging to your users.
You probably have great content on your website, but your users’ attention span is too short for them to go through hundreds of articles to get to the one they want. In 2016 you’ll have to figure out what your visitor wants and give it to them as soon as they are on the homepage. This is possible by using cookies, geolocation, and ad-clicks.
Some companies are already doing this. Netflix recommends shows based on what you’ve already watched. Google News recommends articles that fit your interests and web history. And Amazon uses past purchases and recent search history to suggest more items you might want to add to your cart. Your website should be designed so that it can adapt to better suit the user’s needs and emotions.
This year, consider whether one or more of these emerging web design trends would be right for your website or your users. Maybe this is the year you will incorporate a background video or enchanting typographic elements into your site, or start personalizing your homepage for your users.
Really a great post Adrienne.
As we know our brains are built to deal with a moving world and are naturally drawn to video. We all understand the majesty and power of cinema. Video gives us editing, timing and framing tools that can help us convey our sense of style or brand identity. In product/service focused websites, the video can be used to give a sense of the product in action. So it is like “Video Background” is attracting a lots of attention.