Homepage Evolution: Facebook
It says a lot that when you think of Facebooks homepage, most of us already imagine ourselves logged in. Exactly what you dream of if your website is focused on supporting a userbase.
Here’s what you can learn from Facebook when improving your website onboarding.
Facebook is an exception to the rule.
Facebook’s go to market strategy was wildly successful. They were connecting college students with an online community. It started at Harvard and quickly spread to Colleges and High Schools across America. They were quickly in the highly desirable position of providing students with a place to connect, gossip and express themselves. All hidden behind a tech shaped barrier keeping most parents and teachers away.
It’s clear the desire to use the site wasn’t an issue. Making the site quick, easy and simple for a first time user was however an issue. Facebook’s homepage would make or break the growth. The vast majority of people would consider Facebooks growth a remarkable success – so let’s look at the role their homepage played.
If you’ve already checked out our articles on Amazon and Gtech’s homepages, you’ll see a massive difference.
Humble beginnings. This is one of the earliest version of Thefacebook’s homepage we could find. While time plays a factor, it’s encouraging to see how normal the website onboarding (and website in general) was at the beginning. Common early stage mistakes humanise what is now a goliath of a business with global influence.
Drawn text – The first thing that catches your eye is the body of text in the middle of the page. It provides a simple and clean description of the purpose of “Thefacebook”. Albeit drawn out in listing the existing campuses where it’s being used. While this would benefit SEO, it’s text heavy and takes attention away from the login and functions seen further down the page.
Simple – Lengthy text aside, the homepage is remarkably simple. This is a good thing. Everything on the page encourages the user to register or log in. The exceptions being the menu including the About and FAQ pages. Easy to see in hindsight but can be hard at the time.
This is more like it. They say work as a designer is finished when there’s nothing left to take away. While that’s not quite the case here, the improvement is evident. It all streamlines and focuses the website onboarding process.
Boiled Content – The text on the page has been selected carefully. Now the focus is limited to the purpose of Facebook and how to get yourself involved. Notice this early evolution focus on stripping back continues with the menu.
Use of Colour – The clever use of green to make the register button prominent seem obvious by today’s standards. Nonetheless, it’s not uncommon to see websites limit the use of colour which in turn limits the visual ques you provide for the user. Remembering that balance is key, the visuals play a driving role in determining how enjoyable it is to use your website. For the homepage, the stakes are often even higher as it is often your first impression.
This will appear familiar to many. It’s a homepage that’s reached icon status in popular culture.
The Message – There’s no room for confusion here. It would be extremely difficult to remove any further content from this page without hampering the user’s experience. All roads lead to sign in.
Simple Visuals – There isn’t a seismic shift here. A subtle gradient and the introduction of a visual to reinforce the global scale and reach of the Facebook community.
Eye on Data – As understanding the user is key to optimising the Facebook experience, the data gathering process begins as early as possible.
This homepage really focused in and performed a remarkable task for Facebook. So much so that there were no significant changes to the overall structure until almost 10 years later. This is nearly unheard of for such a successful website.
The only notable design change was increasing the size of the inputs associated with registration. Changes to the content and navigation introduced over this period were largely strategy driven. Content focused on the emergence or smartphones and the Facebook App’s evolution for instance.
As you can imagine, times had changed in the near decade that passed. As did design. The modernisation effort was pragmatic.
No Header – It’s a quite bold move but in this case it is fitting not to have a top menu. When all roads lead to sign in, why not literally make it the focal point of the page. Leave the rest to the footer.
Minimalist Design – In line with the overall theme of consistently streamlining, the design is minimalist. The white background behind the registration draws your eye to it and the rest is history.
Footer Phenomenon – Like menus, footers tend to be a tempting place to shoehorn or offload a bunch of links and references that are rarely relevant or of use. Facebook had perhaps been slightly guilty of bloating the footer in previous years. More recently, a conscious effort has been made to reign footer content back in to the essentials.
Facebook’s Homepage Evolution
Like all user-driven community and networking sites, Facebook’s aim for the homepage has to be to acquire users. Initially there was excess information in the form of text, links and pages. This was streamlined and boiled down to the very core over the early years. If it didn’t help users register it was quickly removed. This hard work on the homepage drove success and growth. Let’s look at a few key lessons to take away when improving your website onboarding.
Improving Your Website Onboarding
#1 – Less is More | While users love seeing clean, minimalist design (thanks Apple), it’s painfully common to see websites become cluttered. Especially homepages. It’s the cures of knowledge; you have so much you want your user to know. We hear it so often, yet it’s still preciously rare to see a ‘less is more’ approach successfully implemented. Achieve more user acquisition by saying less during website onboarding.
#2 – Simple is Best | Facebook have been able to keep their homepage simple from the beginning. From choosing wording of text and buttons, selection of colours or general structure of the page. Although hard to put their finger on, this simplicity has a strong sway on an users overall experience of using a page or website. Making your homepage (and website) easy to process and digest for users smooths the process and reduces drop-off.
A Final Thought
We love website development, so we keep a keen eye on the different options, offerings and trends out there to stay ahead. It’s also about bringing our own style to the work be do and ensure we can give the best advice possible. We don’t have any ties to any of the parties mentioned. Our advice is based on experience, research and personal preference. We’re confident it will help you make a decision on what’s best for you. Naturally, we’re also keen to hear feedback and answer any questions you may have.
The aim of our blog is to share our experience and advice in the hope it saves you time, hassle and money. We’re keen to hear your ideas for future posts so if you have any questions or requests please don’t hesitate to get in touch. Thank you!
At Ngage, we’ve had the pleasure of developing websites for amazing organisations and entrepreneurs from around the world. From clean landing pages for aspiring start-ups to a ‘first of its kind’ tourism data platform for one of the most respected tourism data research organisations in Europe. So what have we learnt so far? More importantly, how can we use it to help you?