The World Wide Web is constantly branching out into countless sub-categories and niche genres within the field of design. Websites can vary from the experimental, aimed at conveying elusive feelings, to the informative – where every element on page partakes in elaborate storytelling. Whichever the case, visuals in web design today are no longer a means to serve a higher concept or message. Instead, the design of the page is used in creating an all-embracing experience. With new forms of navigation, layouts and usages of type, cyberspace is taking us on a journey, with a little help from these major web design trends:

1. Reshaping the menu

The hamburger menu, with its three horizontal stripes, took the Internet by storm due to the very little space it occupies on mobile web design compared to the traditional navigation bar. Yet after becoming almost synonymous with menus, the hamburger icon is no longer the only way to go. Menus are currently taking a step further in design, to be used for more than mere navigational purposes. They are now all about setting a mood and telling a story. For that reason, fullscreen menus infuse our browsers with special effects or huge typography. Alternatively, other forms of menus break up into all four corners of the screen, making use of as much of the webpage as possible. Many websites are now mixing up various forms of non-conventional navigation, allowing for unique and unexpected browsing experiences.

Vincent Tavano‘s portfolio website.

Sara Marandi‘s portfolio website.

2. Split-screen layout

Websites are in search of interesting new ways with which to diversify the rectangular format dictated by our screens. One such way is by splitting the format into two parts – whether equal or unequal. The resulting look brings to mind a magazine spread, with two adjacent compositions that together, form a whole. Only that once brought to the screen, this same layout comes to life with interactive interpretations such as asymmetrical scrolling, motion and more.

Artist Thomas De Monaco‘s portfolio website.

Artist David Edwards‘ website, A Magnet as Well as a Gun.

3. Exposed grids

The field of design is growing more introspective of its own work process. With anything from sharing work-in-progress pics on social media to building elaborate case studies, designers are now taking pride in more than just the final result. The steps leading up to the polished product are now an inherent part of the discussion, and it’s a short distance from there to becoming a part of design decisions, too. Websites are now beginning to lay bare their own building blocks, by exposing the grids that compose their layouts. This manifests in the form of lines that act as dividers, bringing to mind the orderly and systematic aesthetics of bureaucratic forms and official paperwork.

German theater group, Thalia Theater‘s website.

Canadian design studio 56‘s portfolio website.

4. Meta-computer

Another method with which website design is exposing its own mechanism is by visually referring to its own discipline – that of computers and web design. Remember the long-gone days of skeuomorphism? This new trend is arguably as far away from them as possible. Rather than realistically recreating real objects from the outside world, we’ve started to retrace the virtual objects on our screens. With pop up windows, pixels and even screensavers, we’re now finding our desktops, browsers and operating systems freshly influential. Seems like the world of cyber is now its own biggest source of inspiration.

Designer Mariano Pascual‘s portfolio website.

Tomo Qi‘s portfolio website.

Jed Mikolaites‘ portfolio website.

5. Micro-animations

While videos in web design are becoming bigger and more prominent, animations are headed in the opposite direction, turning more subtle and minor. They serve as moving eye-catchers scattered around the web page, while keeping their impact on loading time to a minimum. This kind of motion provides an added layer of interest or interactivity, luring in visitors’ attention with only the slightest of movements. Additionally, micro-animations can also serve an important message in the website’s UX. Tiny gestures of motion, such as the way an element reacts when dragged around on the page, can help convey information (such as hierarchy or action options for the user) and draw in focus to important details.

Thing of Wonder project website.

Montreal in Motion event website.

6. Extreme interactive typography

Typography is scaling up, reaching enormous proportions. Big and bold, type now plays a major role in the overall design of the webpage, and as a result is also becoming more interactive. We’re seeing a lot of scroll-based typography, animated type and hero typefaces (or in other words, typography as a hero image). While the usages of this sort of dominant typography might vary from a decorative element to a fully-legible statement, they all use text in a way that goes beyond just conveying a message. These big letterforms create an immersive experience that grabs users’ attention through type.

Portfolio website for DAD, a design and art direction agency.

Property group Parabola‘s website.

7. Playful interactions

Many websites add an interactive element to serve as an extra component in the site’s layout. These little gems behave in unexpected ways – a mouse cursor that reveals a hidden element on the webpage, for example, or big bubbles that you can drag and move around on screen. Omitting these perks would leave us with a website that’s just as well-designed and easy to understand, but having them around is a fun and engaging touch that contributes to a sense of play and discovery.

Studio Revele‘s website.

Website for the 2018 Chicago Design Week.