Website footer is an integral part of any website, but it is often overlooked during development. Upon reaching the footer, a visitor will decide whether your site is interesting or not. Since it is basically at the end of your website, having a good footer design might make all the difference.
Website footer design is the last component in the whole look of your website. There is no one good footer example because not every template works in all cases. When you take into account that website footers are often neglected, having a great one could give your website a competitive edge.
Web designers often focus mostly on the header and home page, which usually leaves you with a basic footer. However, you have to keep in mind that if you want your website to succeed, every part is equally important.
While the footer can be different from one site to another, usually it contains contact information and links to other pages on the site. The footer on your website could become another source of valuable information for your visitors. A footer that is well-designed, optimized, and easy to navigate could significantly improve your site.
You can use the footer to tell a story about your company or to share some information that is essential to the visitors. Also, you can take it one step further and add another menu for easier navigation or a subscription box for your newsletter. As you can see, there are many possibilities to use the footer to improve your website.
Furthermore, your website doesn’t have to end with the footer. Instead, you could add call-to-action buttons, links to social networks or a feedback form. Having a good footer design can also increase your conversion rate.
One of the most common features you can find in a website footer is a “back to top” button or link. The function of this feature is quite simple – user clicks on the link or a button and the website scrolls to the top. This can especially be useful if you have a long homepage.
There is an option for users to just click on “Home” button on the keyboard, but it is easier for them if it is right there, in the footer. There are two usual places where you can insert this feature – on top or the bottom of the footer.
Placing the search widget in the footer may prove to be quite useful to your visitors. Maybe someone comes to your website, scrolls all the way to the footer and doesn’t find the information they were looking for. Instead of going back and forth, they can type what they are looking for in the search box and get results. What’s great about this is that a visitor is not going to leave your site until he or she checks out the search results.
Adding social media links or buttons is a must. Since most of the websites place them in the footer, that is the best place for them. Because of this, it is likely that visitors are going to look for links to your social media profiles at the end of the page. Furthermore, if those buttons are below, visitors will have to scroll more and be longer on your website.
Ideally, when a visitor clicks on a button leading to one of your social media channels, it will open in a new tab. This is recommended because you want the visitor to remain on your site while checking out your social media profiles.
Gathering emails of your visitors is essential for email marketing. It enables you to contact them with special offers or send them your newsletter. If a user likes your website, they are more likely to subscribe, so make sure that they are able to do so.
We’ve covered some of the most common features you can add to your website footer. However, you don’t have to stop here, because there are many more interesting examples of how to make your footer stand out. Read on for more footer design ideas.
Usually, sites that are selling services or products put call-to-action in the header, making it the first thing that a visitor sees. Karma is an interesting example of how you can put another CTA in the website footer, to sway undecided visitors.
Those users who are not yet sure whether they should sign up, get to the other call-to-action at the end of the website. The second CTA is inserted on every page, with a large button that cannot be missed.
When you first open this website, you can’t miss that it is about popcorn. Their footer is quite simple, but effective. It contains a subscription box, social media buttons and menu for easy navigation. Mom & Popcorn want their visitors to subscribe so that they can let them know when new flavors are available.
This is a website gathering interesting designs of other sites and displaying them in a gallery to inspire their visitors.
Their footer is functional and efficient while being minimalistic. This is an excellent example of a footer that contains all the necessary things that a visitor might need but in a simplistic form. Users can find all they need at the bottom of the page, which may lead to them staying longer.
Tapbots is a small company creating apps for MacOS and iOS. What makes their website different is the large footer featuring three illustrations of their employees. Apart from that, footer contains some basic info about the company and links to social media channels.
The footer fits perfectly in the design of the whole website and it is a great example of how footer can become an integral part of a site.
This company based in the UK has only one goal – to make the best gourmet pies. Their website is simple, with the homepage looking more like a blog than a traditional webpage.
The website footer is entirely different than what you can usually see on other sites. It features copyright info at the bottom,and the rest is just a gallery of photos of pies linked to posts on the website.
Web designer wall is a website dedicated to bringing news related to web design and various tutorials for designers. It is no surprise that their footer is beautifully designed. It has only the basic info, along with “back to top” link. Furthermore, the footer is separated by a thin, dark line from the rest of the website.
Keep in mind that, for branding reasons, your website footer should have the logo of your own company. Invest some time into finding out what kind of footer works best for your website. Sometimes simple footer with only the necessary information works best.
Free cheat sheets available
Subscribe to download a set of cheat sheets for CSS, JS, and HTML
You'll receive an email with the cheat sheets in an instant.