I like these types of posts because you can look back on them each year and see how well you predicted the design trends of that year.

This post will be split up into an infographic and a blog post which will go into each point in more detail.

web design trends 2017

Share this Image On Your Site

 1. Full width images

full width image web design

Full width images are great.

We have used them on two websites for our clients (La Bodega) and (OIC) this year.

The reason why we love full screen images is that they stop visitors in their tracks and get them to take notice.

Unlike a slider, a full screen image makes the user curious and that curiosity leads them to read the content the image displays. A full screen image allows the user to understand your message very quickly.

Full screen images combined with longer scrolling pages provide you with a unique opportunity to tell your story.

Another bonus of a full screen image is that it doesn’t actually have to be an image. You could replace the image with a background video to add even more of a story telling element to your website.

Full width images however do have some disadvantages.

Full width images are often large in file size and can take longer to load with visitors on slower Internet connections.

To get around this problem I would recommend using a service such as Optimizilla.com or tinypng.com which make your image file size smaller while keeping the quality.

We run most of our images on this site through an image optimisation service, even the Infographic above as it minimises the file size allowing our website to load quicker.

If you use full width images on your website just be sure to take into consideration that the larger images will take longer to load.

2. Split screen website design trend

One of the more interesting design trends to come out in 2016 is the split screen technique.

Split screens divide up certain sections of your website into vertical equal parts.

Split screen design is often used in instances where you want to showcase messages of equal importance. A split screen could work for a company that offers goods or services and divides those into logical categories.

A split screen element on a website funnels your visitors to exactly where you want them, this can increase your website conversion rate.

A great and fun example of a split screen website design can be seen below

web design trends 2017
Image courtesy of enginethemes.com

3. Stronger call to action

small business digital marketing

If you want your user to do something you will need to make your call to action stand out.

In 2016 we saw a lot of websites being bolder with their call to actions. We even used stronger call to action on our site, (we still do).

2017 however is going to take the call to action and make it even bolder.

We predict that a lot of companies are going to start using animation when it comes to the call to action buttons. This could be anything from button colours changing, to the button getting bigger and smaller or even the button moving.

I think subtle animations could improve website conversions using the techniques above, but they will have to be subtle. Anything more and you would be bordering on annoying which will have the opposite effect on conversions by causing people to leave your websites.

Remember the terrible flashing gifs on websites in the 90’s?

You don’t want to replicate that.

A lot of websites that we have seen this year have been using single column call to actions, us included. This year we have added a small animation to our call to action. Can you spot it?

If you go on any of the following pages:

And scroll to the bottom you will see our call to action. Our little animation with the robot is fun, but also it attracts the eye and so far our website conversions are up from when we didn’t have the animation in place.

As with everything it is important to test.

The trends mentioned above are what we predict we will see this year. Of course we could be completely wrong, we could also be right but that doesn’t mean all of the above elements will work on your site.

If you think they could improve your website goals then give them a test and let us know how you get on with them. But before you leave, keep reading to see the other big trends of 2017.

4. Mobile responsive website design trend

mobile responsive web design

More people now use their mobile phones to browse the Internet than desktop computers.

This trend has been happening for a while but I think 2016 was the year that saw the real shift in mobile responsive website design.

More and more business owners are going to see the advantages of having a website that works on mobile devices, because if they don’t they are going to see a massive drop in profits.

In 2017 we are going to see more websites built for mobile phones first. It’s already happening with the amp project.

According to their website, AMP aims to make mobile browsing much faster.

Companies such as Gizmondo, the Washington post, Wired and many more have already stated using AMP which is said to be 3x as quick as a regular web page.

Zooooooom!

Because AMP is being adopted by big companies already, there is no doubt in our mind that AMP pages are going to be favoured in the search results, therefor more website owners are going to have to adopt to this new technology to provide their users with better browsing experiences.

5. Death of the slider

web design trends 2017

A slider/carousel is something that we all have become used to when it comes to website design. But it looks like it is finally dying off.

Horaaay!

Sliders like advertisements are often ignored by visitors. Website visitors are so used to sliders that they have developed a blindness to them.

I could go on and on about sliders, but I have found a rather fun website that tells you exactly why you shouldn’t use a slider in your website design. Check it out below:

www.shouldiuseacarousel.com

Website Design Trends Conclusion

Above were our predictions that we think we will see a lot more of this year.

That said, you shouldn’t go overboard and use all of the above features in everyone of your designs (except for mobile responsive and no sliders!)

We hope you enjoyed the infographic and the content to go along with it, if you did please be sure to give this page a share.

You can use the infographic above on your own website, copy and paste the code below the infographic to do so.