Last week I featured 16 remarkable web sites with an unconventional for a blog layout where only the latest article is featured, making it look more like a traditional site. I really like this style, so the new design for Inspiration Bit will be highlighting only the latest post while providing links to the previous articles.
There’s another debate going on when designing blogs – do we incorporate a footer into our designs or not? Some say that most people, themselves included, would hardly take time to scroll all the way down to see what’s in the footer, others think that if you spend some time on making an attractive footer and provide some helpful data there, users would visit such footers.

I belong to the second category: I’m not ashamed to admit my “fetish for footers”. Especially because I chose the layout with only an excerpt of the latest article, I think adding the footer will make the site much more usable and attractive. I don’t want to mix in my sketches with this post, but I’ll be definitely showing you my rough designs next week. Today I want to inspire you with 16 well-crafted footers by other designers.

I tried featuring here the sites that I didn’t showcase in my last week’s post, though there were some very nicely designed footers as well.

1. Personal Bablishing

slowli
I really like the tag cloud in the footer of this web site with that wicked worn look that’s masterfully taught by Cameron Moll. The rest of the site navigation is located in the left sidebar with cleverly scripted horisontal tabs.

2. Split Da Diz

splitdadiz
Here’s another footer that features a tag cloud, along with the blogroll and the Flickr stream. Check out how the image of the latest article is double-featured in the header image. By the way, be sure to check an excellent resource on that site: “99 sites that I wouldn’t want to miss” (at the present the most current post). Even though the blog is in French, you shouldn’t have any problems understanding what kind of sites it’s talking about (you can also translate it with Babelfish, by entering the page’s URL).

3. eleven3

eleven3
Despite having one of the busiest backgrounds I’ve ever seen the site is very legible and sports not one but two footer-like sections: one titled “super bonus posts” lists Related, Recent and Latest entries; and the second one on the rich textured green canvas showcases Flickr stream and links from del.icio.us.

4. Missy – great design is in my jeans

missweblash
I really like the designs that have a theme – this one is of course all about jeans: everything from the different stitches running through the site pages to the various jeans backgrounds imitate the design of jeans. Here the stylishly decorated footer only features a long list of the site’s categories.

5. SimoneStudio

simonestudio
Even though this site is not a blog, it’s been made with Textpattern, and has a very delicately designed footer. I especially liked their idea of placing the Contact Us form in the footer.

6. Web Designer Wall

webdesignerwall
This exquisitely designed blog needs no introduction. Nick La has reserved sections like Recent Posts, Recent Comments and About for his site’s footer.

7. Lady Omega

ladyomega
Moody, dark, pretty in pink, Gothic… Lady Omega spotlights not one but four footers: the first one displays the blogroll, the second one showcases the numerous site icons that featured this blog in their galleries (this part disappears when you are viewing the single page template), the third one enlightens us with the words of wisdom, and the fourth, (the “official” footer in HTML terms), with the dark graphics presents us with the Flickr photos, Tunes from last.fm and books from Amazon (plus the regular copyright data).

8. PSDTuts

psdtuts
PSDTuts footer is very clean and cleverly organized. I especially like the switching tabs to view the Best of PSDTuts (All time, Recently and Random), and Text Sponsors – wouldn’t you like to see only this kind of non-distracting ads on the Web?

9. Blog.SpoonGraphics

spoongraphics
A bit of illustration, a wrinkled paper for the background – sometimes that’s all you need to design a nice looking footer that becomes instantly recognizable. SpoonGraphics decided to feature its Top Tutorials, Top Articles and Top Downloads in the footer.

10. Who is Jen Gordon

whoisjengordon
So who is this Jen Gordon anyway, and what’s with that Bigfoot photo in the header? Well, at least you can quickly find out what is she blogging about by checking out the footer – Categories, Recent Posts, Links – they’re all in there.

11. Astheria

astheria
This blog’s minimalistic design is super practical and user friendly. Just check out the switching tabs in the footer that give you a quick access to most popular posts, recent comments, twitter messages, archive by month and categories.

12. Jon Tan

jontangerine
“This simple dish was created with a little xHTML, a dash of CSS and a pinch of PHP.”, wrote Jon about his blog. I would also add that this simple dish is delicious. The understated long footer features the best articles of the blog. At the first glance the minimalistic design doesn’t impress beyond the fact that it’s very clean and elegant, but after a careful study you start discovering all those hidden gems like the use of “Baskerville” in the font-family, and the display of the post’s title on the left instead of the usual placement above the article. That’s exactly how I was planning to implement post titles in my new design, along with the drop cap for the first letter of the post, before visiting Tan’s blog. Why is there often someone else who implements your ideas before you do?

13. FortySeven Media

fortysevenmedia
A dash of the worn look and a bit of sIFR in the titles, striking colours – and you get a very attractive footer. Notice how FortySeven Media wisely mixex its company site with the blog and promote the recent Web and Print design works in the footer along with the Recent Blog entries.

14. Laura Alter

lauraalter
I like the highlighter style decoration for the titles in this pastel girly footer.

15. The Blog Herald

blogherald
If fancy footers are not your thing, you can always go with the simplistic approach similar to the one Brian Gardner chose for The Blog Herald. Only now did I notice that he used there a very similar to my current blog’s background colour.

16. COLOURLovers

colourlovers
Another no-frills footer design over at COLOURLovers, though they did use different icons for their bulleted lists, and dotted separators between the three sections.


So what do you think of using the footer in the blog designs for more than just the general copyright info? What are your favourite footer designs? If your blog does have a footer, or if you’re thinking of adding a footer to your site, what kind of information should be included in the footer and what should be left to the sidebar?

Recent Bits
Related Bits
New cool features of Adobe Photoshop CS 3
Can you be inspired by a Dot Com Mogul?
Ali – The Greatest inspiration in the history of sport
Blog Redesign: First Steps – Inspiration And Ideas
A Bit Of Literature – Eyes Do More Than See
8 Strenuous Steps To Get The Ideal Name
Horisontal website designs
When do you Consider you are a Successful Designer?
Comment Bits

25 Insightful Bits in response to “When The End Is Just The Beginning”

  1. Looking at the above examples, I’m quite ashamed of my own footer. It really s time to redesign it. Oddly enough I’ve never noticed the psdtuts footer, but I like it a lot. It has certainly inspired me to get on and redesign my own. Thanks, Vivien. I like these ‘web design elements’ posts.

  2. Thank for the inspiration, this post is very complete with a great description of all footers, good job (& thank for the link ;) ).
    Bye

  3. Some very nice Footers there.

    I think it’s true that footers are often not given much attention by the reader/user – but from more of a practical point of view it can be very beneficial to have lots of deep links from your home page to various articles in helping spread Google juice around your site. Footers are perfect for that.

  4. Now you have me wanting a footer on my website. Some of these are really great…If only I knew how to put one on my site… Have you come across any tutorials or anything that show you how to do it?

  5. hey, I was inspired by your post and made a temporary footer yesterday. Now there’s something to see at the bottom of my blog. Thanks for sharing. :)

  6. You’re welcome, John. I’m glad you like my design elements posts, and that you’re inspired to add a footer to iLT. Look forward to seeing what you’ll come up with.

    de rien, Polo. You’re doing a great job with your blog, it’s worth practicing my French and reading your articles ;-)

    Aaron, you’re absolutely right – footers are perfect for deep linking, plus they do help keeping the visitors on the site for a bit longer. What else will you be adding to the footer on your blog, next to the Tag cloud?

    Hey, Jacob – first of all – congratulations with getting your blog 100% fixed! No, I haven’t come across any tutorials on footers, but if you know HTML&CSS it should be pretty easy to add one to your blog. You can install Firebug in your Firefox and inspect the footer design and code that you liked. Or else you can simply add new DIVs to the existing DIV id=”footer” in your existing footer.tpl, and decorate them with the way you like.
    hmm… Perhaps I should post a tutorial on footers here.

    Kriz, way to go! I’m thrilled to see that my posts inspire people to actually do something, not just say – oh, that’s nice and move on to something else. Which footer section did you just add – the one with the photos, or all the previous ones as well?

  7. Ah yes, my footer is looking kind of empty isnt it? To be honest I’m actually changing things arouns a bit – I’m hoping to have a new blog up and running by the beginning of March and once thats done I’m going to give miLienzo.com a completely fresh lick of paint. So at the moment I’m not giving the design much attention as I’m going to redo it all soon.

  8. Hi Vivien, thank you very much for featuring my blog, i really appreciate it, and thanks for a great post with different design trends!

  9. It’s the photos. And click them you will be directed to the exact location of that shot in my album. Thanks again.

  10. I know exactly what you mean, Aaron. I’m also not changing much on this blog at the moment, hoping to finish the new design in a near future.

    Omega, you’re very welcome. You have a very beautiful blog. And thanks for adding an icon-link to my site ;-)

    Kriz, those photos of yours are amazing. I especially liked the picture of those white flowers with 5 petals and one of the petals is a lilac-blue colour. What’s the name of that flower?

  11. There was a legitimate comment that was flagged by Akismet. Usually I quickly go through all the spam in Akismet, making sure that it didn’t catch something accidentally, but today I was too quick, and I clicked delete all while noticing a non-spam comment. Fortunately, I could still see it when I clicked ‘back’, read and copied it, but couldn’t recover to appear here, so instead I will just copy it.

    It’s from Paul Walker (no URL was provided).

    Is it really accurate to call these footers? Many of these footers are actually a large portion of the page, and make up the majority of navigation… and most of them have another area that is clearly a ‘footer’ at the bottom of them – Personal Bablishing’s brown ‘The end’ block, Missy’s Stripy copyright tag, COLOURLovers’ duplicated navigation & copyright, Split the diz’s design credit & copyright… 10 of the 16 (by my count) examples contain a concise, ’standard’ footer at the end. This is, of course, nothing against the websites – I just feel that calling anything which appears after the posts in a blog page the footer is a bit imprecise. These are more like horizontal sidebars…

  12. ok, and now here comes my reply:
    Paul, thanks for the comment, hopefully you will get back to read the reply.

    I did mention a couple of times in my post, that those are additional sections above the usual footer with the copyright data. When you say, “standard” footer. What is a “standard” footer, the one that goes under div id=”footer” at the end of the page? In my opinion, the footer is the bottom part of the page that’s included and is the same on all pages. In most of the examples above those “footer” sections are repeated and included on all pages of the site, that’s why I labeled them ‘footers’ even though they’re not included in the DIV tag that’s labeled “footer”.

    I’m curious what others think about this?

  13. the flowers are called Butterfly Clerodendrum because they resemble real butterflies, agree? BTW, it’s nothing to add a hyperlink to blogs I read.

  14. Ah! More inspiration!! I love the diversity of the footers. It’s a great place to put extra goodies if people care to see them. I reeeeeally like the Spoon Graphics footer, glad to see you featured it. And of course, WDW, my favorite :D I really like how you’re breaking down parts of a blog and sharing it with us with these posts.

  15. Those flowers do resemble a butterfly, Kriz – so elegant.

    Glad you liked these footer showcase, Lauren.
    SpoonGraphics footer is using that paper effect, similar to the one you tried in your redesign, isn’t it?
    I’ll be featuring other parts of the site design. You know, some of those elements we never notice until we start thinking of them when we redesign our own sites.

  16. Yes, I love paper!!! It’s my secret fetish… not so secret now that I’ve just said it on the World Wide Web, though, eh? I like scrapbooking and choosing the perfect paper is one of my favorite parts of a design project. I would love to make it look good in a blog design, too.

  17. Great list! I love useful footers :)

    I’d seen a similar list on Smashing Magazine, but this one might be even better!

  18. Thanks for including my website’s footer :)

  19. Kristarella, thanks for the compliment. :-) I did see the list from SM, a very extensive one as usual, but didn’t have that many interesting blog footers besides the ones with the copyright info.

    Missy, you’re most welcome. It is a pleasure to look at your blog’s design.

  20. Hi Vivien, thanks for the mention, and such kind words, too! Mine gets pretty scrappy sometimes, but I find it useful, and hopefully others do too. FWIW, I think you should go for it with your redesign regardless. I think there’s no such thing as new ideas (mine certainly weren’t,) just good ones done over. I’d love to see how you get on. All the best!

  21. Hi Jon. Thanks for dropping by and the heads up for the titles style. I really like how they look on your site.

    I’m documenting my re-design on this blog, so far I’ve posted my initial sketches, next will post about my new logo design process, and so on.

  22. I just discovered inspirationbit, and I’m going through every post here… what a great source of inspiration !

    I was very surprised (and pleased!) to discover one of my websites mentioned in this article (simonestudio.com). Thanks !

  23. Hi Sacha and welcome to Inspiration Bit. Thanks for the kind words and congratulations with having your site Simonestudio.com mentioned not only on iBit but also in The Web Designer’s Idea Book. I’m now exploring your site too, found some very interesting articles there.

  1. Behind The Scenes Of Exquisite Web Typography - Part Three » Inspiration Bit

    [...] I featured jontangerine’s footer in my 16 bits of amazing footers. But it’s just one of the inspiring bits that Jon’s site has to [...]

  2. Meticulous Design: Information Architecture » Inspiration Bit

    [...] When browsing RA Project you can sense that Ronald Huereca has put a considerable amount of thought into improving a user experience on this site, after all the site’s purpose is to place readers first. The homepage features an excerpt from the most recent article, that’s complemented with the list of five recent articles on the right. AJAX carousel is a geeky and quick way to present readers with a whole bunch of recent articles that they can easily browse. Three articles from different categories are featured below with the list of related posts. The footer presents readers with a short about section, del.icio.us links and Readers First award recipient. Since it is a multi-authored blog, Ronald cleverly displays the author’s short bio before each post, followed by a number of links from the same category as the post, and more articles from the same author. I hope you got inspired by the examples above to perhaps re-think or improve the information architecture of your site. You may also find helpful two of my previous articles on blogs with unconventional layout and elaborate footers. [...]

Selected Bits

PopularBits

RecommendedBits

FavouriteBits

PersonalBits

Hi, I'm Vivien. Thanks for visiting my Inspiration Bit. I often find myself scouring the internet looking for either answers to many questions I have or websites that inspire me, sites that I can learn from. On what topics you might ask — any topics that interest me, anything from web design to typography and art, from blogging to entrepreneurship, from programming to open source.
read more…
When I'm not blogging, I design web sites, teach, play with my daughter and try to balance family, work, friends and a somewhat active social life on