The Anatomy of a Website: The Final Chapter

This is the last edition of our three part series on the anatomy of a website!  By now you know what a sitemap and a wireframe are and you know all about the different kinds of navigation. Today we’re going to wrap it all up by going over a few of the other important elements of a website that you already know about, but maybe haven’t thought of in quite the way that we do.

You still need those exam gloves, so go get ‘em!


All the stuff on a website would be awfully disorganized without some sort of container to help us keep the contents of the pages organized. It’s the same thing with that shameful drawer or closet in your house that you’d be mortified if anyone saw (you know you have at least one of those spots!). To make it nice and neat, all that drawer or closet needs are a few nice containers to keep everything in its place. It’s the same thing with a webpage. Without containers, the elements of the page would drift around without boundaries and be a gigantic mess. That’s why you see boxes and lines separating the different elements of a webpage.


Located at the bottom of the page, a footer contains contact information, links to main sections of the website, social media links, and other important stuff like that. The footer usually doesn’t change when a user navigates to a different page so that the information contained in the footer is always available. Footers are helpful not only because they list important info, but they also let visitors know they’ve reached the bottom of the page.


Any area of a website where there’s no text or graphics is called whitespace. While it’s very tempting to fill every little piece of a webpage with stuff, there’s great value in whitespace. It helps a design feel light and breathable, it helps guide the user’s eye around the page, and it helps to create balance and unity. Without judicious use of whitespace, a webpage would look chaotic and crazy. It would confuse and overwhelm a visitor, making them uncomfortable and sending them elsewhere.


It’s important that your website be consistent with your brand. While it may be cool to think of your website as a chance to really go nutsy and experiment with a whole new look, it’s probably not in your best interest. Your logo and the colors you choose should match the rest of your collateral like your business card, letterhead, and so on. You want your customers to recognize your website instantly and know they’re in the right place. When we talk about making it consistent with your brand, this is what we mean. We even think about the fonts we use and the tone of the copy. It’s got to suit you right down to the tiniest of details! This is not to say that you can’t be fun or jazzy on your website, you just have to be recognizable as you.


Content refers to all the things on your webpage like the text and the images. Content should be well organized, concise, and easy for the eye to scan for information. Most of your visitors have a short attention span, so you need your content to be as tight as possible. It’s very tempting to try to stuff as much as you can onto your site and include all sorts of pictures and snippets of info, but, in general, less is more.

There are many, many other things we could tell you about with regard to the anatomy of a website, but these are things that you’ll hear about most often when we talk to you about your project.

Thanks for letting us geek out and share our knowledge with you!

Leave a Comment