Website footer design — 10 best footer examples for inspiration

Users rarely forgive mistakes. If they don’t feel comfortable with a website, they simply close it, never to be opened again. The same goes for sites that annoy them or even those missing that teeny-tiny bit of information they’re after. That is why you must raise your game to compel the users to stay on your website and then return for more.

For that, it is crucial to follow a particular structure and include all the elements required for a complete and attractive design. In today’s article, we’ll take a closer look at footers and try to figure out how to design this important component well.

What is a website footer?

Simply put, a footer is the very bottom part of a website. This particular section can take many forms, depending on the industry and content. Surely some of you have scrolled down to quickly find a business address, Terms of Service, contacts, or links to social media. This almost subconscious action demonstrates the importance of footers. However, some designers make a huge mistake by neglecting this vital element.

Why footer design is important?

To better illustrate this, let’s imagine a situation. Suppose you’re a customer who had just found an online store with cool tees. You take a look and decide to purchase one for yourself. However, before ordering, you start to wonder whether it’s possible to return the purchase in case they send you the wrong size. You start looking through the site, scrolling, and scrolling, but the Refund Policy section is nowhere to be found. Now you are getting upset because you really liked the print. Then something starts to stir inside you, and, unfortunately for its owner, you decide to leave the site and look elsewhere.

A well-thought footer can help enhance the UX and be employed as a solution that surprises your users with interesting design, useful information, or just convenient navigation tools

This whole ordeal, however imagined, could have been easily avoided had the website been designed well enough — with a proper informative footer. In most cases, missing information that usually should be present in the footer can result in a potential loss of business. This is just one simple example, but we can apply it to a great variety of settings.

And let’s get this straight. It is a misconception that people don’t pay attention to the content below the fold. Indeed, a 2018 Neilsen Norman Group research has concluded that visitors spend 57% of viewing time above the fold. However, the web design approaches have changed significantly over the years, and sites have generally become more accessible and enjoyable to scroll. Consequently, time spent above the fold is decreasing over the years. Nowadays, users know that footers usually contain important information and are willing to scroll to get it.

Benefits of a good footer

With that said, footers serve a much more intricate role in improving the overall efficiency of your business. A well-thought footer can help enhance the UX and be employed as a solution that surprises your users with interesting design, useful information, or just convenient navigation tools. It can and, in many cases, should be the so-called cherry on top… only at the bottom. Now let’s take a look at a couple of examples to get this point across.

The fact that footers often contain internal links to both important and obscure sections of a website allows users to find extra information they might have missed and jump straight to the source.

It helps generate leads

Websites guide potential customers through several stages: awareness — interest — trust — action. This is a classic conversion funnel. Going through the Blog and Service Page, the users may become interested in your services. The “About Us” and “Testimonials” sections will help build trust. But the Contacts form with its call to action usually seals the deal. All it takes for a visitor to leave their email — and voila — a new lead is created! The same can be said about social media links. If you impress your customers enough, they might even want to subscribe to your company’s social media profiles. That can also be highly beneficial.

Apart from that, a footer is a great place to offer your customers some benefits in exchange for information. You can do that in a non-intrusive way by offering a discount for subscribing to your newsletter, for example.

It eases navigation

As we all know, website navigation is an important aspect of the user experience, and footers are an essential part of that. Footers are perfect for housing important links and categories, allowing users to seamlessly and almost intuitively navigate websites. They are basically roadmaps to the rest of the site, helping users find their way. The fact that footers often contain internal links to both important and obscure sections of a website allows users to find extra information they might have missed and jump straight to the source. Always remember that a good footer should work as a safety net for your website visitors.

It provides useful information

We’re going to talk a lot about useful elements today, and for a very good reason — there are just so many practical things you can put in a footer. It’s a great place for legal notices, copyrights, additional links, addresses, social media buttons, maps, and more. Naturally, these elements may vary depending on the type of your business, but there are sections every user will expect to see in a footer. The rule of thumb here is to provide relevant and valuable information appropriate to the context.

It boosts search engine optimization

Footers became crucial in boosting the ranking of websites since Google has further updated its algorithms. It takes more than just a few keywords and a unique article to hit the top spot in search nowadays. Those algorithms evaluate the sites on a myriad of subtle criteria, but the general approach to SEO remains simple — the website needs to be relevant and useful for the users. Unsurprisingly, footers play a vital role in determining this level of usefulness. For example, the sitemap, often found in footers, helps search engines find important sections.

Since Google considers the quality of internal and external links, the background graphics, the general composition, and many other nuanced elements, you need to cleverly design and test your footers to achieve the best results.

To reinforce your brand identity, you can put your logo and play around with your corporate colors in the footer.

What users can find in a footer?

As we’ve mentioned, each footer is unique and may contain a different number of valuable elements. However, let’s not forget about design standards. Some obligatory parts need to be included in any footer. Let’s take an in-depth look into what elements you can add.

Three Must-Haves: Copyright, Privacy Policy, and Terms of Use

Even though most users rarely care about these three, they are important, especially in highly regulated industries. If you want to avoid appropriation of your website’s content, just put the copyright symbol and a year in the footer. If your website collects specific data from users (such as emails or payment information), in many places having a Privacy Policy section is required by law. Terms of Use is yet another crucial legal notice explaining what the users agree to when visiting the site. All of these are usually placed in a footer, and if someone wishes to read them, they’ll go looking straight there.

Contacts

If you want future leads to get in contact with you, this element is a must-have in your footer. It’s standard practice, and most visitors looking to contact you will intuitively scroll down or click the navigation button to get to the bottom of your site. Put your phone number, fax, or business email there and wait for your customers to reach you. Some websites devote the entire section to Contact details depending on the industry.

Address and link to map/directions

This section is crucial if you have a physical office or an offline store, for example. Let users know how they can reach your business outside the online world and leave the links to the map with coordinates and your office address. Your customers will most likely expect to see that, so don’t disappoint them.

Sitemap

There are two ways of providing the users with the sitemap. The first is to put the links to the particular sections of the website in the footer. And the second option is to make a single link to the HTML sitemap. HTML map contains URLs, info on the pages, and media files that are most important on your site. Providing a link to this file is a good idea since, according to Google, search engines use it to better crawl content-rich websites.

Navigation

People are used to seeing navigation elements in headers, and we discussed this topic in a separate article. However, footers can also contain global navigation to improve the user’s experience. When pages are long, especially if we’re talking about a mobile site version, it sometimes makes sense to add navigation options in a footer. Many of your visitors will appreciate that.

Personality and brand

The website should communicate its owner’s brand and personality, and the footer is no exception here. Each part of the site should remind users that they are interacting with a particular company. To reinforce your brand identity, you can put your logo and play around with your corporate colors in the footer as well. If that’s the focus of your business strategy, then visitors should clearly see what your company is all about.

Social icons

Social media accounts not only assist in generating leads. Some businesses use them to promote their goods and services and even make sales. So it makes sense to use them to the max. Share the links to your company’s social media profiles in the footer and invite your would-be fans to check them out.

Email sign-up form

Subscribing to a mailing list is not always a basic requirement for site users. But this can be used as an additional way to retain customers by keeping them updated with relevant information. In such cases, you should add a subscription form in the footer of your website. Be sure that it’s well-thought-out, informative, and useful. Otherwise, this may backfire and only annoy your customers.

Site search tool

For online stores and large portals, it makes sense to place the search form at the top in the most prominent place. But it’s worth remembering that if a user had scrolled enough to reach the footer of your site, there’s a possibility they haven’t found what they were looking for at the top. Adding a search field at the bottom of your pages could alleviate some disappointment your customers might have as a result of fruitless scrolling. Moreover, there’s a chance that after stumbling on the search bar in the footer, someone can still make a purchase.

Awards and certifications

If your company has won awards and accolades, don’t be shy to share them with your customers. Such information, especially when visualized, raises the users’ confidence in your company. Creating an award display with pretty logos is an excellent way to promote your goods or services, and a footer is often a great place for it.

CTA

A Call to Action is essential to any marketing page. This can be an invitation to subscribe to a newsletter, download a demo version of a product, or simply ask a question. By adding these CTAs to the footer, you increase the chances of them working. Naturally, they should look like something you would want to interact with — attractive and prominent.

10 best examples of footer designs

Now that we’ve got this far let’s evaluate the 10 best footer designs we had chosen from many sites across the web. Remember that you don’t have to cram all the possible elements in your footers. Instead, add only those that will work best while reflecting your industry, design, brand identity, and context.

Halo Lab

Why look far if we’re already here, right? After you’re done reading, just scroll down and take a closer look at our own footer. You’ll see that we’ve used many of the elements mentioned in this article. There are our awards with a ranking score, logo (try to give it a click too), various links to relevant pages, a simple contact section, and links to external profiles for those willing to learn more. Since we’re continually growing and looking for new talent, we’ve also added a careers section for anyone willing to join our team. The overall aesthetic of the footer corresponds to our cosmic corporate identity.

Lola Pate

Every pixel of this simple site breathes with aesthetic. Pastel colors and serif fonts make you feel like you are visiting a real vintage store somewhere near the ocean. The same goes for the footer — there are not too many elements. However, all the necessary information is included: the email sign-up form, attractive but non-clickable CTA “join our tribe”, images with the links to special offers, the “Learn More” button, links to social networks, copyright symbol, and two columns of site navigation. There’s nothing extraordinary here, but the footer looks clear and airy.

Explain Ninja

Here we can see a classic combo of black and white. The simple, minimalistic, modern footer of the Explain Ninja site makes you feel at home. In contrast to the previous example, here, we can notice the company name and logo highlighted in bold and bigger letters. There are 4 social media icons, contact details, and a copyright symbol under the logo. That looks very convenient, though. To the left, there are 3 columns of site navigation resembling a catalog of the pages to be checked by visitors.

Siteinspire

Another example of a minimalistic working footer. Here, the “About” section is present allowing users to find out this site’s business approach. The next three columns present the Latest website, Information, and Contact sections. The contact section is represented with 4 social media icons that look pretty natural while standing out enough so that visitors can notice them. Since the copyright symbol is not the most important element for the users, it’s located at the very bottom and made with a smaller font.

Grams Caffee

Grams Caffee decided to make a simple and elegant footer to not overwhelm the users with extra colors and images. It has all the components we have discussed previously, yet the footer is very clear and intuitive. Designers combined Copyright, Terms of Service, and Privacy Policy in one thin line and put the business description in the most visible area of the footer.

Holly Oddly

The sixth site on this list has won our hearts with its lovely footer. There are 5 sections containing almost all the information a user expects to find. There are simple navigation and help sections, as well as a detailed description of the site and its author. The copyright symbol is located at the bottom of the page without distracting the users.

Shantel Martin

This artist has a very creative website, and its footer also represents creativity and minimalism. It is mainly devoted to navigation, presenting all the site’s main parts with the eye-catching bold script. The second part focuses on social media links where users can find additional information about the author’s works.

Henninglarsen.com

This footer contains one remarkable detail — a world clock which makes it more convenient for users worldwide. This shows the company is exceptionally client-oriented. The designers also paid attention to the site navigation, contacts, and social media links. The latter are implemented in tiny, elegant icons inviting visitors to click them. The “To top” button also makes it more convenient for the users to navigate the website.

Chobani.com

This entire site looks quite colorful, and the minimalistic footer made with deep green background is somewhat in contrast with the rest of it. But by taking a closer look, you will see that this color matches the color of the name sign and logo of the company presented in the header. Despite the minimalism, the designers managed to put all the necessary information in the footer and not overfill the space. They placed the navigation and social media links in the right-hand corner, devoting the entire left-hand corner to the email newsletter.

Manoverboard

This is yet another interesting site. Many different visuals are combined with a simple ivory background and minimalistic sans serif font. And the footer maintains the overall style. In the upper part, we can see certificates, contacts, social network links, and the newsletter form. The bottom part is devoted to the Copyright, Privacy, and Accessibility sections. The users can also quickly get back up thanks to the little “Top” button in the left upper corner.

Apart from that, this footer has an interactive bottom part. Users can move those letters with a mouse. This has no functionality but might entertain someone for a minute.

Conclusion

It seems like we’ve got to the end of the article, so let’s sum everything up. A footer is a crucial part of any website design. In many cases, it’s no less important than a header even. However, designers often neglect this detail. Do not make this mistake. When designing a website, put yourself in the shoes of your users and add all the info they would like to see in the footer. Don’t be shy to experiment with fonts, colors, and the location of the elements but try not to overwhelm your footer with irrelevant links, symbols, icons, and texts. Make it useful, informative, and clear in your own context. Think about the users. That is the key to success.