{"id":141390,"date":"2015-06-04T07:00:00","date_gmt":"2015-06-04T11:00:00","guid":{"rendered":"http:\/\/premium.wpmudev.org\/blog\/?p=141390"},"modified":"2015-06-04T07:00:00","modified_gmt":"2015-06-04T11:00:00","slug":"web-trends-2015","status":"publish","type":"post","link":"https:\/\/wpmudev.com\/blog\/web-trends-2015\/","title":{"rendered":"The Web Design Trends Dominating 2015 and How WordPress Stacks Up"},"content":{"rendered":"

Web design has come a long way since the under construction GIFs and marquee scrolling of the GeoCities days.\u00a0Back then, we could not have imagined what the biggest design trends would be in 2015<\/p>\n

So which trends and techniques have come to define\u00a0this year? I set out to uncover them by\u00a0scrutinizing\u00a0200 of the top performing and most popular corporate sites and themes in and outside of WordPress. It was an exhaustive exercise, and\u00a0one that revealed some obvious insights not to mention a few surprises along the way.<\/p>\n

More importantly, I wanted to answer\u00a0the question: Is WordPress keeping up with current design trends?<\/p>\n

I’ll reveal my thoughts below, as well as my pick of the\u00a0themes and plugins that can help you stay on trend.<\/p>\n

What a Top Notch Design Can Do for You<\/h2>\n

When someone visits your site, your design is the first thing they see, obviously. If it’s not impressive you’re in trouble since 48% of your visitors will use it to decide whether or not they believe\u00a0your business is credible. A whopping 94% of users leave sites that are poorly designed, according to IronPaper in their article 10 Web Design Statistics<\/a>. Do you remember the last time you landed on a site with an awful design? Did you stick around long? I thought so.<\/p>\n

\n
\"A
Which site would you trust and which one would you leave?<\/figcaption><\/figure>\n<\/div>\n

You can see this idea in action by visiting Airbnb<\/a> (pictured left) and VRBO<\/a> (pictured right). Out of the two sites, which one are you more likely to browse?<\/strong><\/p>\n

Besides helping validate your brand, a killer style can help increase your sales. Neil Patel, co-founder of CrazyEgg, explains that a $20,000 investment in his site design had increased his conversions by 21%\u00a0in his article How Saving On Design Could Cost You More In The Long Term<\/a>. He also made back his money in less than a month.<\/p>\n

In a world where technology and user habits change rapidly, being left behind can cost you.<\/p>\n

Think about it: Your business has to not only compete with other companies and sites in the same industry, but also with\u00a0those attention-hogging sites\u00a0we know and love\u00a0\u2013 Facebook, Twitter, YouTube, Vimeo, BuzzFeed, just to name a few.<\/p>\n

If your site doesn’t look eye-catching, personable and professional, you won’t have enough time to convince your users you’re worth their time, let alone sell to them.<\/p>\n

I think\u00a0Chuck Longanecker, CEO of Digital-Telepathy says it best in his article Design is Marketing<\/a>:<\/p>\n

“Design is no longer optional; it is required for success ….\u00a0In today\u2019s design-minded culture, your product can be easily disrupted or ignored without a thoughtful design.”<\/p><\/blockquote>\n

The question is: What features ultimately make for a striking, attention-seeking site design?<\/p>\n

Let’s answer that by taking a closer look at the design trends for the first half of 2015.<\/strong><\/p>\n

Top Four Design Trends<\/h2>\n

In all the sites I analyzed, there were four particular features that were prominent and that most or all of the sites had in common: A responsive\u00a0layout, a list-style blog, CSS3 animations and bright colors.<\/p>\n

\n
\"Top
With mobile browsing steadily becoming more prevalent, it’s no wonder the top design feature is responsiveness.<\/figcaption><\/figure>\n<\/div>\n

These stats make sense when you consider 62% of companies that created responsive sites increased their sales, according to Econsultancy. That was back in 2013, but the stats have not changed\u00a0\u2013 in fact, they have grown.<\/p>\n

According to We are Social’s report called “Digital, Social and Mobile in 2015”, 51% of the world’s population uses mobile phones\u00a0and 31% of the internet’s usage comes from smartphones.<\/p>\n

In February, Google announced it would\u00a0provide a boost to search engine rankings for responsive sites<\/a>. In the company’s\u00a0FAQ, there’s further explanation that sites designed for only large screens may see a significant decrease in their search rankings<\/a>.<\/p>\n

Each of the sites I analyzed weren’t\u00a0simply functionally responsive, they had a specific layout designed for optimal viewing on mobile devices \u2013 visitors would not miss out on any content while using their smartphones or tablets.<\/p>\n

\n
\"A
A comparison of cPanel’s desktop and mobile site. They are practically the same.<\/figcaption><\/figure>\n<\/div>\n

cPanel’s site is a great example of optimal responsiveness. The mobile version is nearly indistinguishable from their desktop site\u00a0while still loading quickly.<\/p>\n

The message is steadily becoming more and more clear: If you’re not developing and using responsive site designs, you could very quickly become obsolete.<\/strong><\/p>\n

Rare Form New Media<\/a> also reported last year that bright colors increased brand recognition by 80% and over 90% of a visitor’s buying decision was influenced by site design and usability. Colors were certainly visible among the tested sites.<\/p>\n

\"The
Not every theme and site had this magnitude of color but they were present.<\/figcaption><\/figure>\n

Adding CSS3 animations is another trend that’s really popular among top sites and themes because it can help breathe life into an otherwise static page. When used in small doses, it can really bring an element of fun and excitement to your site.<\/p>\n

When you scroll down on many sites, there is a featured list with icons displayed in a grid-style layout to display key features. This has been a strong trend for many years, but now the trend is for them to fade in with a little pop of additional movement to draw your eyes in.<\/p>\n

It’s difficult to miss and looks fun so visitors are more likely to pay attention to what’s being presented to them. Thumbnails of posts also include subtle animations to join in on the eye-catching design.<\/p>\n

The added CSS3 animations is a trend that’s growing strongly and if you’re not adding them to your theme, you may be missing out.<\/p>\n

Trends Coming in Fast and Furious<\/h2>\n

There are several trends that are also becoming more and more prominent, including full-width page sections, sticky navigation, one-page themes and well-placed parallax scrolling.<\/p>\n

\n
\"Prominent
Full-width page sections and sticky navigations are quickly becoming a must in relevant site design.<\/figcaption><\/figure>\n<\/div>\n

A sticky navigation bar is one that is visible even when a user scrolls through the page and, quite frankly, it just makes sense.<\/p>\n

Why make your users work to get to the top of your site\u00a0to click through to a different page? The easier your site is to use, the better your bounce and conversion\u00a0rates will be.<\/p>\n

It also helps if your site looks eye-catching and full-width page sections help with that. Taking a look at\u00a0how\u00a0Asana’s website<\/a>\u00a0has been design and you’ll see\u00a0striking page sections in action:<\/p>\n

\n
\"Full-width
Full-width page sections on the Asana.com site.<\/figcaption><\/figure>\n<\/div>\n

You may also have noticed that this site is a great example of both sticky navigation and\u00a0the\u00a0use of bright colors.<\/p>\n

One-page themes are also beginning to pop up thick and fast and\u00a0are quickly becoming more prevalent among WordPress themes and professional sites.<\/p>\n

Our\u00a0Panino theme is an excellent example. Clicking on arrow buttons or links in the navigation menu scrolls the page automatically to that section of the page rather than loading a new page.<\/p>\n

Some themes also have little arrow buttons at the bottom of the page that scroll to the next page section when clicked.<\/small><\/p>\n

Even displaying a single button at the bottom of the featured image of\u00a0your homepage can be an effective and elegant way to extend your call to action and help make your site more interactive.<\/p>\n

On the WordPress.com<\/a> site, a button is strategically placed at the bottom of the featured image. Above the button, there are reasons listed for why you should join WordPress followed\u00a0by some text: “Need more reasons?”\u00a0When clicked, the page scrolls smoothly to the next section with\u00a0\u2013 you guessed it!\u00a0\u2013 more reasons why you should join\u00a0WordPress.<\/p>\n

\n
\"A
WordPress.com isn’t the only large company taking cues from one-page themes \u2013\u00a0all the cool kids are doing it.<\/figcaption><\/figure>\n<\/div>\n

You may have also seen our previous posts where we list many stunning parallax themes for WordPress<\/a>, show you the right way to use parallax scrolling<\/a>, and mention how it has lost some popularity in the past couple of years. It’s starting to make a comeback, though, at least when it’s done right.<\/p>\n

Displaying one or two page sections with parallax scrolling is an effective way to show style without being over the top, and that’s exactly the trend that’s picking up steam.<\/p>\n

There are\u00a0two more trends that are quickly gaining popularity and if your theme doesn’t include them, you should really consider adding them.<\/p>\n

Homepage Featured Images are the New Black<\/h2>\n

Image and video sliders have been a big trend over\u00a0the past few years, but they are beginning to be replaced by full-width or full page featured images.<\/p>\n

\n
\"home
It might be time to start thinking about replacing the sliders on your homepage.<\/figcaption><\/figure>\n<\/div>\n

Although sliders can be a highly effective way to help drive an emotional connection with your business, you can still achieve this with well-thought out images.<\/p>\n

It’s also worth mentioning that automatically scrolling sliders are not accessible to the visually impaired. For this reason alone, it’s easy to see why many designers are beginning to ditch sliders and opt for beautiful and colorful featured images for the homepage.<\/p>\n

What was also interesting to see was that many sites and themes either exclusively displayed blog posts in a grid or masonry-style or had them as additional options. In fact, 42.5% of the sampled sites had a grid-style blog, while 15.5% had their posts displayed masonry-style.<\/p>\n

Many people dismiss these options, which is clear when you consider 66.5% of sites either exclusively had a list-style blog or had this feature as an option, but different blog styles are on the rise.<\/p>\n

It might be surprising to you that\u00a00.5% included music and had a video slider that played automatically. I, for one, was shocked since I thought this was something that died out in the 1990s. It can be alarming to visit a site that has music playing, especially if you have the volume turned right up on your device, which was, unfortunately, the case for me.<\/p>\n

If this is any indication of the collective experience of humanity, it might be a good idea to leave any automatic sound out of your site design.<\/p>\n

The Bottom Line<\/h2>\n

So what have we learned from these design trend\u00a0statistics?<\/p>\n