Why the Mobile Footer Matters…

footer 300x200 Why the Mobile Footer Matters...If we follow the traditional rules of web design, then the further you go down the page, the less important the information there. And as a result, we have a self-fulfilling prophecy: Users expect to find less interesting and relevant information – so UX designers don’t generally give the footer space the attention it deserves.

However, the advent of the smartphone and tablet are in many ways re-writing the rules of digital customer experience.

Among the many heatmap observations on the differences between mobile and desktop user behavior, it was found that mobile users tend to scroll much further down the page. In fact, most mobile users tend to scroll straight down to the footer – making this part of the website almost as important as the header.

UX professionals are therefore being forced to apply the same website engagement and optimization rules without discrimination to both top and bottom of their sites. Here’s the proof, as demonstrated on our very own ClickTale website:

In this case below we’re looking at a heatmap of scroll reach for the desktop site. From this we see that users stayed mainly in the top half of the page (the dark red color) and begin to scroll less as they descend beyond the half-way mark, as the dark red coloration gives way to yellow.

desktop scroll reach Why the Mobile Footer Matters...

ClickTale Scroll Reach heatmap for desktop sites

Now compare this to the mobile version of the same website, below. In this Scroll Reach heatmap for mobile you can clearly see that the red coloration – representing high levels of engagement, continues almost all the way down the page to the footer.

mobile scroll reach Why the Mobile Footer Matters...

ClickTale Scroll Reach heatmap for mobile sites

 

Why the Footer Matters for Mobile:

swipe 300x200 Why the Mobile Footer Matters...1. Swipe! The swipe function is the main reason why the footer gets far more exposure on mobile sites compared to desktop. It’s simply that much easier to reach the bottom of the page when a single finger swipe or two will do it.

Compare that to desktop sites where you have to place the mouse over a narrow side bar and then move your arm down towards the edge of your desk. (Surely I’m not the only one who’s elbow has fallen off the edge of the table sometimes!)

The alternative is not much better either – start looking for the ‘Page Down’ key which is one of the least used keys on the board and gives you far less control than the mouse.

2. Horizontal layout encourages scroll. A further heatmap observation has to do with the layout of the page. Horizontal layouts tend to prevent people from scrolling and clicking, whereas vertical layouts do the opposite. Due to the narrow shape of the iPhone screen and some other mobile devices then, a horizontal layout works best – and therefore encourages further scrolling down the page!

5 Ideas to Make Better Use of Footer Real Estate

1. Mirror  your header. If you find that users are just as engaged with your footer as your header, then why not give them the same navigation functions at both top and bottom?

2. Provide additional information. Footers can be easily used to convey additional useful information that you can’t display on the header, including the contact us form, subscriptions, site map, company address, etc.

3. Further reading material. Many sites will use the footer to promote additional content from their website, blogs, forum discussions or external links related to the subject matter that all help to ‘soft sell’ or nurture the visitor further. 

4. RSS Feed, social share icons, media and search function. Many sites will place these functions at the bottom of the site, particularly if the page is long and content heavy.

5. Don’t waste this space on SEO and advertisement spam. If you lack what to place in your footer then consider something artistic or illustrative that will help to improve the overall customer experience of your site. Many sites like to include illustrations of the ground (buildings, earth, grass, trees etc.) and using the proximity to the ground and a clear differentiation in color, to clearly mark off the footer from the main body of the site:

 

footer grass Why the Mobile Footer Matters...

 

 

Comments

comments

About Sam Green

Sam Green is the Chief Content Editor for Clicktale