At the beginning of each year, Design Shack does summary of trends it is likely to affect the design landscape for the coming year.
Now that we’re in mid-2021 (can you believe it?), It’s time to look at which of these trends are booming and which ones you can ignore.
Here we look at some recent examples of trends that are still inspired in your projects.
8 Web design trends that are still strong
top trends We expected the 2021 rule to have been a mixed bag so far. But some of these website design trends have shown real contagion and started to rise in popularity before this year.
One of the common themes seems to be that typography trends are not changing as fast as some other design elements.
Light / Dark mode Switch
The ability to switch between light and dark spaces is now more popular than ever. Users expect the feature quickly, and developers are pushing plug-ins and browser extensions that do a lot of heavy lifting for you.
But what makes a light space the most impressive of a dark space are the small details. Notice in the example above how Ryan Feigenbaum doesn’t just change the color of the background and text. The entire palette changes based on the selected color space to account for optimal contrast and readability.
This kind of work can really differentiate between light and dark space design.
Modern split screen
Modern split screens offer two options for interaction or sometimes faux interactive elements. The appeal of this design model is that it can attract more audiences, allow visitors to “create their own journey” and help you keep track of which elements of your website are most interesting.
The design element works by creating yin and yang effects that force the eye across the screen from one element to another and encourage you to choose one and grab it.
Experimental font is a term you didn’t hear much about before 2020, and now these fun, funky styles are everywhere. (Who needs a Google font when you can have something completely customized?)
The most important feature of experimental fonts is that they feel unique in design. Notice how close the font corresponds to the futuristic feeling of Ballistic Moon in the example above. The clear integration of the experimental font with the content makes this design trend really great.
Typography that includes fillings and outlines
Fillings and outlines with text elements can add highlights and highlight keywords or phrases to act as a navigation and information tool.
The World Triathlon does this beautifully by scrolling through three images and using the words “swim,” “bike,” and “run,” which are highlighted when the corresponding photo is on display.
Remember that when you use outlines and fills, words in filled letters almost always have more weight and weight than words that don’t. Outlined text can easily fade into the background and get lost in the design if you are not careful.
So many sets
The popularity and use of serif typography continues to grow.
Kits for almost any style can work beautifully, including modern and transition styles for tiles. The kits are suitable for display text as well as text copying and work with large and small combinations or all caps.
Give the serif font even more meaning by combining it with simple sans serifs. The contrast between the font styles makes the interesting serif stand out.
Switching from full screen video is a microanimation. With smaller, more subtle movements, micro-animations can add a sense of style or usability to a design.
Think of these little moves as a way to delight or help users. Small animations can work on almost any type of template, from the heroic area of the home page to display product selections on an ecommerce website.
The trick of micro-animations is simplicity and natural movement so that they do not interfere with what the website user is trying to do or block the site.
Moving on from the large logos that filled the center of the hero image, there are smaller, more streamlined logos that get out of the way of overall design. For the most part, these smaller logos are icon-sized and often hidden in the corners of the page.
A streamlined logo can contain a color or graphic element, or be a type plate that is almost plain text, simply identifying the brand or company to which the website belongs.
The popularity of large buttons is constantly growing because they are so easy to use. While some large buttons look kind of awkward on desktop screens, they can work beautifully on smaller devices (especially mobile devices).
The trick is often small CSS to make large buttons look intentional on large screens.
Hudon Gavin Martin does this in the example above with floating modes that turn the three stacked buttons on the right from muted color squares to fully saturated color frames. (It’s a bit like changing from light to dark.)
8 trends that have cheered up
The trend, which started strong a few years ago, has begun to fade. It’s an interesting thing about trends to keep track of what’s coming and going!
Here are website design trends that may still have some impact, but which no longer seem to be evolving or appearing as often as in new projects.
- Elements outside the screen
- Overlapping design elements
- Very minimal aesthetics
- Interesting scroll patterns
- Exaggerated space
- Video all
- Bubbles and blob shapes
- Tips on artificial intelligence
3 Rising Website Design Trends
There are a few design elements that are gaining popularity. We need to keep an eye on these website design trends as the year progresses.
The movement between the background and foreground elements is something that seems to come and go in waves. Right now, it’s back in trend with design elements that respond to mouse interaction between layered elements.
This bouncy background effect can work well on models that don’t have much other visual weight and need to help create priorities and provide users with something to interact to keep them interested in the design.
In the BOT example above, you will notice that this technique has no scrolling. The only interaction from the home page is to click the “find more” button or navigate using the navigation inside the burger menu.
Illustrations as dominant images
Illustrations and models without real photographs are a major visual concept in 2021. Perhaps it is due to the global health pandemic and the problem of how people and activities can be properly displayed in unusual times.
Combine this with budget constraints due to the pandemic environment, and it’s no real surprise that photography and video are currently in some back seat.
You expect this trend to continue until the world returns to the more normal or “new normal” business model that most people understand and accept globally.
Two CTA options
Most of the marketing materials you read don’t recommend it, but more designers create elements with two call-to-action buttons or options on one screen.
This trend offers a lot of opportunities to learn from users – which button they choose – and dive into the data and analytics of your website to continue to improve the design.
There is a risk that users may not know what choice should be made when they are offered additional options. Use the visual trick introduced in the example above: Apply the extra contrast or color to the button you want or most users expect you to select to make it easier to see and find.