Skip to content
Journal

Webdesign trends for 2018

By 3 min read
webdesign trends for 2018

Are you planning to launch a website this year or are you considering restyling your current one? Then it’s good to know what users expect from a website in 2018.

Backgrounds Don’t Need to Be Straight Anymore

In 2018, there’s more room for fluid backgrounds on websites. Whereas in previous years, many designs featured straight, crisp lines, this year, designs are literally going in all directions.

No Straight Line to be Found. Design by Hippie M.

Fluid backgrounds are not only used in the page header; they also appear throughout the rest of the website in various flowing shapes.

Playful lines under the images as well. Design by Martin Strba

Photos Making Way for Illustrations.

In 2017, almost every website featured a “header” with a large photo and text. In 2018, illustrations are taking the place of photos. It’s going to be a good year for artists and illustrators.

Large Illustrations in the Header. Design by Walid Beno

Often it doesn’t stop at just one illustration, but rather a complete series of illustrations is created. These illustrations are typically accompanied by explanatory text and together highlight a component or service.

Serie van informatie illustraties. Ontwerp door Martin Strba

Step Away from the Grid.

2018 is the year for experimentation. With the introduction of new CSS tools, it’s possible to create more playful designs. It’s no longer necessary to place everything within a grid.

“With great power comes great responsibility.” This certainly holds true when you start experimenting with content placement outside of a grid. Ensure it doesn’t turn into an unmanageable mess and plan your website carefully.

Veel wit ruimte houdt het rustig. Ontwerp door Alex Parent

Split Screen Layouts

Split screen layouts are making a comeback. As screens become larger, there’s plenty of experimentation with placing different content side by side.

Split screen layout in actie. Ontwerp door Andrew Baygulov

It’s especially popular to place a large photo or video next to text. Split screen layouts are characterized by taking up the full width and height of the screen.

Dynamische Split screen. Ontwerp door Netguru

Combine Bright Colors

Dare to combine bright colors with each other. Does your brand have some vibrant colors? Try combining these with a photo, for example.

Lekker fel en vrolijke kleurencombinaties. Ontwerp door Ela Kumela

A dull stock photo can become a striking part of your brand with the right color combination. Don’t be afraid to experiment.

Kleuren gecombineerd met foto. Ontwerp door Kike Escalante

Isometric Drawings

Isometric drawings are currently very popular and are mainly used by online software providers. Where it’s often difficult to depict a software service with photos, doing so with an illustration is much simpler.

Isometrisch tekeningen in de header. Ontwerp door bapakpapay

It’s important that the chosen angle of the drawing is consistently maintained throughout the entire website.

Hoek juist doorgevoerd op de gehele website. Ontwerp door Outcrowd

Horizontal Layouts

In addition to split screen layouts, there is increasing experimentation with horizontal layouts. These are layouts that scroll horizontally rather than in the traditional vertical manner..

Content scrolt horizontaal. Ontwerp door Dennis Ziegler

It’s also possible to combine horizontal and vertical scrolling. Just make sure it’s clear how users can navigate through the website.

Horizontal navigation. Design by Dwinawan

Text Can Be Large and Bold

Screens are getting larger, which means there’s more space for both images and text. Large, bold typography combined with images is a popular trend in 2018.

Typography space. Design by Zhenya Rynzhuk

Make sure your texts are concise. No one wants to read long sentences spread over four lines.

Concise large texts. Design by Surja Sen Das Raj

More Shadow for Depth

Selling a product and want to draw extra attention to it? Try making your product stand out by adding an extra shadow. This way, the product will catch more attention.

Product highlighted with extra depth. Design by Cal Notman

It’s not uncommon to create multiple levels of depth, but try to limit it to 3 or 4 levels.

Multiple levels of depth. Design by Cal Notman

Duotoon icons

Icons have always been an important part of websites. In 2018, icons are getting an upgrade and are often presented in duotone colors. Single-color icons are on their way out in 2018.

Business-like and clean icons. Design by Nóra Mellényi

Duotone Icons come in various styles: sleek and professional or playful and cheerful. Find an icon set that fits well with your brand, or have one specially developed for your brand.

More friendly and playful icons. Design by Tomas Knopp

2018 is still young, and trends succeed each other rapidly. Ensure that your new website

Need help implementing these ideas?

I help SaaS teams and startups build fast, conversion-focused sites. Let's discuss your next project.