Considering a New Site Design? Here are 6 Web Design Trends for 2020 (Part 2)

A couple months ago, we discussed the importance of websites and how often you should update them. In that same article, we highlighted six compelling design trends for the current year to inspire those of you who are looking to revamp your website with a new design. Perhaps none of those trends spoke to you or you are looking for something else to add to the mix to create a little more visual interest? Well, good news! We have more exciting design trends to share with you! One of these six trends just might inspire the look of your new website!

Minimalism has been a classic design trend for decades, but in recent years, web designers seem to be using minimalism more and more, with many modern websites featuring pared-down content, simple menus, and large areas of negative space. Minimalist Menus are at the forefront of this trend, as simple hamburger menus appear on an increasing number of websites. These hamburger menus, when clicked on, open hidden menus, saving space and lending to an overall cleaner design. Some sites take this even further, removing the traditional menu altogether by simplifying the site content to fit on one short, continuous, scrolling page.

The reason minimalism has been favored so much is that the simplicity of the design leads to an overall better user experience. By decreasing the menu items and creating a simple design with only necessary content, it becomes easier for users to find what they are looking for on the website without distractions. Users can think less about how to navigate the site and fully engage with the site’s content instead.

Newton Vineyards’ website features a very minimal look, especially when it comes to the menu. Above the fold, the landing screen features a simple, but elegant, full-screen video highlighting the landscape of the vineyards. Three simple icons overlay the video. One opens the hidden menu, one links to a login page, and one links to the shopping cart page. The hidden menu itself is simplified with only six main menu items and five sub-menu items listed on a black background that takes up the whole screen, leaving quite a bit of white space. Other less important page links are listed in the footer of the page, but the number of footer links are limited as well. This pared-down menu makes the site easily navigable.

Already a pretty common feature on mobile devices and mobile apps, dark mode has begun to inspire website designs as well. Dark color themes, often combined with glowing neon accent elements, have become more and more popular due to their practical benefits as well as the modern and sleek aesthetic they bring to the table. The overall dark look of the site allows for bright accent colors to pop off the page and for high contrast typography to be easily read. Your users will experience less strain on their eyes and their devices will have increased battery life with this trend. However, you should be careful to not compromise your branding when utilizing this trend.

The Apple webpage for Airpods Pro employs a dark mode inspired design for the majority of the page. The black background and white text are in high contrast, making content easy to read. There are a few areas where Apple utilizes bright greens to call out important information and bright blues to call the user to action. Additionally, the dark aesthetic allows the white-colored product images to draw immediate attention. The overall aesthetic and color scheme creates a clean and modern feel.

Layering elements over each other is another popular trend in web design currently. By overlapping images, text, icons, or boxes over other images, color blocks, or backgrounds, designers add depth to the 2D screens. In fact, adding soft shadows behind layered or floating elements can enhance this depth, creating a pseudo-3D effect. By creating this effect, you can draw users’ attention to specific elements, creating a visual interest towards certain content and information.

While this trend can create beautiful and attention-grabbing layouts, you need to be careful in order to make the design effective. Overuse of layering can make the layout look muddied and cluttered, leading users to be more easily distracted as they don’t know where they should focus their attention. Make sure to use white space to keep floating elements spaced out and not too jumbled. You should also pay attention to choosing the right overlaying element and supporting elements to create the right balance and level of contrast. Additionally, establishing a visual hierarchy by ensuring that the most important elements are bigger and more prominent can help to retain organization and legibility. If done right, layered elements ultimately help to guide your users’ focus around the page and keep them engaged in your site’s content.

The website for Curt Thompson MD features a few different elements that have been layered simply. The first layered element, the looping video, appears above the fold, with the bottom of the video container partially overlapping the turquoise-colored block. This first element serves to split the top of the page and then lead your eyes down to the short section about Dr. Curt Thompson. Our eyes are then drawn to the image of the doctor that overlaps the bottom of the turquoise-colored block. The last layered elements on the home page of this site are the “Speaking Event” tiles that overlay the looping video of Dr. Thompson speaking at various events. The way these tiles rest just over the video, combined with the motion from the video itself, makes your focus rest on this section longer than if the tiles were just stacked below an image with padding separating them.

Another interesting trend from this year is split content layouts, which involves splitting the screen down the middle with content on one half and different content on the other half. This design layout can help easily express more than one idea in an organized way. Split content layouts may be used to feature two different images, to set up an image on one half with the text on the other half, or to compare two different items and make users choose between the two items.

It’s easy to make this trend your own by making the two halves behave differently on scroll, by creating asymmetrical splits, or by integrating layered elements over the split (which can also help tie the two split halves together when the overlapping element is placed at the center where the two halves meet). While this layout gives your website a visually interesting look, it also works great responsively, as the halves can stack as screen sizes get smaller, allowing you to never lose content.

The Get 2 Know Noke site, a tourist website for the Roanoke area in Virginia, shows off with its smart split content layout above the fold. In this case, the split is used to emphasize the contrast between two classic competing ideas: you can work in Roanoke and you can play in Roanoke. This invites you to choose between “Work” and “Play” to learn more about the area within the scope of one of the options.

Since the end of 2018, more and more websites have begun to include chat bots. Typically, these sites have an icon/button in the bottom right-hand corner or the site, which opens a small pop-up window containing the bot once clicked. These bots allow users to get immediate answers to questions that they have, helping to improve overall customer service and save your business some time. One concern with chat features in the past has been not having a staff member available to chat when needed, which defeats the purpose of the chat feature. However, chat bots today can often be programmed to answer the most common anticipated questions. If a customer asks a question that the bot does not know the answer to, the bot can also be programmed to provide contact information for your business.

Nebraska Furniture Mart’s website features a chat bot in the bottom right hand corner. This allows them to help answer online customers’ questions quickly!

Over the last few years, more and more people have been using their mobile devices to search the web. With this change in consumer behavior, it is still very important to take into consideration mobile responsiveness when creating a new website. If your site is responsive, it should change to fit the screen it is displayed on, regardless of the type of device visitors may be using, whether that be a desktop monitor, laptop, tablet, or mobile phone. You also should ensure that content doesn’t get lost when switching from desktop screens to mobile screens, even if at times it seems like just hiding certain content for mobile devices would be easier. The most important thing to consider when determining whether your site is truly mobile friendly is whether or not users are getting the same experience from your site even when using different devices. If they are not getting the same experience, it may be time to redesign your site with mobile in mind.

Adding some of these trends, along with any of the other six trends we touched on earlier this year, to your site can give it a current look and help your company stay relevant in the eyes of consumers. Remember that many of these trends can be combined or integrated together into one site. However, you must be careful not to make your site too busy, as that can overwhelm your users and lead to a higher bounce rate. Don’t forget that even though these design trends may benefit your company’s website and make the overall aesthetic of the site more modern, the most important thing at the end of the day is that you create a site that can grab and keep the attention of visitors and is user-friendly, working as a well-functioning tool for your potential and current customers.

About Automated Systems, Inc.
Since 1981, Automated Systems, Inc. has been a leader in providing innovative core banking, digital banking, and data processing solutions to community banks nationwide.  An array of integrated applications provide partnered banks with tailored, cost-effective, competitive choices.  ASI delivers industry-leading technology backed by unparalleled in-house conversion, training and support teams; paving the way for progressive, top-notch customer service.  ASI corporate headquarters are located at 1201 Libra Drive, Lincoln, NE 68512, 1.800.279.7312.  For more information about banking solutions from ASI, visit www.asiweb.com.

About Insite Data Services
IDS data application hosting services combines secure and cost-effective core banking applications, enterprise-class servers and storage, and proven virtualization technology.  IDS hosts all of the bank’s servers in secure data centers that use state of the art security systems including identity verification and biometric scanning.  Insite Data Services also offers IDS On-Time, a full-service solution dedicated to back-office bank processing.  These operations experts allow partnered banks to focus on their most important asset, their customers.  For more information visit www.insitedataservices.com.