Footer - UI Element

What Is the Footer Component?

The footer is a UI element that is placed at the bottom of a web page. Generally, it includes information such as page numbers, copyrights, creation dates, and links related to documents. 

Footers in UI Design
Footer by uinkits

Anatomy of a Footer in UI Design

Footers are simple UI elements that are built from the bottom up and made up of two main components.

  • Bottom Part. This part is mandatory and it contains elements such as the copyright label and legal links. In some cases, it may also include links to different social media platforms.
  • Top Part. The top part is not mandatory and content-wise, it can include various things. Some of the most common elements are navigation links and contacts.

When to Use Footer Components?

  • Providing Help. Footers have the quality of providing additional information that can be useful for users. One of the most common instances in which footers come in hand are when we want to assist users with links that are related to the experience on the website.
  • Bottom of the Page. Footers can help us establish a visual order in our websites. Users are already used to and anticipate that a website will have a footer at the bottom of the page.
  • Do Not Use. One of the cases in which it is not advisable to implement a footer is for call to actions. Due to its placement at the bottom of the page, it is unlikely that advertising products would prosper in a footer.
  • Testimonials. Companies often take advantage of the footer concept in order to showcase various testimonials from clients that have good reviews for their products.
Types of Footers in UI Design
Types of Forms by uinkits

How To Use Footer Components

  • Links. Most footers include links that lead to different documents. It is important to ensure that the links we provide in the footer are not broken or empty as it may decrease the engagement on our page.
  • Consistency. Websites should follow a cohesive structure and aesthetic. In the same way, our footers need to match the overall visuals and direction of the page.
  • Organization. Because footers can include relevant information, it is important to establish a logical and intuitive structure and organization. For example, legal information should be placed in the footer based on the type of website we are dealing with.
  • Prioritizing. The most essential part of the content should be placed on the main page. Besides this, we should avoid repeating the information from the pages in the footer - the users have probably already gone over that.

Use the Footer UI Element in Your UI/UX Design With uinkits

Our uinkits system is a Figma Design System and UI Kits that include UI components that allow you, as a UI UX designer, to create your design products as quickly as pressing a button. You can find footers and everything you need to create the perfect product design in Figma – all in just a few clicks. All you have to do is take the UI design component you need, and you’re ready to use it in your designs!

So, get your uinkits package and start designing now!