Web Design Trends 2018

What are the web design trends for 2018? We have been doing research and looking around (which we are always doing to keep current) and we would like to share the results with you.


Bright colors will be in! This is a change from the more neutral softer color schemes. Of course, you need to know who your audience is. If it's an older population, the brighter colors may present some challenges in readability, so use them when appropriate.


Big, bold fonts will be used for headings. Here is an example of nice heavier font and bright color.


Mobile responsiveness in websites has been becoming more and more important. In 2018, this will be an even bigger deal. In 2016, Google said they will be coming out with the mobile first index, meaning Google will create and rank its search listings primarily based on the mobile version of content.  We're not sure when this will actually happen, but apparently mobile searches are continuously on the rise. What does that mean for you as a business owner? Make sure when you have your website created, you choose a designer who understands the importance of it being mobile responsive and is experienced with it.

There are 2 ways to make a website function properly and look good on mobile devices.  The first way is to have 2 or more versions of the same website.  One version would be displayed on full sized screens and another would be displayed on smaller screens.  When this is done, the smaller mobile version often has a smaller amount of content on it.  The multiple version method will be penalized by Google in their new algorithm because Google gives page rank priority to sites with a good amount of content.  The better, more modern way of handling multiple screen sizes is to make the website mobile responsive.  When this is done, the same website is displayed on large screens and small devices but in a "folded up" fashion.  These sites contain the same content in the mobile version as the full sized screen version.  Mobile responsive sites will not be penalized as Google gives more and more importance to mobile in their algorithm.

It's important that you and whoever is designing your website understands the difference or your page rank will suffer.

"In 2018, the focus will be on designing simple but powerful websites that are well optimized for mobile devices and heavily focused on user experience." (Digital Marketing Institute blog)


Although stock photos will still have their place, they will be used less and actual unique photos and graphics will take their place. It is imperative that these photos be high quality and relate to the business and purpose of the page they are on.

Merehead states that "more than 60% of users believe that the decisive factor of a purchase is using unique pictures and photos, so e-stores should give them maximum attention." You can see that it's going to be essential that websites showcase products with unique quality photos.


The use of geometric shapes has been a growing trend since 2016, and seems to still be going strong for 2018.

Here's a nice use of some geometric shapes. https://www.darmandesign.fr/

Here's another website that uses a lot of shapes and movement to create interest. http://www.welovenoise.com



Remember the flashy images from previous years? They're out and more subtle scroll-triggered animations are in. If you're not sure what is meant by that, think of when you scroll down a web page and text and images appear as you go. That's "scroll-triggered" animation. You can see an example of this at https://terwanerik.github.io/ScrollTrigger. You'll notice how the text shows up as you scroll down the page - sometimes in comes in from the left or right, sometimes if comes up from the bottom, etc. You'll also notice there is not a lot of text in each section which keeps a nice clean look. Another example is at Scroll Magic.

Scroll animation is not appropriate for every kind of website. Here's a link to some guidelines on when to use it. Nielson Norman Group.

One thing this article says that I think is worth mentioning here is that it's a good idea to make it so that the animations only happen the first time someone scrolls down the page. Otherwise, if every time you want to go down the page, the animations are coming at you, it can get annoying and overdone.


White space can be thought of as "empty space." These are the sections of a web page without text or graphics. Whitespace can occur between graphics or text, but it should draw attention to the text or graphic it surrounds. If you have multiple graphics on one section, the eye doesn't know what to look at. The cluttered look used to be popular among web pages, but not anymore.

By using more whitespace, it's easier to bring attention to the desired action you want someone to take who visits the page. If you have a newsletter subscription form on the page, using white space around it will help it to stand out. It is also easier for people to read if there is text and keeps out distractions. The example below shows a testimonial with a good amount of whitespace around it. It draws people to read the testimonial which is exactly what you want them to do.

whitespace shown around a testimonial screenshot

The trends for 2018 are not to use graphics for graphics sake, but to only use ones that have a purpose and lead to increased conversions.

Here's an example that we all recognize of good use of whitespace.


The web design trends for 2018 are going to be pages that have a clear purpose and that lead visitors to complete the call to action of that page. No distractions! Unique graphics, text, use of white space, large headers, and clean simple design should all point to the purpose of the page. And clean lean pages load quicker and are better seen on mobile device views, which, as we mentioned, are on the rise.

In a nutshell...





Looking for a Cost-effective Web Design Solution?

Call us at 800-615-8606
or email info@inspirewebsitedesign.com