Is Sticky Header a Good Idea to Stick Customers?
The placement of CTA (call-to-action) buttons in landing page design can be detrimental to lead generation. Should CTA be placed on top to make sure visitors do not miss clicking? Does a CTA sticky button draw more conversion than those placed in between the page? This research unfolds the process.
🤔 Hypothesis
Based on our physical scrolling, it takes around 3-8 sec for visitors to scroll down to the first purchase button (see clip 1). This leads to the thought of adding a sticky button on top to make sure visitors can always find the button for purchase.
🧪 Methods
Context
An EdTech company was promoting a children's DIY product. A landing page was created with the CTA offering a free course video for anyone who submitted a contact form successfully. The page was promoted via Facebook Ads for 2 weeks.
Variables
2 buttons are placed for the test:
1. A sticky button for purchase on top of the page
2. 1st purchase button took around 3-8 seconds of scrolling to arrive to it.
Data analysis
Hotjar was employed to track the page performance. Google Analytics was used to track conversion.
📋 Result
According to Hotjar, it can take as short as 30 sec to as long as over 3 min before a visitor tapped on a button (see sample recording here). From the recording, most visitors would scroll back and forth before the first tapping occurred. The scrolling should be seen as the process of engagement, meaning how interested the visitor is in the content.
Photo 1 shows the sticky button attracted 32 taps, whereas Photo 2 shows the 1st purchase button attracted 12 taps. The sticky button outperformed the first button by almost 2.7 times tapping.
Table 1 shows the sticky button generated 55 conversions and the 1st purchase button generated 63. The first purchase button generated more leads by a small difference of 8.
📈 Marketing Insights
From the test, we can know the sticky purchase button on top of the page drew more tappings as it was placed in a noticeable section. Visitors can not miss it. The first purchase button drew less tapping, however, the conversion was surprisingly better than the sticky button. We can infer that if visitors are truly interested in a product, they would still manage to find the CTA button anyway. The 2 buttons contributed almost a quarter of total tapping (22.68%), and the rest of the tapping distributing among photos and other clickable elements. Therefore, we advised that:
1. At least one CTA should be placed on top for visibility,
2. The first CTA should be placed within the hot zone because 96.4 % of visitors have at least reached this depth (see Photo 3), The farther down it goes, the fewer the visitors are.
When using a sticky button or similar elements, it is worth thinking about whether these elements are likely to be needed often or at any point during a session? (Sticky Headers: 5 Ways to Make Them Better, 2021) In this mini-test, the hypothesis is to make sure visitors always can find the button to purchase, and therefore placing the sticky button seems to be a reasonable action.
