Most are ignored altogether. Some are sparsely populated with a line or two of text. A rare few are overstuffed with information. What is a footer, technically, and what is it for in web designs?
A footer is simply the bottom of your web page. (In some PHP designs, the footer is actually in a separate file, called either “footer.inc” or “footer.php”, and included using the following code: <?php include(‘footer.php’); ?>)
Generally speaking, web designers won’t put a whole lot of stuff in the footer, since it’s at the bottom of the page and most users of your site aren’t going to scroll down that far. But lately, there’s been a trend in web design to stuff one’s footer section with content–anything from author information to a full sitemap, from a collection of photos to a selection of favorite links.
I took screenshots of various styles of footer-formatting to show what I’m talking about, going from smallest to largest:
Mini-Footer
(click image for larger version in new window)
This footer, from Infektia.net, has tiny text and just a few helpful links to the user. This matches with the overall minimalist vibe of the layout and doesn’t compete with the content for the user’s full attention.
Styled (But Still Small) Footer
(click image for larger version in new window)
PacificDusk.org’s footer contains a tone-on-tone world-map image (left-aligned), as well as a funky site slogan and a few well-chosen, helpful links. This gives a punchy, graphic finish to the end of the webpage without being overly detailed.
Bigger, Well-Spaced Footer
(click for larger version in new window)
Though this footer from Kloud-Nine.com is bigger vertically than the other two footers we’ve looked at thus far, it’s still simple because of all the white space around each of the elements. And, surprisingly, the bigger text size offers readability and simplicity as well!
Super-Detailed, Super-Organized Footer
(click for larger version in new window)
Detailed imagery and clearly-delineated content boxes makes this footer from a previous version of EvolvingOctopus.com lots less confusing than it could be. Even though there’s a lot of information present, it’s not overwhelming because it’s organized attractively.
My Personal Footer Style
I’m personally not a big fan of stuffing footers with lots of info, because I often find myself wondering, “How many people are actually going to look at this stuff in my footer?” I would rather put all that cool content into a sidebar where it is much more easily visible when a user first loads my page. But that’s a personal decision on my part, part of my style of building websites. As I get better with web design and better with content management, I find myself branching out into new styles, and one new style may just be a larger footer than I’m used to!
Footer Styling/Content Tips
If you like the idea of putting content in your footer, I would recommend making it simple–a small selection of links that are easily readable, for instance, or thumbnails of some photos that are significant to you. Crowding a footer full of information can be visually overwhelming, but an undesigned footer can be an unsatisfying end to an otherwise cool webpage. Keep it in balance!
If you’re not putting content in your footer, a “back to top” link in your footer can be very appropriate if you usually have long pages full of information. (I generally put a “Proudly part of WithinMyWorld.org” link in my footer, and perhaps a few other links, but I don’t add much else.)
Lastly, whatever you’re putting in your footer, be it links, pictures, content feeds, etc. make it clearly labeled and organized. Your users will thank you!
Summary
As the above screenshots show, footers can be anything you need them to be on your website. For taste purposes, I like a clean and uncluttered-looking footer, but they can be as big or as small as you like. Whatever you do, make it meaningful to your website and easy to read!
