While there are many clear-cut rules for website design, our relationship with technology and how we create digital media is always in flux. New trends emerge every day, and it is important to respond to them, acknowledge their popularity, and look for ways to integrate them into existing websites. Your business’ web design is responsible for making a lasting first impression on your new visitors, and fresh layouts, alluring colours, and unique aesthetics can make all the difference for your sales and conversion rates.
Web Design Trends in 2022
This year, many website trends called us to look back in time, which might seem odd since we tend to associate technology in general with the future. But the visual aesthetics of the 1980s and 1990s made a particular comeback over the past few months, and site designers discovered ways to mesh these seemingly outdated styles with the timeless quality of the web. The resulting designs were far from the jarring “throwback” that we might expect, and funnily enough, most of these designs will actually be sticking around for a while.
As we anticipate 2023 and how website design will continue to evolve, it’s difficult to guess what new trends we might see and how they will match up with what was popular this year. However, we can be sure that designers will keep experimenting and trying new things, almost building the trends themselves. But for now, here are some innovative website design trends that broke out into the internet landscape this past year. We encourage you to use them to inspire your business and keeps things fresh for the future.
1. Retro Typography
In line with the revival of 1980s and 1990s colour palettes and style, retro typography made its way onto web pages over the past year. It inspires a sense of nostalgia in site visitors, and the big, bold lettering can emphasize your business’ long-term commitment to quality products and services through and despite the ages. Retro typography is often grouped under the broader typography trend called “Neue Nouveau,” which Monotype Imaging Inc. describes as a “retelling of the Art Nouveau typographic story with some new plot points” in their 2022 Type Trends Report.
The decorative designs, stylized serifs and strokes, and angular shapes that were characteristic of Art Nouveau at the turn of the 20th century have been revived through today’s retro website typography. The strong, curving lines give your business a chance to evoke different moods through lettering, which bridges on the psychedelic as much as the artisanal. However, like any loud or busy font, retro typography should be used sparingly for the best design impacts. Consider using it for a headline, like the New York Park Lane Hotel, but try to maintain a simpler font for the body text your user will need to examine more closely.
2. Drag Interaction
An interactive user experience is another element of web design that has been gaining traction over the past few months. Though drag interaction might not seem like much of a call back to the older Internet, inviting your site’s visitors to drag and drop objects on your page mimics physical action. It’s a playful way of capturing the interest of your user since they want to explore everything they see. Robin Mastromarino, a UX and UI designer who currently works in Paris, makes innovative use of drag interaction in his online portfolio. When users visit his site, they can drag the home page slider left and right to browse his featured projects. Depending on how quickly the user scrolls through the projects, the site also reacts to the interaction with faster or slower animations.
The fluid user experience on Mastromarino’s site might seem like a way’s away for your business, but you can incorporate drag interaction into your own site through small adjustments. Maybe your shopping cart needs to be “pulled” into the checkout, or maybe your user needs to “yank” on a light switch chain to change from light to dark mode. Creativity is at the heart of drag interaction, and your business will certainly find unique ways to integrate it into your website.
3. Animated Illustrations
Stock images have long served as the method of incorporating visuals into your website to complement copious amounts of text. They’re easy to find, inexpensive, and they don’t distract from the rest of your site. However, web designers have been shifting towards more purposeful visuals in their projects, namely by using illustrations, if not animated illustrations. Not every business can afford to hire a digital artist or illustrator in addition to a web designer, but distinctive illustrations and graphics can outshine generic lifestyle, stock photos.
Using illustrations over stock images is evidently a way to extend your business’ brand identity. If your marketing team can come up with a unique character or style of illustration, they can be used over and over again throughout your website. Your users will come to recognize your brand through such visuals, and your overall design will appear even more cohesive and thoughtful. Animation would be the next step in using these illustrations, which builds on the drag and drop interactivity discussed above. The NewActon website is one example of a site that uses animated illustrations as the core element of their navigation. The illustrations move the slightest bit when a user mouses over them, and they enlarge to fill the screen when a user clicks them.
4. Overlapping Text and Images
It’s not easy to arrange text and images on a website. There can be difficulties making everything fit properly or align with each other. Even seasoned web designers experience problems with layout. But these struggles led to another trend that strategically abandons strict grids and alignment. Overlapping text and image has become a popular way of organizing content online, especially for blogs and portfolios. When text overlaps with an image, the design can make more effective use of white space and lead the user’s eyes around the page.
With overlapping elements on a web page, the goal isn’t necessarily to make a collage of text and images. Instead, it’s a tasteful departure from the norm that can highlight colours with images, change up navigation structure, and elevate a site from ordinary to sophisticated. Thibault Pailloux, a French art director and web developer, makes particular use of overlapping elements on his portfolio website. His homepage shows his past projects with accompanying titles, and he cleverly underlines his text with key colours from the images, such as purple and magenta from a woman’s skirt or the orange and light brown from a building in the background. Pailloux’s overlapping text and images primarily work because of the white space on his page, and his portfolio parallels the sleek look of a designer magazine.
5. Creative Scrolling
The last web design trend in this blog comes back to one of the simplest actions every user performs while on a website: scrolling. Like typography, illustration, overlaps, and drag and drop elements, scrolling is a foundational part of a website that can quickly be elevated through design work. Scrolling doesn’t need to be restricted to just moving up and down a page. If a user happens to scroll down, but they end up moving the page horizontally, they will be both surprised and intrigued, leading them to keep scrolling. A dynamic website experience draws your user into the content of your site, and changing up your scrolling can transform your seemingly flat web page into a three-dimensional space.
Engineered Floors makes incredible use of creative scrolling to show visual representations of their services to visitors and provide helpful information about their company. The home page begins with the simple slogan, “Elevate your floors,” and the page shifts horizontally as the user scrolls down. A living room appears with carpet flooring, followed by another living room with hardwood, which immediately takes the user through an immersive experience and invites them to consider what their own home might look like with these services. It’s a simple but very strategic use of scrolling, and your business can similarly surprise visitors with a pan to the side of your page rather than down.
Time to Try Out These Trends for Yourself!
This blog is by no means a complete list of all the website trends your business should be using in 2022 or even in 2023. Trends emerge from creativity and experimentation, so we encourage you to play around with your layouts and try new things whenever you can. What may seem like a strange idea at first might very well be the difference in reinventing your company’s brand and identity.
If you would like to begin working on your business’ website design, maybe using these trends or using some completely new ones, reach out to an expert on the CodeMasters Inc. team. We are happy to assist at any point in the design process, and we will always be an ear to listen to whatever you think might be the next new design trend.