Fat footer

The Design Need:

You want to provide shortcuts to areas deeper in the navigation structure or extra secondary functionality on each page.

Design Solution:

Use a footer (the same on each page) containing links to the content or functionality you would like to promote or provide shortcuts to. Typical content provided in a fat footer is:

• A site map
• A summary of the site map
• Special features such as rss-feeds, twitter-links, latest blog posts, site-specific functionality, etc.
• Contact and/or about us information
• A contact form
• Links to related sites and or content.

If you use a fat footer, here are some design best practices:

• If you show a summary of the site map, provide a link to the complete site map alongside the summary
• Provide back to top links, a simple service but appreciated by users
• Visually distinguish the footer from the rest of the content. If the footer has a different design, users see that they are dealing with a special piece of the website
• Categorize the provided links and functionalities well.

When to use:

Use fat footers as a secondary navigation aid; don’t use them as the main navigation for the site. Fat footers can help you to guide users to content that is vital to the concept of your site or functionality that you would like to promote. Fat footers can also provide access to important content regardless of where the user is.

Why use this solution (rationale):

Since many users do scroll to the bottom of the page it can be interesting to make good use of this space. As long as you do not rely on users scrolling down to the bottom, this is a great place to offer secondary navigation aids and additional info.

More info elsewhere:

• Fat footer design pattern on www.ui-patterns.com
• “Ten fat footers: how to make good use of that space at the end of the page” on www.sitepoint.com
• “Informative and usable footers in web design” on www.smashingmagazine.com

• Categorized as Design Patterns