5 Web Design trends of 2018

Google isn’t as predictable as some people may think, therefore ranking in Google can be just as ...

2018 has seen a number of new and evolving trends in web design and development. Below we will explore some of these trends.

1. Dynamic gradients

Gradients seem to be one of those web design trends that faze in and out of favour. In the past when they were used they would usually be a gradient that would transition from two shades of the same colour in the form of subtle shading to suggest 3D like early iOS. These were fazed out for flat design using solid colours. Now they are making a comeback, and this time they are big, loud and full of colour.

gradientlab screen capture demostrating bold gradients
Via: gradientlab.space

These big bold colours are getting used both for simple gradient backgrounds and as a gradient filter over photos, which is a great way to make a less interesting image look intriguing.

2. Mobile first

With more and more people using mobiles in daily life, mobile traffic is dominating over 50% of all web traffic and surpassing desktop traffic it has become even more important in 2018 to design from a Mobile first perspective. This is only going to increase as we move into 2019 and beyond.

Screen capture two modern mobile first designs
Via:thegrove.co.uk & www.and.co

What in the past used to be a challenge for designers has over the years become more refined. The hamburger icon and slide out menus have become the established norm, and where we used to have to ditch large images can now be replaced with more economical icons.

3. Vibrant & bold colour schemes

2018 has seen the rise in the use of vibrant and bold colours in web design. In the past, many brands and designers were stuck using web-safe colours, but with advances in monitors and devices able to reproduce richer colours designers have been getting more courageous in their approach to colours on the web.

screen capture of premier league site and it's use of bold contrating colours
Via:premierleague.com

The trend leans towards supersaturation, vibrant shades, and even clashing colours. These are helping to attract visitors and to set brands and sites apart from the ‘web-safe’ and the traditional.

4. CSS Grid

One of the biggest changes in 2017 was the adoption of the CSS grid spec in the latest versions of the major browsers like Chrome, Firefox, Safari and Edge. This has led to asymmetrical and unconventional ‘broken’ layouts in 2018, the appeal of these asymmetrical and broken layouts is that they are unique, distinctive and a major departure from the blocky sites of previous years.

screen capture of a asymmetrical and broken layout
Via:dada-data.net

These are still experimental due to the fact older browser doesn’t support the grid spec but as the adoption of the newer browsers increases, these asymmetrical and broken layouts will become more prevalent in 2019.

5. Big & bold typography

Typography has always been a powerful visual tool in design, but until recent years it was difficult to use custom and non-web safe fonts in web design due to limited support for custom fonts. This has all changed in recent years if the ability to embed custom fonts and due to services like Google Web Fonts. By being able to use the same fonts in web design as those in print design has enabled site to create more personality, evoke better emotion and set a tone on a website all while conveying important information.

screen capture of big and bold typography
Via:nurturedigital.com

This year has also seen the rise of using bigger fonts. While the standard for body fonts used to be 16px, there has now been an increase and it is starting to become more common of the body fonts to be in the range of 20px. This has, in turn, led to titles become bigger and bolder and them starting to become more integrated into the overall design on the page.

Summary

2018 has seen a lot of changes which will carry on having an effect into 2019 and beyond. Check back for a future article where we discuss what may change in 2019.

Related News