25 Stylish Website Footer Designs

Dec 24 2008 by Jacob Gube | 66 Comments

Footers on web pages have evolved from being a simple section where you host your copyright information and additional links, to a multi-functional section where you can find a variety of site features such as twitter updates, a short bio of the author, and secondary navigation.

This collection aims to showcase just some of the ways talented web designers have decided to utilize their website footers to provide that extra bit of improvement in the user’s experience.

# bcandullo.com

# bcandullo.com - footer screenshot.

Edgepoint Church

Edgepoint Church - footer screen shot.

I primi dieci

I primi dieci - footer screen shot.

Blog Amuki

Blog Amuki - footer screen shot.

CSS-Tricks

CSS-Tricks - footer screen shot.

SimpleBits

SimpleBits - footer screen shot.

Branded07

Branded07 - footer screen shot.

Blog.SpoonGraphics

Blog.SpoonGraphics - footer screen shot.

PRBLOGGER.COM

PRBLOGGER.COM - footer screen shot.

Dale Harris

Dale Harris - footer screen shot.

Web Designer Wall

Web Designer Wall - footer screen shot.

Powazek

Powazek - footer screen shot.

Biola Undergrad

Biola Undergrad - footer screen shot.

We Are not Freelancers

We Are not Freelancers - footer screen shot.

43 Folders

43 Folders - footer screen shot.

dreamling.ca

dreamling.ca - footer screen shot.

YoDiv

YoDiv - footer screen shot.

Designer&Developer

Designer&Developer - footer screen shot.

Jason Santa Maria

Jason Santa Maria - footer screen shot.

Helmy Bern

Helmy Bern - footer screen shot.

Personal Babblishing

Personal Babblishing - footer screen shot.

SamRayner.com

SamRayner.com - footer screen shot.

Flyin’Web

Flyin Web - footer screen shot.

David Hellmann

David Hellmann - footer screen shot.

volll

volll - footer screen shot.

Further reading

What’s the verdict?

What do you think about modern website footers? Good place to stick site features or a terrible idea? Share your thoughts in the comments!

Related content

66 Comments

Honour Chick

December 24th, 2008

wow… all awesome footers :)

Design

December 24th, 2008

Yea, I saw this on digg and in first moment I couldn’t believe that someone bothered to make such list. But I must admit that this list is very good and cool. Good work to the people created them and good work to you too :)

An Jay

December 24th, 2008

Beautiful collection of footer designs

Chris Coyier

December 24th, 2008

Hey thanks for the shout-out Jacob! My thinking is that websites are just so incredibly tall these days what’s another few hundred pixels to really cap off a design =)

Chris W.

December 25th, 2008

Thanks for the shout Jacob. I’m honored to be listed next to the great Jason Santa Maria.

David Perel

December 25th, 2008

Thank you for featuring We Are not Freelancers! Very happy to see our site here :)

kiran

December 25th, 2008

Pretty Good collection.Nice post…

paul

December 25th, 2008

regurgitated smashing magazine article?

Pavan Kumar

December 25th, 2008

One main thing I can observe is that the usage of images. More images will lead to more loading times affecting the user experience. Design wise, all look pretty good…

Chocksy

December 25th, 2008

Wow i really like this ones. I’ll probably change mine and use these as inspiration but that after i’m sick of my current design :). Thanks for sharing.

enareksi

December 25th, 2008

I don’t know where you got those but most of those are really not that special.

Daria

December 25th, 2008

Great collection, very inspiring :)

Florea

December 25th, 2008

Beautiful collection of footer designs

Sky Xavier

December 25th, 2008

wooooowww all designs are really catchy. really nice work all of them have done. thubs up.

Niels

December 25th, 2008

I like footers filled with dynamic content. Good post to get inspiration for my own footer, thanks!

Soroush

December 25th, 2008

Nice set of footers! When I visit a website, I always check the footer to see what the designer came up with! I think it gives the website personality (similar to the header)!

I particularly like the tape deck footer in the selection above.

john may

December 25th, 2008

I like this too : http://matiasdutto.com

David Perel

December 25th, 2008

Thanks for featuring We Are not Freelancers! Awesome collection!

Jacob Gube

December 25th, 2008

@Chris Coyier: Hey buddy, thanks for dropping by and sharing the thinking behind your design.

@Chris W.: Great footer design!

@David Perel: The pleasure’s all mine, keep up the great work guys.

@Chocksy: and @Niels:That’s the goal, to inspire (even myself – check out the footer on Six Revisions!).

@Pavan Kumar: I’m glad you bring up the point with CSS background images; I think there’s a trade-off between a unique, eye-catching designs and response times due to large background images: It’s up to you as a web designer to keep that in mind and to make sure that you’re getting “your money’s worth” with the CSS background images you use.

blarghmonster

December 25th, 2008

Has no one else noticed half of these aren’t footers?

David Hellmann

December 25th, 2008

yeh, thanks for including my page! Good Sites

earnpress

December 25th, 2008

Excellent list…a great deal of idea and inspiration. Never underestimate the footer.

Raj

December 25th, 2008

Nice list. Although, heh, anyone look down at the footer of this page? A little ironic, no?

Arron

December 25th, 2008

I personally don’t think it’s wise to put key calls to action in the footer, as many of these footers incorporate. Beyond the ‘gee whiz’ factor of many of this novelty designs, people generally (and understandably) don’t expect to scroll all the way down to find activities where they expect there to be a copyright notice and legalese.

As a small and perhaps related piece of evidence, ads (which are generally replete with calls to action) above the fold monetize an order of magnitude higher than those below the fold.

WebAir

December 26th, 2008

Good work Jacob! An other suggested resource > 40 Creative Footers http://www.webair.it/blog/2008/12/12/40-footers-creativi/

david

December 26th, 2008

there are some nice footers … i particularly like the idea of incorporating a contact page into the footer. that’s smart!!!

thanks for sharing these nifty ideas.

cutt

December 26th, 2008

nice post, thanks

Jacob Gube

December 26th, 2008

@Arron: I agree, important site features should be placed higher on the page where people can see them. I think that footers should be reserved for extraneous items such as Flickr sets or Twitter profiles. I do feel that once designers begin to rethink the use of the footer in their designs (like I should be doing here on Six Revisions) and start utilizing the bottom of the page more – users will begin to look for auxiliary information down there. For example, the footer has become synonymous with copyright information. The first place users go to for getting this information is at the bottom of the page. Pretty soon, users will expect other information they’ve seen in other websites be placed on the footer.

The bottom of the page is a convenient place to put things in because it doesn’t pull away from the content like the sidebar does, plus it (usually) gives you a bit more horizontal space to work with.

Amuki

December 26th, 2008

Thanks for including my Blog.

Rahul

December 26th, 2008

I like to keep the footer as much simple as possible. but seeing these designs, i think i’ll have to change my mind. some quite good designs here.

Tony

December 26th, 2008

When looking at the 43 folders image, the type is so pixelated it looks like the screenshot was taken in IE6. Why not use a browser that has better font rendering for these screenshots?

Jacob Gube

December 26th, 2008

@Tony: They were taken using Firefox 3. I did, however, scale them down in Photoshop to fit the page. If you’ve got a better way of taking screen shots, let me know – I’d appreciate it.

CPOliver

December 26th, 2008

A nice round up of web design elements here.

However ,I have to say that the kerning on the PRBlogger site makes “FLICKR FEED” look like “F**KER FEED”

Or maybe my mind is just in the gutter!

Martin

December 27th, 2008

Wow, that’s very nice. Good job on collecting em’! I like #1, #2, and #4 a lot! :D

Jacob Gube

December 27th, 2008

@CPOliver: I try to keep things PG in terms of language and content, but I also don’t want to rob you of the opportunity to share your opinions – so I replaced two letters on your comments with a *. :)

frank katzer | 1klang.de internetagentur

December 30th, 2008

nice collection of designs! a litte bit too metaphoric but ok…

madme

January 11th, 2009

Wow, that’s very nice. Good job on collecting em’! I like #1, #2, and #4 a lot! :D.

wolfwood16

January 12th, 2009

kewl and web designers wall hit it again!

derik

January 19th, 2009

nice collection of designs! a litte bit too metaphoric but ok…

alika

January 20th, 2009

kewl and web designers wall hit it again!!

Nikki

March 29th, 2009

Those are some great styles. I think the use of artistic footers is a fantastic idea – it’s a little surprise that people don’t usually get when looking at websites. I’m all for it. Thanks for sharing!

jox

May 19th, 2009

Nice nice!!!

line

June 14th, 2009

Wow…

I always though footers are boring on most website until I saw these great designs…

Marcell

August 14th, 2009

Wow! What a collection. I love the penguin footer, very artistic

Gus

October 14th, 2009

Strange – I’m not inspired by any of them and they all appear to similarly done. By the same designer?

Future Webs

December 18th, 2009

Some really nice footers here, thanks.

Charissa

May 31st, 2010

You just stole my words, brotha!!!

prem

June 24th, 2010

nice inspiration … thanks

Ryan Battles

July 20th, 2010

I really liked that footer for the Edgepoint Church site done by Fourtyseven Media. Those guys really do great designs.

Windfery

August 22nd, 2010

Some great graphic design in here. I suggest being cautious of having too much code in footers so that it doesn’t weaken code-content ratios and too much footer content which may incur duplicate content pentalties.

middo

October 27th, 2010

thanks very much! really nice collection :)

Lee Edralas

November 15th, 2010

I like this footers.
# bcandullo.com
Powazek
Biola Undergrad

This one, I primi dieci design and some others? I don’t think so. But its great though for you to have share this. Thanks.

Zeeshan

November 26th, 2010

Nice

Tiyo Kamtiyono

December 6th, 2010

Thanks for the list, good design to feed my imagination while making my own design :)

Wouter De Bruycker

February 16th, 2011

the bcandullo footer is fantastic, as is the whole website actually :) great job of whoever created that website, thumbs up!

John

April 4th, 2011

The Bablishing footer was nicest. Liked that one the most …
This Norwegian site also has a very clean and happy footer http://groupdeals.no/index.php Found it randomly and I liked it :)

John

June 28th, 2011

It is a very good job to share these. In my point, The matching header and footer itself bring best looks for the site.

brill

July 1st, 2011

Designer&Developer’s ‘Tape deck’ footer is great, back to the 80′s…

aman

August 27th, 2011

nice footer collection

Adam

September 7th, 2011

Nice collection… here’s another nice one http://www.cheshirescouts.org.uk

Future Signs

September 8th, 2011

great footer ideas here, thanks.

PhotoshopWarrior

September 12th, 2011

All of these footer designs are awesome :) Love the CSS trick one most :P

hassan farooq

October 27th, 2011

nice footers…n getting to much perfection…

Leave a Comment

Subscribe to the comments on this article.

Mobify empowers marketers and developers to create amazing mobile web experiences. Tap to learn more

Mobify