When you ask Facebook for code to put a "Like" button on your website, you are given a choice of these typefaces: arial, lucida grande, segoe ui, tahoma, trebuchet ms, and verdana. Given that they are all pretty similar, what are some considerations in choosing among them? Recommendations?

  • Can you only specify one, or can you specify a sequence, as per CSS font-family rules? – e100 Feb 7 '12 at 14:55

I assume you're using this script to generate the "Like" button. It appears that the default, if you don't select any font, is to try Lucida Grande, Tahoma, Verdana and Arial in that order, and to fall back to the browser's default sans-serif font if none of those are available. If you do select a specific font in the form, it uses either that particular font or the browser default sans-serif font.

Given that, if you're not using any of the listed fonts on your page already, and don't have any strong preferences between them, I'd just go with the default (i.e. don't select any font in the form). It's likely to look OK to most users, and match what they're used to seeing on other sites.


Just so you guys know, it seems that Windows only likes Trebuchet MS as the specified font when you select the XFBML version of the Facebook Like button box_count layout that displays the Send button underneath the main Like button. Use any other font selection than Trebuchet MS and the word "Send" gets cut off on the right side on Windows. Mac is fine either way. You can see this in action by going to the main Facebook Developers Like button page and specifying XFBML, checking the Send box, and selecting box_count layout.

Not the answer you're looking for? Browse other questions tagged or ask your own question.