Website Design Trends – Why Footers Are Becoming Important

Good morning, internet fans. It’s Ryan Perry with Simple Biz Support. Today is Thursday, therefore it is Internet Marketing Thursday. As usual, I have the beautiful and talented Virginie Dorn with Business Website Center on the other side. Good morning and happy new year, Virginie.

Virginie Dorn: Well, happy new year to you and everybody who is watching us. It’s going to be a fantastic year, I have claimed 2015 and I hope you did the same, it’s going to be a good year.

RP: Yes. It’s going to… It’s starting out pretty good so far, although rain from Northern California has subsided for a while, it’s been sunny but a little cold. But I think… Yeah, I know especially in California, the economy is coming back really well. There are businesses out there looking to redesign, reinvigorate, re-imagine what their internet marketing plans are for 2015. So, very excited about that. Today, we’re going to talk about something that I thought was very interesting when you brought it up, and you said, “Well, let’s talk about footers.” And I’m like, “You mean that little section down at the bottom of the website that says my copyright, and my business and my address?” And you’re like, “Yes.” And you said that design has changed in the last couple of years, or the technology behind the programming has changed, that really allows you as a designer to use a space that was once really not really usable, I guess. So, why don’t you tell me what some of those changes are, and why people should take a look at their own business footer?

VD: Oh, yes. So, I’ll explain in a nutshell why it’s become important, and some cases as important, if not more, as the header of your website. As most of the new webpages and the new design trend is to make those pages much longer, so you can scroll much further down. So, when you are at the very bottom of your page, you really want to give that last call to action, the last impression to your visitors. And it’s often a neglected part of the website, so we want to show you how some of our clients have really harnessed its power and let it get to work for them and…

RP: Okay, before you do that, I just… I find it interesting, ’cause if we went back, jeez, I don’t know, two years, three years ago, we were always worried about getting everything above the fold, whatever that break-off line on your computer screen is. When the website pops up, we wanted to get all that information above the fold, and because people weren’t scrolling down. So, the big thing I heard from you is that the footer is important because it’s the last thing people see when scrolling down. So, why the change of really being concerned about what’s above the fold, and now being concerned about scrolling?

VD: A great question. It truly is because of mobile devices, because on mobile devices, it’s all about scrolling with your thumb, or if you have a little pen and you can drag on your screen. So, now then… I don’t know the statistics, I would not be surprised if 70% of people use mobile devices to watch websites, so it’s affected the desktop version. So, people are now in the habit of scrolling, so now on the desktop version, they’re also into the habit of scrolling. And now that we have very cool dynamic effects on the website, such as elements moving in, people are very interested in continuing scrolling and see what else is coming into the page. So, all of this, and again, it’s all about service and what are the trends based on what users are doing, and it has shown that longer pages are now acceptable again, because they have become more interesting visually, and more useful as well. So again, that makes the footer even more important now.

RP: Yeah, and I just find it interesting, because fashion trends have always been known to fade away, and then they come back.

VD: Yes.

RP: But in technology, typically, that’s not the case. Typically in technology, you just keep on moving forward. So, to me, it’s kind of funny that we’re coming in full circle, where, used to be, everything had to be above the fold, we had to be able to click it real easy. But it makes sense, because when everybody’s sitting in front of a computer and you have a mouse, it’s much easier to click somewhere, versus today, more and more people are going mobile, therefore, we are swiping. And therefore, it’s making more sense as you’re redesigning your website to be accommodating to those people and what their habits are, in how they interact with your website, so the swipe is very important. So, do you actually have some examples then of maybe what a bad footer is or a good footer is or… I know you’ve got something for us.

VD: I have to make sure… I just want to be sure it’s showing my screen. Are you seeing my screen yet?

RP: Not yet, for some reason, you froze.

VD: I see that, yes.

RP: Now I have… Now we’re back to you.

VD: Alright, let’s try again. Not bad.

RP: What makes a footer or something… Oop. Back to you.

VD: Oh man. Okay. Let’s give it another try. Again, with a little technology…

RP: We need good karma here.

VD: Alright, you’re seeing?

RP: There we go. Is it Julin?

VD: This is a very old website, it’s several years old. So, I wanted to first start with a typical footer, as you can see at the bottom, a very simple copyright perhaps, some maybe address information and a webmaster link; very typical, done many, many of those. But things have changed, maybe three, four years ago, we started introducing double footers, which are very, very popular, where you still have that skinny bottom footer with copyright information, maybe some strategic links. And then you have the bigger footer right above it, which has more real estate and gives you opportunities for call-to-action text, even images. So I wanted to show you quick progressions. And again, this website here is maybe three, four years old when those top large footers started becoming trendy. Now, the footers, again, it could be full column, two columns, three columns. This one has four columns. Same idea, this one has different links you can click on. It has a big call-to-action “click here to contact us today”, which takes them to their contact page. Again, same thing, copyright information.

RP: And I take it now, with this one, we’re starting to get into that evolution of people scrolling, because you’ve placed the contact down at the very bottom. I’m assuming the idea is if I scroll through this page, and now I’m at the contact, or if I’m at that point where, “Oh! This is kinda interesting. We need a call-to-action,” is that kind of the thought process behind it?

VD: Yes. Even though we have a quick link that brings the client back to the top, we still want that call-to-action to grab the interest of the visitor. So we’d want to make sure there are no missed opportunities. So let’s continue progression, so this is our website. It actually has three footers in a way. And what we mean by footers is something that is the same on every single page of your website. So we have, again, the standardized copyright information, some links. Now, this is a four-column footer. It has some additional information and it has more branding visual here and social media link, and even a frequently asked question link, as you can see. So, visually, it’s pretty, it goes with the color scheme, and so forth. Now, let’s go even crazier. So we’re working on this website this week. This is like a mega footer. They want a quick contact form on every single page. And those have become very popular with users. They’re ready to contact you, but you can have them click on contact, of course. Or have them just simply type their name, email, and message, and there we go.

VD: So again, just big, big footers. And also with responsive design and what the type of coding technique we’re using now has enabled, is those footers are responsive as well, so you can do mega footers and not be concerned about if it’s going to work on an iPhone or an iPad. I want to show you this one. It’s also under construction. As you can, I’m not sure if you are able to see how the footer is coming in into place, so you can add dynamic elements to it. Okay. So in here, they use… It’s not a contact form, it’s a sign-up for user, again, under construction, but you get the idea. It’s showing there, there are three headquarters, I don’t know, internationally, maybe some text about it in here, use it as sign-up. That could be used for occasional promotion, of course, or any other thing.

RP: Okay. Now, when you refresh the page and everything kind of came in on a mobile device, does it still have some dynamic personality to it?

VD: We have yet to decide if we want to keep it or not. We’re not at that stage of that project, but we can do either way. So it depends on how much content we’re going to end up with this website. Right now, we’re streamlining it. We had much more about homepage, and now it’s getting less and less. So if we don’t have too much, having a dynamic effect on a smart phone is totally fine. If it is a lot of content, we might want to just remove the effect, but still have the content. So column two will go underneath column one, column three underneath column two, and so forth.

RP: Alright. Okay. Very interesting. I would imagine that dynamic, at least initially, is going to catch people’s attention.

VD: Yes. And so, it was interesting, as long as it’s smooth, it works well. So, you have to make sure it’s compatible with all sorts of phones and tablets, as they are not all created equal, as you know. Now, this is one of our clients when you and I worked together on a weekly basis. Their footer is even more elaborate, because it is a law firm. They needed a disclaimer, but it is not as important, though it needs to be there on every single page. So the disclaimer is very small at the bottom, ’cause by law, they have to have it. Then they have a copyright footer, and then they have the mega footer with four different columns. The one on the right actually is for chat. Their chat is currently turned off, but you could… Here it is. Right in action. As you can see, you could actually chat with a person here. So that’s part of the footer as well. So as you can see, again, you’re grabbing, this is a fairly long webpage again…

VD: You’re at the top, “Oh, what do you want to do? Do you have a case?” Click here and chat. And I have maybe two different types of samples I can show you. I know we’re limited in time. This is actually quite a few years old, but this client was really progressive and we did the super mega of all footers. I don’t think we’ve ever done a footer that’s as big. It works beautifully well on mobile devices and it has lots of information. They have 250 pages. So having that type of footer with again, a repeat of some of the important pages for them: Their social media, icon, something they wanted clients to focus on. So four different areas, a sign-up list. Copyright is in the bottom. As you can see…

RP: That is a mega, mega footer. I don’t I’ve seen one that big before.

VD: Yeah. It’s huge and on mobile devices, as you will see… We actually got rid of many other things, so all the menus that were above the check out, check it out, on the mobile device, is gone. So, all that information here that I just highlighted in blue, we make it disappear on the mobile devices, because it was taking way too much real estate. So, all, I mean… As long as… You don’t have… As a site owner, they don’t have to know how to do it, but they should have a programmer that knows how to do it. So, as a site owner, you should demand those type of details and may say, “Oh, I do want a bigger footer, but on a smart phone, I don’t want it. I want a streamlined version of it.” And anyway, this is…

RP: Right, yeah. I think that the big issue is that people aren’t necessarily going to know. As business owners that are in the construction business, they don’t know about web design, so they don’t know what they don’t know. And that’s one of the reasons why we have this weekly discussion, is to educate people about what you don’t know, you don’t know, give you ideas, and hopefully, you can take these ideas and implement them into your business. And one of those is being not only the mega footer, understanding how people are viewing your website these days. And through a phone, the experience is completely different. And the way the people are going to behave on your website is going to be completely different on a phone. And then, also understanding that based on that, being able to take components from the website out when it’s on a mobile device, so that, again, we’re making the website very simple and easy to use for that end user, regardless of what device they’re on. So, I think that’s some great information, Virginie.

VD: Well, you’re welcome. It’s what we do. But again, as you can see, you laughed at me yesterday when we talked about footers. I’m like, “Oh, footers can be very sexy and useful on the website.” And it totally can be.

RP: I trust you. I trust you. That’s why I said yes, we will have this conversation today. I’m like, “Footers!” I don’t have a footer fetish, but…

VD: Oh, I do. I do.

RP: Hey, there’s a lot of good information in there. I am not a web designer, there’s a reason why I bring professionals in such as yourself to help me out with these projects. It’s because this is what you do and love, and you make the end product that much better. So, we are almost out of time. Are there any closing thoughts regarding footers for your website?

VD: No, simply don’t neglect it. It’s very important, it can bring you an extra sale, that extra sale you needed that month could be brought in by your footer. So…

RP: All right, and take a look at your website. I think the other thing is take a look at your website on the desktop, take a look at it on a tablet device, and then take a look at it on your mobile device, and what’s that user experience like on each device and how can you modify, if you need to, your design to make the experience better on each device?

VD: Yes. Do it.

RP: All right, perfect. With that, Virginie, as always, I appreciate your time and energy that you put into this and we will be talking next week.

VD: All right. Happy New Year, everybody.

RP: Take care, bye.

2017-10-13T23:15:50+00:00

About the Author:

Ryan Perry is the CEO of Simple Biz Support, Inc. Ryan started video blogging in 2009 as an alternative to written blogs to create visibility and credibility online.

Leave A Comment