The Biggest Web Design Trends of 2023

The Biggest Web Design Trends of 2023

1. Experimental Navigation

What we like: Experimental navigation can help engage and guide visitors to browse the site in a particular way. 

Experimental navigation refers to navigation patterns that subvert the traditional pattern (all caps navigation across the top of the screen with sans serif typography). These experimental patterns can help create interest and guide users to move around the site in a specific way. 

Take Kim Kneipp’s portfolio site for example. If you click the Menu button in the right corner of the homepage, a menu slides in from the bottom of the screen that looks like the table of contents in a book. Each page is numbered to suggest an order of reading. On the right, the projects are also numbered and categorized by type and color. 

web design trends: Experimental navigation of Kim Kneipp's portfolio site looks like a table of contents in a book

2. Scrolling Effects

What we like: Scrolling effects can stimulate visitors and encourage them to keep scrolling. 

Scrolling effects — animations that are triggered by scroll action — can create more dynamic web experiences. These are increasingly used on interactive websites to intrigue readers to keep scrolling, signify a break in content, and create a three-dimensional experience. 

Engineered Floors does just that using a combination of horizontal and vertical scrolling and other effects. For example, when the user lands on the homepage, they see an image of what appears to be a chair on the right. As the user scrolls, this image zooms out to reveal a living room, which is gradually covered in carpet. This 3D experience is delightful and informative. 

web design trends: Engineered Floors employs unique scrolling effects like a carpet rolling out to create a 3d experience

3. Kinetic Typography

What we like: Kinetic typography can delight visitors and help them digest your content. 

Kinetic typography — or moving text — is an animation technique that’s been around since the 60s when feature films began using animated opening titles. It can used for a similar purpose in website design to immediately grab the visitor’s attention once they land on the homepage.

It can also be used to highlight important sections, guide the visitor as they scroll, and gradually reveal information, like on Arcadia

web design trends: Arcadia uses kinetic typography to gradually inform visitors of its mission and services

4. Drag Interaction

What we like: Drag interaction can provide users with a sense of control over their experience. 

Drag interactions are designed to mimic an actual, physical action. They essentially allow website visitors to pick up and move objects on the screen. This type of gesture interaction is being implemented on more websites, and ecommerce and portfolio sites in particular. 

Take Robin Mastromarino’s portfolio site as an example. In addition to clicking on the controls of the homepage slider, you can drag and drop the different slides to browse his featured projects. The page transitions and animations are based on the drag speed to provide users with a sense of control over these effects.web design trends: Robin Mastromarino's portfolio site uses drag interactions for visitors to explore his featured projects

5. Retro Typography

What we like: Retro typography can inspire a sense of nostalgia and sentimentality in website visitors.  

More and more companies are using big, bold typography with a retro feel to headline their homepages. This style works best for a short word, with the rest of the page kept minimal and clean.

This is part of a larger trend labeled “Neue Nouveau.” In its 2022 Type Trends Report, the foundry and technology company Monotype describes Neue Nouveau as a twist on the Art Nouveau movement, which was characterized by decorative designs, embellished stroke endings, and diagonal and triangular character shapes. We can see some of these same characteristics — like organic forms and flourishes — in typography today, according to the report.

Here’s an example from French restaurant Picky Joe. The psychedelic-looking headline matches the retro interior of the restaurant as seen in the image on the right. 

web design trends: Picky Joe uses retro typography to establish a similar vibe of the restaurant

Leave a Reply

Your email address will not be published. Required fields are marked *