One of the most often overlooked part of your WordPress website is the footer. Located at the bottom-most part, the footer may be barely noticeable for some, yet it is a crucial part of your branding.
A poorly-designed footer makes your website (and your company) look less professional and unreliable. It can also make or break your website’s overall design and structure.
Here, we will walk you through 9 tips that will help you design your website’s Footer.
#1. Make it readable with eye-friendly font type, size and design
To make the footer appealing to readers, your footer must use font types that are easy to read such as Lora, Calibri, Roboto, Helvetica, and Arial, to name some. In other words, leave calligraphy fonts for other parts of your website.
The background color and overall design must also be visually appealing. Avoid flashy neon colors and unreadable font types.
Make sure that the font size is at least 14 pt., which is the standard font size for websites.
#2. Make sure it has relevant information about your company
When a reader scrolls down to the end of your page, you don’t want them to be greeted with a blank space. Instead, greet them with a beautifully-designed footer.
Your footer must contain vital information such as the company’s name; links to company information or “About Us” page, “Contact Us” form or page, Social Media pages, website’s Blog, terms and conditions, policies; and, copyright statement.
Depending on the type of business you’re in, you may include or omit information as you see fit. You may also vary the design of your footer accordingly.
By carefully laying out details in your footer, you let people know more about your company and how they can reach out to you.
Placing Social Media icons or widgets in the footer is also good for your business as it encourages people to follow you on social media.
Or, they can opt to inquire via the Contact Form. A good example is Brain Traffic, which incorporated a Contact Form in their footer:
These tips make it easy for you to engage with potential and existing customers, and stay connected with them. You can learn more about how to effectively design a form in this form design guide.
#3. Place a catchy call-to-action
The footer presents a tremendous opportunity for you to convert visitors to buyers or subscribers. You do this by incorporating a Call-To-Action (CTA) in your site’s footer.
One tip for CTAs: Make sure that you only have one, and only one CTA in the footer. Having one CTA avoids confusion for your readers. Make sure that it is clear from the get-go what you want your visitors to do.
Take a look at how Intercom placed a CTA in their footer:
#4. Create contrast
To make information in the footer stand out, the background and font colors should contrast each other. This makes the text more readable.
#5. Set the Golden Ratio Line Height that looks best on your website
To make sure that your website’s footer is optimized and proportioned to the screen, set its Golden Ratio Line Height.
The line height is the space between the lines of your website’s text elements. Here’s a visual explanation of line height by Pearsonified:
The Golden Ratio, which is pegged at 1.618, ensures that your website is readable and pleasant to the eyes. Using the Golden Ratio, we can ensure that the text, line height, and width are proportioned to each other.
For you to know the magic number of your Golden Ratio Line Height, you can use the GRT Calculator. This tools shows the optimal Golden Ratio Line Height based on your Font type and size, as well as Content Width, which are all measured in pixels.
If you want to do the calculations yourself, you can use the formula below:
- Line Height (in px) = Font Size (in px) * 1.618
- Width (in cpl) = Width * (Font Size / 1.618)
To implement it on your website, put your calculated Golden Ratio Line Height and the font size in your WordPress theme’s style.css.
#6. Be Crafty with your Newsletter Form
A footer is also a great place for you to tell your readers or customers to subscribe to your newsletter or email list. Your subscribers are your potential buyers so make sure to include a Newsletter subscription button in your WordPress footer.
Entice your readers to sign up to your newsletter by crafting an attention-grabbing CTA button.
#7: Use Your Space Wisely
You might be tempted to cramp a number of features and offerings on your footer to impress visitors. But clutter repels users more than it entices them.
The use of empty space or “negative space” improves the navigation of your site. Negative space adds contrast to your canvas and users’ attention can be drawn into what you intend for them to focus on.
Here is an example of a well organized and effective use of space from Cegedim.
Remember to use just the right elements and blend them together to make your site look professional and increase the site’s conversions.
#8: Easily Make Your Own Customized Footer with Plugins
The best way to design your footer is through plugins. Using plugins to design the footer makes it more dynamic and manageable in the long run.
Below, we’ve picked the three most practical and handy footer plugins:
For starters, HayyaBuild is an intuitive header and footer builder. It is so easy to use as it is a drag-and-drop builder. It also comes with ready-to-use preset templates.
Another builder is the Smart Footer System,which lets you experiment and tweak your footer to make it look more dynamic with its different types of customization options. With this plugin, you can try eight different modes for your footer such as banners, spreads, CSS3 animation, or Accordion. You can also design your footer with an auto-hide or show-only option. Aside from having 100 styles to choose from, this plugin is compatible with most page builders and themes.
Another great plugin is the Footer Putter, which easily creates accreditations, trademarks and copyright notice. It also lets you hide the “Powered by WordPress” trademark line. This improves the credibility of your company.
So, that’s it! These are the 8 design tips for your WordPress website’s footer to make it more readable and appealing.
Have you tried out any of these tips? Let us know in the comments section below.
Aaron Chichioco is the chief content officer (CCO) and one of the web designers of Design Doxa. His expertise includes not only limited to Web/mobile design and development, but digital marketing, branding, eCommerce strategy and business management tactics as well. For more information about Aaron, visit our about us page.