Top 8 Web Design Trends for 2017

Top 8 Web Design Trends for 2017
Top 8 Web Design Trends for 2017
Time to read: 7 minutes

Although 2017 wasn’t that long ago, it’s funny to look back and see just how much web design has evolved in just a few short years. 📅

It was a year when the web design community embraced mobile first approach to design, bold colours and visuals that stood out rather than text. Web design is kind of like multi-tasking – you can do one job, do it well and end up with something that works and does the job well, or you can add a flourish here and there and come up with something that pushes the borders of industry standards. Sometimes you can try too hard and make something beautiful that kills the user experience by overwhelming them.

Looking back, here’s how 2017 influenced the web design landscape and what we can take away from it. Obviously, design trends are always evolving, and that’s why we do our best to stay on top of them and keep improving. But hey, looking back every now and then is a great way to make sure your website isn’t stuck in the dark ages -because let’s be real, 2017 is about to feel like a flip phone in the era of smart phones. 📞

1. Mobile first approach to design 📱

Okay, yeah, we get it—mobile’s not new. Responsive design isn’t even new, but it’s more crucial than ever. Google’s made it clear: they’re prioritising mobile-friendly websites when it comes to SEO. 🔍

With more and more users accessing the web on mobile devices, it’s essential to provide them with the best user experience (UX) possible. While responsive design has been around for a few years now, it’s more important than ever. Smartphones have smaller screens than tablets or desktops, which limits what users can see at once. It’s time to make sure your site fits the screen—no scrolling required.

responsive-design

2. Courageous colours 🎨

Duo tones really took the spotlight in web design. Using hero backgrounds and duo tones allowed designers to create bold, impactful images without overwhelming users with too many colours or making the text harder to read. It was like finding the perfect balance between “impressive” and “okay, that’s a bit much”.

With minimalist and flat designs on the rise, bright colours made a comeback—leading to the growing trend of duo-tone colour schemes for hero images. It was like the design world decided to spice things up without going overboard. 🌶️

On top of that, bright colour palettes were great for creating a strong brand presence. Just think about it—Google had its classic blue, red, and green, Facebook rocked that deep blue, and Excite Media brought in fresh, enthusiastic green. These vibrant colours helped designers craft websites that not only looked amazing but also drew users in and did exactly what they needed to do. It was colour that worked, not just looked good. 🎨

3. Shadows and Material Design 🌑

Alright, flat design made a comeback as the go-to trend in 2017 — 2D shapes were the “it” thing in 2015-2016 but guess what? The new “it” thing became 3D shapes. Some genius (and I mean that in the best possible way) thought, “What if we could level up flat design by adding layers and depth while still keeping it flat?”

This idea sparked some clever use of large-coloured shadows, playing with dimension and depth of field to highlight interactive elements. By using shadows this way, user experience got a major boost, making sites easier to navigate and more visually engaging. Plus, it gave interfaces a life-like quality, so they didn’t feel so flat and lifeless. It was like giving your site a little more depth without losing its cool factor. 😎

material-design

4. Long-form page design and scrolling 🔽

Recent trends in design and Conversion Rate Optimisation (CRO) have focused on grabbing users’ attention with ‘above the fold’ design. This means users don’t have to scroll past the part of the page that appears on their screen when they land on it to understand what the rest of the page is about.

While this doesn’t mean that it’s thrown out the window, research has shown that user engagement is sustained over increasingly longer pages. Users are increasingly less psyched to navigate multiple pages of a site. 📉

So, webmasters and developers started making their dreams come true by fitting more content onto a single page.

Naturally, designers had to adapt or risk being left behind. Long scrolling, however, opened up new opportunities for better storytelling and more intuitive interactions, creating a smoother experience for users. 💡

5. Broken grid layouts 🛠️

So, just like flat design, grid layouts were all the rage around the same time as flat, minimalist design in 2017. But designers started moving away from the usual grid styles, and one way they did this was with broken grid layouts. 🙌

Broken grid layouts were tricky to pull off. They shook up the structure of a site, making it tough to create a design that still met user expectations. But when done right, this approach led to beautifully symmetrical, minimalist designs that kept things fresh and far from boring.

As with any design trend, it was super important to make sure it fit your brand. Broken grids might not have worked for RTOs or tradies, but if you were an innovator, startup, or just a business that loved thinking outside the box, this trend was a game-changer. Broken grid layouts communicated that sense of fluidity and innovation that really spoke to these types of businesses. 🌟

broken-grid

6. Strong visuals over text 📸

They used to say a picture is worth a thousand words, right? Well, it turns out a picture is just a picture, and words are, well, words. The reality is, users respond differently to various ways of communication. So, if designers were relying too much on either images or text, they were missing the mark.

Images were always great for conveying messages easily and were crucial in web design. 💡 While strong copy was important, pairing it with powerful visuals allowed designers to hit multiple goals at once—killing two (or even three) birds with one stone. 🏹

Increasingly, designers are relying on high-quality static imagery over carousels and rotating banners because:

a) Users just weren’t clicking on carousels (true story) 👎
b) They’re really rubbish for SEO 📉

Of course, while images were amazing, they could mess with SEO if alt text and titles weren’t set properly. Designers who were on top of the design trends in 2017 knew how to ensure those images were relevant to the content, which helped keep SEO in check. ✨

strong-visual

7. Storytelling 📖

Consumers were increasingly (and still are!) drawn to businesses that let them connect with the story behind the brand. It’s all about businesses trying to connect with customers on a more personal, human level.

By 2017, web design was starting to embrace this “narrative-driven” approach to B2C relationships. The best websites used graphics and text to take users on interactive brand journeys—like a digital adventure. 🌍

This trend added some serious depth and authenticity to the stories businesses wanted to tell. It wasn’t just fluff, it was the real deal. 💯

It also fit perfectly with the rise of long-scroll and long-form content, combined with responsive design, which helped businesses reach users in many different ways, all through one dynamic portal—their website. 🌐

storytelling

8. Rich animations 🎬

Last, but certainly not least, rich animations are another way that designers can engage with users and prospects. Early on in web design, animations were over-used and to ill affect, often nauseatingly. In the early days of web design, animations were kind of… overdone. Remember those spinning texts or obnoxious fade-ins? Cue dramatic fake vomit sound 🤢

Thankfully, we’ve all learned from our past mistakes. Now, designers use animations more thoughtfully — like to fill those dreaded load times or create cool hover effects to spice things up a bit. When done right, animations can grab attention and bring a fun touch to the user experience. But like any good spice, moderation is key. You don’t want to distract from the overall vibe of the site.  Here are a couple of sites we are particularly fond of: aquatilis.tvcappen.com and benoitchalland.com.

rich-animations

2017 shaped the way we design the web today 🧩

Looking back at 2017, it’s clear that it was a turning point in web design. From bold colours to storytelling, the trends that gained momentum that year didn’t just capture our attention—they laid the foundation for how we build websites today. 🚀

2017 taught us one important lesson: balance is key. Whether it was the perfect combination of visuals and text, or using animations that added flair. it was all about creating sites that looked great and worked together to create a great user experience.

Here’s how 2017 shaped the way we design the web today:

  • Mobile-first design became essential—no more squeezing desktop layouts onto small screens. 📱
  • Bold colours & strong visuals made websites stand out and leave a lasting impression. 🎨
  • Storytelling became central—websites transformed into journeys, not just static pages. 📖
  • Animations got a refresh—no more spinning text or fade-ins, just smooth, engaging effects. 🎬
  • Long-scroll layouts started to dominate—users embraced scrolling, and brands used it to tell more compelling stories. 🔽
  • Broken grids broke the norm—creative layouts that gave sites a fresh, innovative look. 💡

Fast forward to today, and these trends are still guiding the digital world. Mobile-first? Check. Bold visuals? Absolutely. And storytelling? It’s now the secret to connecting with users on a deeper level. So, while the trends of 2017 might feel like a distant memory, their influence on the digital landscape is very much alive and well. 🌟

 

Benjamin Maynard
AUTHOR

Benjamin Maynard

Creative Director

Benjamin Maynard is our Creative Director with 25 years of experience in design, UI/UX, eCommerce, copywriting, and digital marketing. With insights into a diverse range of industries, Benjamin has completed strategy and design projects for companies like MTV, Seagate, SAP, and eBay.

chat icon

Ready to chat with us?

google icon
5 stars

155+ 5-star reviews