Facebook redesigns its “Like” button

Default avatar.
June 30, 2016
Facebook redesigns its “Like” button.
Those Facebook buttons that you just can’t live without because you’re always using them to engage with your friends and family, and the site’s content, have gotten a noticeable makeover. The new design signals a shift to more space-conscious design by the company, as well as a tendency to combine old design into something entirely new. In a post on the company’s developer blog, Facebook reveals the reasons behind its decision to revamp how its social-sharing look. For starters, the biggest design change affects perhaps the social network’s most prominent button: the Like button. Liking is so ingrained in the Facebook experience that one can’t imagine the site without it. This is perhaps why the most significant changes were made to this button. The company performed copious qualitative and quantitative research to determine if their initial hypothesis was correct: They believed that more users would understand the straightforward thumbs up icon on the Like button, as opposed to the old design that featured the company’s lowercase “f” logo in the button. When their testing told them that their hypothesis had some substance to it, they implemented these changes to the site. In addition, the new Like button features a unification of two, separate icons. The old design separated the actual Like button from the number of likes that are registered beside the button. The new design seamlessly melds these two elements, combining the icon, the word “Like” and the overall number of likes into one, longer, rectangular blue button. Besides the Like button, the Share, Save and Follow buttons get a different look, too, all based on Facebook’s new “cleaner design” approach. Essentially, its suite of social buttons has been modernized. This means that each button receives an updated icon that can better represent the Facebook brand while at the same time offering a superior user experience to people on the network. This dedication to better engagement includes the following design properties:
  • A consistent color
  • A flat button shape
  • A refined visual style that integrates the Like and Share counts within the button
Never one to neglect mobile, Facebook is also thinking of mobile usability in its button redesign. More than 30% of the engagement from people clicking or tapping the Like button comes from mobile, so the company is addressing mobile friendliness, too. In an acknowledgement that the original version of the Like button is now obsolete as it was designed in the infancy of mobile, Facebook has released a variety of different button sizes. This means more freedom for designers and developers who can now decide on the specific button size to use with their desktop or mobile site. Interestingly, these new button designs are also going to appear on Facebook’s Instant Articles in the next few weeks. Look for the new buttons at the bottom of those pages. They’re going to count toward aggregate share, like and follow counts. Facebook won’t roll out these new buttons everywhere at once. Instead, you’ll probably see a trickle of these new designs popping up here and there on its site and apps over the next few weeks.

Marc Schenker

Marc’s a copywriter who covers design news for Web Designer Depot. Find out more about him at thegloriouscompanyltd.com.

Read Next

Exciting New Tools for Designers, September 2024

This time around we are aiming to simplify life, with some light and fast analytics, an all-in-one productivity…

3 Essential Design Trends, September 2024

September's web design trends have a fun, fall feeling ... and we love it. See what's trending in website design this…

Crafting Personalized Experiences with AI

Picture this: You open Netflix, and it’s like the platform just knows what you’re in the mood for. Or maybe you’re…

15 Best New Fonts, August 2024

Welcome to August’s roundup of the best fonts we’ve found over the last few weeks. 2024’s trend for flowing curves and…

Turning Rejection into Fuel: Your Guide to Creative Resilience

Rejection sucks. And for some reason, it’s always unexpected, which makes it feel like an ambush. Being creative is…

20 Best New Websites, August 2024

The overarching theme in this selection is simplicity. Minimalism never really goes out of fashion and with good…

Free AI-Website Builder, Scene, Helps With the Worst Part of Site Design

AI website design platform, Scene As we’ve been hearing constantly for the last couple of years, AI will soon replace…

Exciting New Tools for Designers, August 2024

Welcome to the August toolbox. We’ve found goodies for designers, developers, project managers, domain admins, and…

3 Essential Design Trends, August 2024

As all the youngsters prepare to go back to school, you can tackle some learning too with these website design trends.…

How to Start a Creative Venture With No Money

Starting a creative venture with no money can be challenging, but it's definitely possible with the right approach and…

15 Best New Fonts, July 2024

Welcome to our monthly roundup of the best fonts we’ve found online in the last four weeks. This month, there are fewer…

The Power of the Human Face in Web Design

First impressions online are made in just a few seconds, so nailing your web design is crucial. Among the many elements…