Website Footer Design: Examples, Tips and Best Practices

Website footer design

Even though footer isn’t the first thing your visitors see, its design by all means deserves your undivided attention. Here we’re going to tell you about the necessary components of a good website footer design and also show some great examples of this part of the website.

Website footer design best practices

Footer is the last part of the page your users see. Nonetheless, it’s an important component of your website. It includes a copy of the vital elements, such as navigation and contacts. Those will come handy to a user who has scrolled your page down and realized that he needs something he saw on top of the page, for example a phone number. If we don’t offer something in the footer (like links users can click), they are likely to leave the page.

So what exactly should you put in there?

  1. Help the visitor to get to know you. Your footer should include About us, Our team, Our history and similar links telling more about who you are, as well as social links or link to your corporate blog. They will help your visitor to understand what kind of company you are and create sense of familiarity.
  2. Provide all the basic contact information. Specify your main telephone number, email and address. A great idea is to add Google or Yandex map.
  3. Add a call for action button. If the visitor spent some time on your website and scrolled it all the way down, tell him what else he can do — subscribe to news and updates, send you an email or add your company on social networks.
  4. Leave enough free space. All the information in the footer should be uncluttered and easy to read.
  5. Group your links.Think about the users: this way it would be much easier for them to figure out which column contains the link he needs. Thanks to groups your footer will look well-structured which is especially important for multi-level footers.
  6. Follow the style of your main page. There’s nothing worse than to see a footer that is out of tune and don’t work well with the rest of the components of your page.
  7. Don’t forget about the hierarchy. Just like all other parts of the page footer should have a clear hierarchy: all the main elements (for example, your phone number) should be well visible and standard information (like copyright) shown in the smallest possible font.
  8. Don’t use too big images. They will distract user from the important information on the page.
  9. Use a contrast color for your footer. For example, if you use white for the main part of the website, choose a darker color for your footer. It will help to separate main content and information in the footer.
  10. Don’t forget to specify the owner of the website and its developer.

Creative footer design of website

Now when we’re familiar with website footer design best practices, let’s throw in some creativity to attract attention to your website and consequently to your product.

Play with the idea of ground proximity

Since the footer is located in the bottom of the page, it is only logical to use it (of course keeping in mind the main part of the website). You can place here matching illustrations like tree roots or sea bottom or planet surface. Here’s an example of what we’re talking about:

Footer for product company

This design also uses bright color for links to make them well visible and two other useful elements to keep the user busy:

  1. Follow-up form that allows user to choose the city where one of the branches is located.
  2. Newsletter subscription field for getting information about events and special offers.

Make your footer more vivid with small images

Of course they should match the website theme. This kind of images helps your website to stand out and make it memorable:

Small image for capturing  attention

Think of alternatives to images

Instead of images innovative website footer design can use small attractive animations. You can put here infographics, some suitable factoids (short points without link to the source) or use some attractive navigation. For example, here’s a footer with an unusual blog calendar that definitely attracts attention:

Original navigation in footer

Update your footer on a regular basis

A great idea is to find a way to update you footer from time to time. For example, you can place there links to latest blog posts, featured projects, special offers, monthly digest, etc. This way your regular visitors will scroll down to the end of your page just to check out whether there’re some new goodies there. Here’s an example:

Footer you keep on visiting

Be brave and use irregular forms

There’s no rule that forbids using irregularly shaped footers. Innovative website footer designs can be asymmetrical and still balanced with the rest of the website. For example, here’s a footer with sharp edges:

Footer with sharp edges

And here we see wavy lines connecting feedback section with the footer:

Wavy lines in footer

In the design above sections are also clearly separated so that users that simply want to check out sale offers in other cities can easily click on a necessary location.

All in all we should say that website footer is an important part of the website so you should follow best practices when creating one. At the same time you should try to make your footer not only content-rich but also striking and memorable. We hope that ideas for website footer design from this article will help you to decide what kind of footer you would prefer for your own website.

We, studio stfalcon.com, design and develop website and applications fulfilling most complex requirements. Hire us and you won’t be disappointed!