When to Use a Floating Call-to-Action Button

0
77
Floating Call-to-Action Button

That’s the sound of the user’s finger scrolling through your long mobile landing page. Eventually, they’ll get flick fatigue and abandon your page if they don’t see the call-to-action button.

The user’s attention and energy are finite resources. Once it exceeds a certain point, they’ll call it quits and move on. If they can’t tap your call-to-action button when they’re ready, you could lose them as potential customers.

There’s nothing wrong with a long mobile landing page. It’s what naturally happens when you condense content to fit the width of a mobile viewport. The problem is the call-to-action button buried at the bottom of the page. When users are ready to act, it’s nowhere to be found.

Most designers assume that users scroll from the top to the bottom of the page and end their experience there. However, their scrolling behavior varies depending on the content they’re interested in. They may not always end up at the bottom of the page. Sometimes they’ll end up somewhere in the middle, which means your button needs to be visible at that moment for them to take action.

Floating Call-to-Action Button

Instead of burying your button at the bottom, use a floating call-to-action button. This type of button sticks to the top or bottom of the screen and stays with users wherever they scroll. It allows them to take action whenever they’re ready.

Long landing pages that need a floating call-to-action button are those that have more than two full-screen scrolls. Avoid using them on short pages because it can block the content viewport with no benefit for the user. Also, try not to make the button and button bar too large to prevent too much content obstruction.

Most mobile landing pages already require a lot of scrolling. There’s no reason why you should add more effort to their task by burying your call-to-action button. Keep it visible and floating so that taking action is only a finger’s reach away.