2018 Web Design Trends

Web Designs Trends to Follow in 2018

When is the last time you redesigned your website?

This is a question that we often ask, but sometimes we can make pretty viable guesses based on trends your website holds. For instance, sites that are responsive but not exactly mobile-friendly are likely at least 1-2 years old. Seeing a website that isn’t mobile responsive at all immediately tells us that the site is more than three years old. Additionally, sites that use a completely separate mobile version were likely created more than 5 years ago.

Other indicators like Flash, static headers, “flat” design, and social feed overload tell us that a website is not quite up to speed with current trends. These signs may be why you are falling short of your competitors, who have a more recent update that is a better design and easier to use.

How often do I need a website redesign?

By industry standard, we recommend a facelift to your site every 3 years. This doesn’t have to be a huge overhaul, but as your business evolves, you have better messaging, better imagery, and a better brand – you want your website to reflect that!

When customers are finding you for the first time, they want to see a representation of your current business. A website with broken or out-of-date elements may not be the first impression you were hoping to give to a customer.

As web designers in Memphis and the US, we have a variety of businesses that come through our doors with similar objectives, and some with completely unique business goals. No matter the direction of their site, it’s our job to bring their business goals alive with a comprehensive web design strategy, which balances classic elements and functionality with beautiful, innovative design.

As we move through the end of the first quarter, we’re seeing a few specific trends make their way into the web design industry that will have staying power through this year. With the help of our Director of Creative, Mike Moran, I am excited to present the 2018 web design trends that you can expect to rule the online space.

responsive logo design

Responsive Logos

If you’re in tune with web design, you know that responsive web design and mobile-first design has been around since 2014 and 2017, respectively. However, a common challenge was paring down the logo to still be fully visible, but not take up so much real estate on the screen that it convoluted the message.

As a result, we’re beginning to see not just responsive web elements, but responsive logos! Major brands, pictured above, are relying on their strong brand recognition to anchor their site. Does your brand convey a strong enough brand image that an icon can be immediately recognized and associated with your business?

We predict we’ll see more brands using simplified versions of their logos in a responsive nature throughout the year. Think about your logo – how can it maintain your image, while removing elements (like your name) on smaller screens?

vivid colors in web design

Vivid, Bright Gradients

For years, a pop of color has been the easiest way to create an eye-catching design. The contrast of light to dark and use of complementary (or opposite) colors creates a vivid contrast that captures the eye. There’s a bit of a shift in 2018, where less contrast and natural gradients will shine.

While not shying away from bold color, a more natural gradient between two colors provides an easier view and continues the movement on a page, which helps move users’ eyes along the page, whether that’s across content or down the page to a new section.

Do you have two colors for your brand that would pair well in a gradient? If not, mild, one-color gradients work just as well. Start with your brand’s color, find a variation, and choose a color that is 10-20% darker and moving to a shade that is 10-20% lighter. From there you can expand the gradient to get the right look.

extra depth - web design trend

Extra Depth & Exaggerated Shadows

A few years ago, flat design provided a modern, classic approach to pictures that was much needed, and freed us from harsh, unnatural drop shadows around products. With the rise of augmented reality and better graphic displays, the drop shadow is back, but this time with a different look in mind. Providing extra depth and 3D look to specific elements on your site makes them stand out, as if you could reach out and pick them up.

Take a look at the shoes in the image above. With the diffused dropshadow, the shoes have a “pop” effect that gives several layers of depth to the website, without any special goggles or apps.

We predict the use of this “3D” view to be heavily used in 2018, with augmented reality components integrated to provide a high-definition online experience.

animation in web design

Animations & Movement

While no stranger to web design, movement is a key element that is continuing to trend into 2018; and we’re not talking banner rotators or lazy loads of years past! Animations on hovers, and other movement on the site elements, like icons, are providing an interactive experience that makes your user take notice.

Hover states can also incorporate other trends, like gradient buttons or increased depth, that turn your website into a true work of digital art. Envision where you want clients to click on your website, and look at how you can draw their eyes and cursor, or finger, to that area.

Although we encourage movement, it’s important to note that subtle elements create a much bigger splash than loud, disruptive movement. Often, the larger movements can cause a bad user experience, making users leave the site without interaction.


Geometric Elements (with a Touch of the ‘90s)

You know the phrase, “everything old is new again”? It’s so true! While you’re rocking your plaid flannels, acid wash jeans, and high tops, the ‘90s are coming back in “fashion” online, too. Those iconic geometric shapes of Saved by the Bell and the Fresh Prince of Bel-Air fame have found a new home in web design.

Any shape, from lightning bolts and triangles to patterned dots, has a place in new web designs to create a bold, visual look. Even traditional businesses can use geometric elements to help create division, break up big content areas, and direct the eye throughout the site.

Sharp angles can push the eye directly into a CTA, which makes it unforgettable for your user. Think about how you can add a bit of classic ‘90s nostalgia into a new design. Sometimes, leaning on trends of the past can help bring your site into the present.

50/50 Splits in web design

50 / 50 Splits

In photography and in design, we’ve been trained to look at the “rule of thirds.” This guideline says that your focal point should intersect your visible space into thirds. This trend is still used heavily in web design, with main subpages, using a two-thirds/one-third layout, as well as consistent rules of thirds on home page design.

In 2018, we’re going to see bold (are you starting to see a theme, here?) breaking points right down the center. That’s right – splitting content sections at a 50/50 split and giving equal, symmetrical space in a layout will be a norm this year.

Expect big imagery contrasted by text blocks and lots of white space to give a site a good balance. We’re also seeing overlapping text and no formal rules for alignment of headlines. These visually-appealing looks remain clean, balanced, and translate well to most devices.

patterns in web design

Patterns & Textures

You know that feeling of familiarity you get when you hear an old favorite song on the radio? The same feeling can be achieved through the use of patterns and textures, and we’ll be seeing more of that in 2018.

Creating a “safe” visual experience, patterns and textures form a comforting appeal that promotes harmony and togetherness, and can achieve a strong response on your website.

If your product or service relies on emotion to convey your message, consider a pattern throughout similar pages – maybe a particular texture for a specific call-to-action. This allows your user to process the information with heightened familiarity and recall, which can invoke a positive emotional response.

modular blank space in web design

Modular Blank Space

It’s been said that white space is where the world and all distraction falls away, and 2018 is playing it up in a big way! Intentional blank space in a site is a design trend in itself, and is a powerful way to create a contrast to your messaging.

With big blocks of white space, minimalist design has found new popularity in web design. Fitting equal pieces together in grid structures, following sharp angles and relying on each element fitting into its own space, is a great place to start when using blank space.

Is your outdated site cluttered with overlapping pieces? Think about how to bring clarity and freshness to the design by giving each element its own place; it may just give your site the breath of fresh air it needs.

load times in website design

Load Times: The User is Key

This item is less design-specific, but more of a must-have. With Google announcing they are indexing websites based on mobile performance before desktop, it’s imperative that your mobile speed and quality scores are high. Caching images, optimizing sizes, and minimizing scripts on the page are a few key ways to minimize page-load speed.

Another aspect to pay attention to is your type of connection. If you’re testing your mobile speed while sitting in your office, chances are your phone is connected to WiFi and receiving a strong signal. But what happens where you’re on LTE only? 4G? 3G? Understanding how your website loads under normal mobile conditions, like when users are on-the-go, is an important test to not overlook.

If your site is mobile friendly, but takes a while to load, there’s a big risk that users are abandoning your site before they are seeing the content you’ve worked hard to produce. Run mobile speed tests through sites like Google’s PageSpeed search, but don’t forget to test it out in the real world. Have a close friend or relative test the site in front of you, and see how they react to page speed.

geometric grids in web design

Geometric Grid Layouts

We’ve discussed white space and 50/50 layouts, but if you have multiple categories that need represented, what’s the best way to do that? We’re predicting geometric and mason grids will remain a strong trend in 2018. Much like modular white space, geometric grids puzzle together different blocks of content, while keeping each in its own place, or container.

Creating grids with vivid imagery, textures, or animation are all great ways to take your content to new heights. How do you currently have sections configured on your website? Does it make sense to refresh the different ways people can access your content?

How Design Trends Can Improve Your Business

Incorporating any of these ideas can bring a new, fresh vibe to your website. Quickly, your customers will begin to link your business to being tech-savvy and authoritative. The updated look will also increase brand trust, giving your audience confidence that you are relevant and able to meet their needs.

Are you unsure of how these 2018 design trends can be incorporated into your site? We have a team of designers and digital marketing strategists who can help! Combining beautiful design with smart, functional tools is what Speak does best.

Contact us to see how we can make a website that both you and your customers will love, in 2018 and beyond.

Let's talk web design
Posted by Kindra Svendsen at 06:44