Marketing Masterminds
Search

5 Trends Changing Small Business Website Design

Small business website design is getting some great new design elements due to technological innovations in other business categories such as gaming, movies, and accessibility.

There are 5 trends changing small business website design now and into the future to increase engagement on your website and ultimately lead to more customers.

  1. Scrolling and Imaging layering for message awareness
  2. Kinetic Typography – animated type that becomes part of the navigation
  3. Voice-activated Interface
  4. Micro Interactions & Animations
  5. Thumb Friendly Mobile Website Layout

All of these trends are not suited for every type of small business website. Below we will go into detail about each trend and what type of small business each could be applicable for and the tools you need to implement the trend.

Scrolling and Imaging Layering For Message Awareness

Instead of using a traditional vertical scroll on your website, what if you could incorporate a horizontal scroll to make it easier to view a small portfolio of content? We have seen games use a horizontal scroll as part of navigating users down a path, and the same can be done on websites as well.

Scrolly telling is a new way to layout a website page that walks the visitor through a journey of text, imagery, and animation. This works really well when viewing a site on mobile because it allows the designer to use all of the screens in different ways to engage the user. Check out Infrared’s Website On Mobile for a great example of how this works.

If you have a small portfolio of images to share, instead of creating a scrolling gallery, consider Photo layering. This creates a beautiful design of multiple images without having to scroll.

Watch this quick video to see how all three of these trends in action on one website.

Navigate General Conditions Website Yourself

Here is by industry how these features can be added to a website

  • Trades – Multilayered photos as a work portfolio – group like images together to create inspiration boards for customers
  • Photographers – Scrolly telling with multilayer photos of how you can tell a story through images
  • Wedding Planners – Combine Horizontal Scrolling with Vertical scrolling to create a timeline of your start date to the big day
  • Financial Advisors – Horizontal scrolling and scrolly telling to show how you will be with a client through all of life’s different events.

This type of design work can be done with a WordPress website utilizing custom website template builders like Elementor or Divi. Click on the links to learn more and to get a license.

Don’t break the flow by adding forms to the page. Instead, install a Chatbot that follows the page so that visitors can interact when they are ready. We use Tidio’s Chatbot tool. It’s easy for non-technical people to implement and set up. Click on the link to learn more.

Kinetic Typography

All websites need some text to explain to visitors what the site is about and who its for. You don’t need much text because visitors like to quickly skim website pages and sometimes they can miss the important parts.

Kinetic Typography allows you to keep the small amount of copy you create engaging by making it clickable where it is and using it to slow scrolling before the user has a chance to continue. This allows you to put emphasis on the most important messages you are trying to relay.

As an example, you could place the problem your company solves in a square of text when the user clicks on it the solution is revealed next to it. Clicking isn’t always necessary to change the context of the message a simple hover-over can bring attention to a phrase or a word by making it larger or bolder with just a mouse hover. Dillinger’s website is a great example of how this can work.

Industry Examples of how this can be implemented

  • Event Venues – Draw Attention to dates, and tickets for events on a single page
  • Doctor’s Offices – Make important information like scheduling and forms standout when it needs to
  • Not For Profits Fundraisers – Draw Attention to dates, tickets for events on a single page

Voice-activated Interface

Tidio Chatbot customer service platform

Voice assistants like Siri and Alexa aren’t just for navigating your home and your phone. You can use a voice-activated interface to allow users to browse your website. If you are already using a chatbot like Tidio the capability to do this is already on your website, you just need to set it up.

The best types of sites to implement this on

  • Article and content-heavy websites like educational blogs or research sites.
  • eCommerce shopping sites – Setup your Tidio ChatBot to be a Virtual Shopping Assistant on your store. Tidio has an app for Shopify.

Micro Interactions & Animations

Motion of any kind on your website helps draw attention to what’s most important on the page. We as humans are naturally drawn to movement.

Small micro animations next to a picture or a piece of content will draw the eye so they don’t miss it when they scroll by. This could be something as simple as a glob turning or clouds moving in an image next to a title you want them to discover.

Micro Interactions provide user feedback when interacting with an icon or an image on the website. This can be used instead of changing the colors of a link to reinforce the experience they are expecting. It’s not just movement, you can replace images with words to allow for more unobtrusive content on a page.

Industries where this type of movement works best

Micro Animations
  • eCommerce – show how a product works with movement. No clicking on video required
  • Pet Service Industry – Snippets of how you clip nails instead of a full grooming video
  • Trades – Showcase technology and tools that differentiate you from competitors.

Micro animations are easy to create in Canva. Here is a video we created on how to create simple and complex micro animations for your small business website.

Thumb Friendly Mobile Website Layout

63% of website traffic is coming from smartphones and tablets (Research.com). This is one of the reasons why it’s so important to design your site for the best mobile experience. Google will rank your website higher in search if you provide a better experience on mobile.

The most important thing in mobile design is easy navigation, readable content, and appropriately sized images. The trends changing small business website design now are where you put these elements in the layout so it’s easier to interact with your thumbs.

Take a look at this chart to see where you need to put elements on the screen so that they are easily accessible with your thumb.

We are seeing that the hamburger menu used to navigate the website is often in the hard-to-reach zone or the stretch zone: the upper right corner. This is great for eye tracking but not for usability. You can improve the user experience if you put large clickable images that mirror your navigation in the body of the page as they scroll.

Installing a chatbot like Tidio can also help the user navigate to what they are looking for easily and it’s located in the natural path of the thumb on the screen. Mobile is a great place to introduce the voice interactive interface in Tidio as well since many people are turning to voice commands over typing on the tiny keyboard on a phone.

Elementor

If you use WordPress to build your website, instead of buying a template, purchase a template builder like Elementor or Divi. These template builders allow you to edit the mobile, desktop, and tablet versions of your site independently providing the best user experience no matter where your site is being viewed.

Implementing The Trends Changing Small Business Website Design

Many of the trends changing small business website design need to be implemented when you are building or rebuilding your website. The tools you use to build your website will dictate what features you can include. Here is the toolset you will need by trend

Scrolling and Imaging LayeringElementor or Divi on a WordPress Website.
Hosting on a WordPress-only hosting platform like FlyWheel.
Kinetic Typography Elementor or Divi on a WordPress Website.
Hosting on a WordPress-only hosting platform like FlyWheel.
Voice-Activated InterfaceTidio Chatbot that supports voice commands.
Micro-interactions and AnimationsElementor or Divi on a WordPress Website.
Canva or Adobe XD to create animations
Thumb-Friendly Website LayoutElementor or Divi on a WordPress Website.

I hope you found this article helpful in securing your business so you can stay focused on your growth goal, which always includes marketing. You can get more website design ideas in our article Top 7 Website Design Ideas For Small Business In 2022. Feel free to reach out via chat if you have any questions. We are always happy to answer questions. If you want our content delivered to your inbox, Sign up for our newsletter. You get great content and exclusive offers by being a member.

If you like this article, consider sharing it with other business owners you know.  Use the sharing links below.

Share This Blog Post

More Posts