Website Trends That Stand the Test of Time
Each year, thousands of “website trends” posts come out featuring the latest and greatest fads in digital design. Like fashion, website “trends” come and go. Many of them, flashes in the pan.
This article covers some of this year’s hottest website design trends, as well as the underlying currents to keep an eye on moving forward.
Recently, there’s been a lot of discussion around the lack of ethics in product and website design. How so? Many of today’s products and apps are created to capture attention, increase usage and encourage digital addiction. These tactics have resulted in a spike in anxiety, depression, social anxiety, device addiction and suicides among today’s teenagers.
Designer in residence at IBM Design, Lara Hanlon, suggests “Small steps to consider the moral repercussions of one’s work might lead to more humane outcomes.” Hanlon is among a growing number of people voicing concern that Silicon Valley’s startup culture of “move fast and break things” encourages speed and innovation over mindfulness.
Moving forward, we hope to see a push towards ethical, mindful design, where designers take the time to explore the potentially dangerous unintended consequences.
Related: Check out our previous post, Predictive Design’s role in Fostering Political Polarization.
2017 was a record year for eCommerce, and we expect this trend to continue in the foreseeable future. Advancements in the eCommerce space come at a break-neck pace, meaning powerful tools and UI solutions that were previously only available to international brands are now being used by small businesses.
With more payment options, increased security and perks like free shipping and free returns becoming commonplace, customers seem willing and eager to change their shopping behaviours. We anticipate seeing fewer bricks and mortar stores as brands scale back their physical channels and invest more in their online presence.
Many aren’t aware that the digital world has a very real environmental footprint. Did you know that the Internet uses about 10% of the world’s energy? And, with internet usage on the rise, environmental advocates are calling on server farms to reduce carbon emissions by switching to renewable power.
Website Designers and Developers can help by producing clean and efficient websites that serve relevant content quickly. This reduction in server load, paired with a transition to renewable energy will result in people-friendly websites and reduce the web’s impact on the environment – a win-win.
Voice User Interfaces
Though voice recognition technology has been commonplace for years, increasingly smaller screens and the wide adoption of smart speakers like Alexa and Google Home have brought voice user interfaces back to the forefront. As more users begin to use voice experiences to complete everyday tasks, website and product designers are exploring new ways to incorporate voice commands into their online experience.
We expect more websites and products to offer voice recognition capabilities moving forward. Additionally, with new translation tech like these Google headphones that translate in real-time, we expect it won’t be long before we’re able to use voice recognition on websites in other languages.
Colour Contrast + Saturation
One of this year’s biggest web design trends is the implementation of start colour contrast. Apart from the fact that it just looks cool, having a highly diverse colour pallet is beneficial for other reasons: it helps differentiate key parts of your website, influences emotions and makes your website more usable for the impaired.
Where in the past, designers were limited to web-safe colours, advances in screen and display technology are allowing designers to be courageous in their approach to colour. We expect to see a lot of supersaturation, vibrant shades, paired with slashes and hard angles.
Particle Backgrounds Replacing Video
Video backgrounds have been web design staple for the last few years. There’s no denying that video is a powerful tool for storytelling. That said, the downside to video is that it increases page load time, affecting usability, SEO, and generally making for bad user experience.
Enter stage left, “Particle backgrounds”. This alternative to video achieves everything a video can for your website, without the extra baggage. They take less time to load and keep your website light and are ideal for social media and landing pages.
If you’ve sacrificed video on your site previously, particle backgrounds may be the way to go.
Not surprisingly, mobile continues to make gains and now accounts for more than desktop browsing. Anything you can do on your desktop, you can just as well do on your smartphone. As mobile usage increases, designers are finding new creative ways to optimize sites for smaller screens. From hand gestures to image compression and animation, we expect to see mobile experience continuing to improve as new solutions to old (and new) problems gain traction, and mobile devices continue to evolve.
The Evolution of AI + Human-like Chat Experience
Whether you view AI as the saviour of humanity, or it’s demise, there’s no denying that artificial intelligence is advancing at an alarming pace. Chatbots are becoming scarily human, decreasing the need for human online support. New products, like Facebook’s Chatbot, are empowering smaller to help users through sections of a website or answer specific questions about a product or service. This augmented user experience can be the answer to the lack of human touch to the online shopping experience.
Research advisory firm, Gartner, predicts that chatbots will handle over 85% of consumer correspondence by 2020.
Illustrations are a great way to inject playful, approachable, interactive media into your website–especially if your brand is perceived as serious or rigid. As markets become saturated and competition increases, personalized illustrations will increasingly be used to differentiate brands from competitors and engage users.
Bold, Creative Typography
It’s clear 2018 is the year font fanatics have been fighting for. Large, contrasting serif and sans serif headings leverage fancy momentum scrolls and help create dynamic parallels. This year, we’re also seeing how large fonts are being used for way-finding; moving users intuitively through a website’s content.
With device resolution ever-improving, we expect to see an increase in custom fonts. Aside from IE (which really shouldn’t even count), all browsers now support custom typefaces enabled by CSS.
Asymmetry + Broken Grid Layouts
Many brands are abandoning typical grid systems and experimenting with creative Asymmetrical layouts. While designers may have shied away from asymmetrical designs in the past, they are discovering that balance is key to unleashing the full benefit of asymmetry. Some quick tips in implementing a successful asymmetrical website design:
- Focus on balance so that no one part of the project is too heavy for the rest
- Create emphasis with motion
- Add focus with colour
- Using a grid for alignment and organization
- Consider wayfinding cues in instances where users may not be familiar with how to navigate your website’s content.
While asymmetrical websites are on the rise, conversion-focused and eCommerce websites should be cautious not to stray too far from what users are familiar with.
Faster connections and devices are bringing website animation to the mainstream. Additionally, advances in design tools have made animations far easier to create than in the past. As a result, brands are exploring how animations can create more delightful website interactions, such as hover effects, transitions, page loading, etc. Smart website designers are using these animated user interactions to pull users into a brand’s story in new compelling ways.
The key to using animations successfully is knowing when to use them. With animations, less is more. Simple animations, when leveraged properly can guide the user through the website without being distracting or getting in the way of content.
Dynamic Gradients Make a Comeback
The move away from web-safe colours has yielded some interesting dynamic colour gradients in web design. Filters over images, across text, in logos, hero image backgrounds and mobile menu backgrounds are a few of the most common places we’ve witnessed gradients being used.
Gradients are a fun way to communicate your brand personality without creating visual clutter.
Pro tip: Using gradient backgrounds is a simple yet trendy way to design your website if you have a limited number of images to work with.
What Design Trends Are You Watching?
Did we miss something? Tell us on social (@engagemassive) about which website design trends you’re excited about in 2018 and beyond. Looking for more inspiration, check out these tech websites doing it right.