Posted at Apr 26, 2019 8:20:00 AM by thatagency | Share
Modern websites need to use modern website design. It's easy for your site to get lost in the thousands of other sites that may look just like it. This means being selective, though. Choosing every new trend would make things look like a mess. Each design feature has its own strengths and makes a customer or client look at your site in a new and different way.
1. Scrolling Techniques
You scroll up, you scroll down. Since the dawn of the internet, this has been the tried and true rule. With more devices than ever featuring touch elements, it makes sense for scrolling to catch up. Sites can easily communicate different scrolling features, such as scrolling sideways. This immediately marks your site as different and takes better advantage of how people use their devices.
2. Triggered Animations
New scrolling techniques are paired well with triggered animations. In other words, you're not scrolling to a new static page, but rather into an animation. This can help guide the eye toward important information contained within quality visuals. It's unpredictable, which keeps a visitor's attention engaged.
3. Large Text
This is especially important as mobile devices are out-pacing the use of computers. Larger text is easier on the eyes. It also forces you to simplify certain messages. This captures attention. Larger text also allows the visuals behind them to be more complex: including video and animations. This may be modern trend online, but if you think about how TV commercials have employed large text and simplified messages, it's actually a proven strategy that's only now becoming more useful online.
4. Use Gradients
One of the older rules of graphic design is eyeline. Images that feature people or characters should often incorporate eyes looking and hands gesturing to the next element of the page you want a visitor to read. This creates a natural flow between image and text, but sometimes it's obvious and it shouldn't be overused. Gradients work much the same way. By featuring gradient color-shifts across a page, you can guide the eye so that reading information and being guided through text feels more natural and comfortable.
5. Asymmetric Visuals
Asymmetric visuals take advantage of negative space on the screen. By incorporating negative space in a certain area, you can highlight important information in a concise and visually appealing way. Doing so symmetrically risks a page appearing boring, predictable, or like an advertisement. Doing so asymmetrically (within reason) encourages someone's attention. Combining features like negative space, gradients, asymmetry, and slightly diagonal presentation makes information feel urgent.
6. Rotating Elements
It's too easy for websites to come across as boring and uneventful these days. Modern websites need to take advantage of modern abilities. When you rotate certain elements – such as animations or intro screens – it means that someone sees your business introduced in different ways every time they visit. There needs to be consistent elements so that they know they're in the right place, but incorporating certain elements that will be different with every visit helps keep those visits fresh.
7. Bottom Up Design
Most menus are located at the top of the page. Some businesses are savvy enough to incorporate menus located at the side, or that pop-in when mousing over to the side. These are especially useful with widescreen monitors and mobile devices in landscape mode. One modern website design element that can set you apart is locating the menu at the bottom. This prioritizes the visuals and information higher up, and also provides a level of comfort – most devices still put menus at the bottom of the screen, so people are actually more comfortable navigating this way.
8. Three-Dimensional Looks
You don't have to go full VR to give your website a sense of depth and scale. Simple effects can lend two-dimensional objects the impression of having depth. Creating visual layers, as if certain objects are foregrounded and others backgrounded, also provides depth. These effects are employ simple design touches that make customers feel more comfortable.
9. Interactive Features
Interactive features of high quality can impress a customer. They're often presented in the forms of graphs or maps, and they convey information that's either useful or interesting to a customer. They pair especially well with content creation. Perhaps it's the history of an industry or how a certain technology or product has spread around the world over time. These features are deeply engaging and contain the type of information that helps a customer trust the knowledge a brand communicates.
10. Color Schemes
Perhaps there's a product that some customers are big fans of. It's associated with a certain color scheme. You can create a color scheme built toward celebrating their enjoyment of this product. Other customers might get a color scheme that's different based on what they've purchased or visited before. Enabling customers to change color schemes can help them customize the site's presentation the way they like it. You'll want to limit the color schemes to pages that you've tested in each scheme for presentation and readability.
One very popular (and very underused) feature is using a night mode for customers who may be browsing just before bedtime. Rather than dark text on a bright background, this can switch to brighter text on a darker background, helping save eye strain and making your site more comfortable to browse at night. Being able to customize your website even in small ways like this makes a visitor feel invested in it and more likely to return.
The most experimental and hardest to pull off was saved for last. Abstract designs should be rooted in a core visual element. Abstract shapes can employ gradients to set them apart, or they should foreground large text so that the leading messages you want to communicate don't get lost.
Abstract menu design can feature a different menu option at every corner of the screen, but they have to be obvious – even on phone screens. If you employ this, you can have the next page scroll in from that particular corner, complete with animations.
You see how all of the elements here can be combined and blended together to create unique and memorable visitor experiences. When combining elements, always have a list that prioritizes each from most to least important. This sustains a core visual design across the entire website, and if things ever get too busy, you know which element should be cut first. Remember, the key is to convert searches into clicks, exploration into purchases. Be disciplined with how you employ these modern website design features and you'll get there quickly.