by Brand Breed
Normally when we think of websites, we imagine a navigation bar with links to various pages. Whilst this has been a norm for most websites, some websites really don’t need it. You will have most probably landed on a website for a mobile app which is basically a single page web design with some info on the app & download buttons for a variety of app stores. Not only are single page websites perfect for apps but they can be also used for single product websites, portfolio websites & company info pages.
Whilst these pages can be very effective for converting customers, design is key to the success of your single page website. I’m going to run through trends, tips & advice on one-page websites and how they can help convert your visitors into customers.
On a single page website, as there are no other pages to link to, you may wonder how a navigation bar can work? Well all websites should have a navigation to help direct users to the info they need as quickly as possible.
A scrolling navigation bar is the most common type of navigation on a one-page site. Basically, when a user clicks a link on your nav bar, the page scrolls down to the section of the website with the relevant info. There are a variety of different tricks you can do with a scrolling navigation such as altering the speed of the scroll, having a page flip effect and smooth scrolling.
What does above the fold mean? Basically, imagine a leaflet, the first page of the leaflet is the top section of your website and the unfolded page is the bottom of your website.
So, when I talk about an above the fold CTA I’m talking about a call to action that fills the screen above the rest of the content. These are used very often on one-page websites to display an important message, newsletter subscription, offer or announcement. These work well to display a certain message as it’s the first thing users see when they land on your website.
When having an above the fold CTA I would advise displaying a down arrow under the content which will scroll down the content / nav bar on the rest of the page.
Having scrolling animations on a one-page website is a great way to engage your customers and stand out from your competition. Scrolling animations work by having moving images sliding from different directions as users scroll down your page. There are so many effects that can work well when it comes to animations.
Having scrolling animations work best when you have very little content on the page. This obviously isn’t the best for SEO but depending on your websites needs, you may not need your website ranking well. This would be the case for a website that has visitors from a QR code for example, or direct traffic such as visitors visiting from a business card or flyer you have distributed.
Too many animations can become confusing and messy, so I always advise on just having a few to make your website a little more exciting.
Parallax may be a word you have heard before but not quite sure what it means?
Parallax is a name for images moving in different speeds, like how old school computer game used to work with the character moving along with the background. With parallax you can create great visual effects with layers of images, text, icons etc. Moving at different speeds when scrolling or stationary.
With parallax you can create 3D style banners giving depth to your page and catching your users eye. Any page that is eye catching is a high converting page and that is what you want your website to do.
All the above trends I have noted are a great way to create eye catching, converting single page websites. When starting a one-page website you should always plan your sections, call to actions & animations.
Even though many websites use one-page designs they do also have they’re downfalls. SEO is a big factor that suffers due to thin content on your website, single tags and just the one URL to link to. Also, animations & graphics can greatly reduce load time if your scripts aren’t optimised for page speed.
If you do choose to go down the route of a one-page website, ensure your website is engaging, tells a story & emphasize your call to actions.