Blog footers are normally the last element in a website’s structure to get a little design love. They often are a forgotten block, filled with copyright information, disclaimers, and SEO links. This lack of interest, in creating beautiful and appealing footers, is rooted in the misbelief that users are just not that into them. Who scrolls all the way down anyway?
Many websites out there are challenging traditional design approaches and use of blog footers. They’ve been giving footers a facelift, carefully considering their function and aesthetics.
If you are trying to up your footer game, check out our showcase of 50 outstanding footers below. You’ll find great examples of footers with alternative functionality, exceptional design, and hopefully, enough inspiration to get you started on your own footer.
In the article below we explore some best practices to follow in your blog footer design, and showcase 50 of the best examples we've seen online.
Most bog footers highlight the most important information from a business or brand. Users look to footers primarily when they wish to find important business information, hours, or addresses. It is vital to avoid neglecting footers, designing them just as thoughtfully as you would the rest of a website
Aside from the design, there are also a few blog footer best practices to consider.
Tennent-Brown uses a plain white background and crisp black text for its footer. A section of large, black type from a section directly above trickles down into it. It’s balanced, simple, and contemporary.
Create a pattern with meaningful vector icons to use as a background texture for your footer. Australian company, Frank Body, uses a cute pattern in its footer, featuring icons representative of different aspects of the brand.
Try going full screen instead of confining your footer to a rectangle at the bottom of a page. The National LGBT Museum transforms its entire section into a patterned, full screen contact form and offers traditional footer elements in a condensed section below.
Your footer’s contents don’t have to be limited to piles of links. The Ministry of Type offers additional information about the website and the designer behind the site. It is a refreshing and engaging alternative to a sea of links.
Be sure to provide navigation links, like the Noun Project. If you’d rather not, provide an alternative that lets users head back to the top of the site easily.
Who says footers have to be rectangular? Keep Portland Weird condenses its footer into a square. It fits its layout and is a great example of how footers can take on different shapes.
Visit Bruges categorizes its information into logical buckets. If you have a bit more info, consider bucketing it into easy to access categories.
Keep users engaged by reminding them of special offers currently available at the footer, like Cinquante, who offers free shipping. They might just head back into the website to make a purchase.
Hive.io uses confetti-like elements in its footer. They are refreshing, simple and add playfulness to the site. The whole footer, instead of containing links, offers users the option to sign up to their newsletter to be kept in the loop.
Sometimes a simple design solution, like a gradient, is the best way to go. The gradient on Wake.io gives its footer an elegant, effortless touch.
Build With Chrome condenses its footer, containing little information, into one line. It frees up space in the body of the website for users to build cool stuff using the site. In this case, it works well with the goal of the entire site.
Use a single color and lay your information on the block, like Ninjas For Hire. Also full screen, they’ve created a simple sign up form set over a rich orange to serve as a footer.
Vintage Hope uses expressive typography on its site and footer, looping all elements together. They’ve also bucketed information into categories, making it easy to navigate.
Instead of an address, provide an interactive map that lets users see not only where you are but what is around you. Parliament CoWorking uses a full-screen map as a footer, dropping a pin with an expressive P on their location.
If your website allows for it, use retro styling like Dollar Dreadful. They’ve given vintage facelifts to all the other companies they feature in their footer, including Jib Jab.
The Mill has locations in several cities and shares the hours of each using a clock instead of regular digits. Pretty cool, huh?
Cafe Frida integrates its footer to the rest of the site by surrounding it with beautiful, floral elements. All of the elements on the site are lovely, have a look.
Chick’s Fry House uses its footer to summarize all the important information anyone looking to snag some nom noms from the restaurant needs in its footer. Contact information, pickup window details, hours, it’s all there.
Cereal reminds its users of cool products they are offering in its footer. Much like advertising, it may draw users back into the website, retaining them for a bit longer.
Instead of offering links that redirect to social, why not include a gallery? Chickenbot feeds its Instagram photos into its footers, making the footer interesting and saving users a few clicks into the gram.
Try featuring icons with cool messages in your footer, like VOTD. It is a nice way to end a user’s viewing experience and a suave visual.
Offering users the ability to sign up for a newsletter or service? Include a way to do so in the footer, like For Better Coffee. The bold blue background and coffee illustration serve a pleasant visual while giving users the opportunity to stay connected.
Ever scrolled all the way down only to find you must scroll all the way back up? Avoid frustrated users by providing a quick way to get back to the header. Blue Ribbon Chicken provides an icon on its right-hand side that will let users fly back up top in no time.
If you are building an ecommerce site, consider keeping the shopping cart visible, like Limonadela, in the footer. It saves users a trip back to the top, where shopping carts normally live.
Jarritos uses a luchador skeleton to spice up its footer. It’s in line with its branding elements and adds a bit of fun to the end of a scroll.
Absolute London turns its footer into its navigation bar. Granted, the layout lends itself for it. If you are designing a website that might benefit from a similar layout, consider giving it a shot.
Gnosh integrates top view photography into its footer and pairs it with expressive type. The rest of the site has a pretty cool style, check it out.
Epicurrence’s footer is beautifully stark, containing just its lovely mark and a line of text. Less is more.
Make a statement with big type and bold colors like Mambo Mambo. If your site has an established color palette, try a bright variation of one of the existing colors.
Beliyf is a very special website all around. Its footer is integrated to the rest of the site, as it is part of the roots of a tree that grows throughout it. Check it out, it’s pretty awesome.
Make sure users can reach you should they need to. If nothing else needs to be said, transform your entire footer into a contact form, like Letters Inc.
Instead of setting all your links in just one of your typefaces, try using the same combinations you’ve used throughout the site. Footers don’t have to be typographical bores.
Designing a website for an entity that has affiliations, partners, or any other type of meaningful relationship? If they don’t have a designated section in the body of the website, include them in the footer. Users expect to find them living in footers.
Siberia.io has different locations around the world. They let visitors know in their footer, detailing contact information for each.
Not including navigation links in your footer? Consider providing a condensed menu. This way, users won’t have to scroll anywhere should they want to navigate to another part of the site.
Watching the World Cup encloses a thank you note in its footer. You don’t have to give extensive thanks like these guys but can thank users for stopping by or include any other warm messages that may be memorable.
Give using related textures a shot, like Mood Furniture does. If nothing else, it will add visual interest to an otherwise bland footer.
Andrevv concludes a fun animation at his footer. Check it out on the site, it’s pretty neat.
Diagnosite offers further information for unsatisfied users who have gotten down to the bottom of the website. This can be a great way to retain and re-engage users.
Limit the colors you use or create a muted palette, like Metalab. They’ve set their footer in a single color, with lists of links and their mark. Simple and to the point.
Interested in urging viewers to do a particular thing? Consider using buttons in your footer, like Dartarrows, that clearly provide paths for users to take.
Not for every site but playing with visual effects is always fun. Cultivated Wit provides information on its fun Fridays and styles it to give the illusion that someone has had a bit too much fun.
XOXO overlays its design elements, adding visual interest to its footer. It is also refreshing to see larger type being used in a footer. No need to set type so small. It makes users feel glued to Command + +.
Set information on your footer using a simple grid, like Social Design House. A simple two column grid is enough to add a little spice to their footer.
Where was your site created? Brand New School proudly displays the American flag in its footer, sharing information about where the site was born and creating a cool design element.
Use imagery that speaks about your content. The Integrated Podiatry Clinic went for an obvious but meaningful choice when they selected an image of feet to sit at their footer.
Social is king nowadays. Remind your users to connect with you by displaying social media links in your footer. Warp Films’ entire footer is centered around building a following.
Have copyright info or terms and conditions you cannot leave out? These normally live in footers. Make sure to include them in your design, like Team Week. They don’t have to be huge, just present.
Create a fun vector illustration to serve as a footer. It does not have to be complex or detailed, just interesting and related to your content.
BaoBab layers design elements in its footer, creating an interesting look. They are a vegetarian restaurant and their food looks as good as their site!
Next time you feel inclined to create a generic footer, take another look at our list to remind you that footer design doesn’t have to be dull. Look for a bit more inspiration online and get started on a memorable footer for all your web design projects!