Examples of Facebook’s 20% Text Overlay Rule

The popular social media giant, Facebook, revised the company’s Facebook Pages Terms on December 17, 2012.  The two major revisions have to do with text overlay on page cover photos and News Feed Ad photos.  The News Feed Ad photo rule is set to go into effect on January 15, 2013, and the 20% rule for Timeline cover photo has left many page administrators with questions.

How does one determine 20% of the cover image, and why would Facebook make these rules?

Facebook’s Page Cover Image Terms

Facebook is very clear what may not appear on page cover images.  The Facebook Page Guidelines that were revised on 12/17/2012 clearly state:

Page Features – Cover

All covers are public. This means that anyone who visits your Page will be able to see your cover. Covers can’t be deceptive, misleading, or infringe on anyone else’s copyright. You may not encourage people to upload your cover to their personal timelines.

Covers may not include:

  1. Images with more than 20% text;
  2. Price or purchase information, such as “40% off” or “Download it on socialmusic.com”;
  3. Contact information such as a website address, email, mailing address, or information that should go in your Page’s “About” section;
  4. References to Facebook features or actions, such as “Like” or “Share” or an arrow pointing from the cover photo to any of these features; or
  5. Calls to action, such as “Get it now” or “Tell your friends.”

Practical Examples of Facebook Cover Images that comply with the 20% Rule:

The math is fairly simple to determine what 20% of a Facebook cover image is.  The square pixels are calculated by multiplying the width by the height and then multiplying the result by .20.  This will give you the 20% square pixels.

851 x 315 = 268,065 square pixels x .20 = 53,613 square pixels

Below is a sample cover photo with three examples of areas that are approximately 20% of the Timeline cover photo.  This example provides a visual picture to give you an idea of possible text area dimensions.

Please note:  The intent of the graphic below is to show examples of what 20% of a Timeline cover photo might look like.   Hugh Briss of Social Identities states:

“There’s nothing in the rule that says our text has to fit into a specific area. The rule simply says that our cover images cannot be more than 20% text.”

Facebook cover image example

Actual Examples

Example #1
The following is an actual example of the Social Solutions Collective’s Facebook Timeline cover photo.  The text in the lower right hand corner on the image is approximately 7,840 square pixels which falls well below the 20% or 53,613 square pixels maximum limit.

Social Solutions Collective Facebook cover image

Example #2

This example is an actual cover image for ME Marketing Services, LLC. As you can see, the text on this image is in different places.
ME Marketing Services, LLC Facebook cover image

For this example, the text areas on ME Marketing Services, LLC’s cover image are indicated in the red boxes below.

ME Marketing Services, LLC Facebook cover image

The math on this one is a bit more complicated and I’ve used Photoshop to determine the areas:

  1. Box 1: 59 pixels x 15 pixels = 885 square pixels
  2. Box 2: 59 pixels x 15 pixels = 885 square pixels
  3. Box 3: 41 pixels x 20 pixels = 820 square pixels
  4. Box 4: 130 pixels x 30 pixels = 3900 square pixels
  5. Box 5: 105 pixels x 23 pixels = 2415 square pixels
  6. Box 6: 402 pixels x 15 pixels = 6030 square pixels
  7. Total: 14,935 square pixels – well below the 20% or 53,613 square pixels maximum limit.

Unfortunately, the average Facebook Page owner may not have access to photo editing software to determine the exact dimensions of the text overlays. This leads to the question on how Facebook will actually monitor the text on cover images. Perhaps Facebook will come up with a grid-based text overlay detection tool for cover images. Inside Facebook reports the following about page post ads:

The company is developing a grid-based text overlay detection tool to identify non-compliant images. A version of this tool will be available within Power Editor to help advertisers know in advance whether their images will be approved. Advertisers should keep in mind that text within logos will also count toward the 20 percent limit.

Facebook’s Advertising Guidelines for Images

Facebook also updated the companies policy regarding images used in ads and sponsored stories on 12/17/2012, however, this will not go into effect until January 15, 2013Facebook’s Ad Guidelines state:

Ads and sponsored stories for News Feed that originate from Pages may not include images with more than 20% text (effective January 15th, 2013)

In addition, ads and sponsored stories that originate from Pages may not contain an image with the text are subject to the same rules as stated above under what “cover photos may not contain.”

Why is Facebook implementing the new 20% text overlay rule?

The reasons as to why Facebook is implementing the 20% text overlay rule can be found in the company’s Page Post Best Practices that outline the company’s goal for quality.  Facebook states:

Facebook people react negatively to content that they perceive as inauthentic or impersonal. Since text is rare in photos from friends, text in brand photos triggers negative emotions in people. Instead of introducing text in your images, choose photos that send a message or tell a story on their own without words.

In addition, Facebook has included the following in the “general best practices”:

Keep it simple. People should be able to tell what your image represents without having to scan your photo for minor details or read fine print. The simpler the image, the clearer your brand message will be.

Focus on quality. It’s a simple thing, but make sure that your photo is of high enough resolution to represent your brand in a positive light. Basic screenshots are often low quality, can appear grainy, and may cheapen the effect of your post.

Your turn

What do you think about Facebook’s 20% text overlay rule of cover photos, ads and sponsored stories?  Have you updated your cover photo yet to comply with the new rule?

Robin Strohmaier

Robin Strohmaier

Lead web designer and owner at R & R Web Design LLC
Fascinated with the growing potential and power of the Internet, Robin founded R & R Web Design LLC in the Chicago area in 2000. As creative director, she is passionate about helping others reach their Internet objectives through a strategic online presence with results driven custom web design, ethical SEO and marketing.
Robin Strohmaier
Robin Strohmaier
Robin Strohmaier

Fascinated with the growing potential and power of the Internet, Robin founded R & R Web Design LLC in the Chicago area in 2000. As creative director, she is passionate about helping others reach their Internet objectives through a strategic online presence with results driven custom web design, ethical SEO and marketing.

Posted in Facebook
27 comments on “Examples of Facebook’s 20% Text Overlay Rule
  1. SO GLAD someone addressed this! I’m personally really happy that they’re doing this. It makes marketers actually work for that they’re selling/pushing. I will be sharing this EVERYWHERE!! Thank you.

  2. Oretta Norris says:

    Great post very informative. :)

  3. Great job…

    Your examples are clear and make it easy to see what 20% actually equals. I think it’s a good amount of space. I don’t have a problem with it personally!

    THANK YOU for being so precise!

    Roz

  4. Awesome – This is super helpful. Thanks!

  5. Mallie Hart says:

    I’m surprised some other graphic artists haven’t come out and said something about this. It’s persnickety, but true. UNLESS you’re using a block font that would render itself absolutely illegible, no text will actually take up the spaces they’ve delineated. With kerning, space inside letters like B, D, and O there’s a ton of space NOT taken up by the text.

    As I said, it’s persnickety…but it might just buy you a little more space for text if argued passionately and with some good hard graphic facts behind you! :)

  6. Fantastic post! Thanks so much for the visual examples. That clears it up SO much better! It will be interesting to see if FB loses some of it’s charm for marketers. After all, we were marketing online waaaay before FB came along :)

  7. Robin, thank you for doing this! I had started to blog about it and kept getting pulled away. I think I’ll just share your article instead :) Instead I am going to do one addressing the possible reasons for some of the changes that seem counter intuitive.

    • Hi Alisa,
      Thank you, Alisa, for taking the time to comment and for letting me know that you found this post helpful enough to share :-). There does seem to be a great deal of discussion on how Facebook is going to monitor the text overlays on cover images… Your idea about the possible reasons sounds great. I look forward to reading it!
      ~ Robin

  8. Joey says:

    Thanks so much!! This was EXTREMELY helpful!!

  9. Hi Robin, I ended up adding a drag and drop tool to our blog and linking to this post. I thought it would be nice to have an easy way to calculate 20%, so had our programmer put tool together: http://scalablesocialmedia.com/facebook-cover-image-guide/ .

  10. Kerry Armour says:

    Thank you so much for this. It’s thorough, comprehensive and very useful! No way anyone won’t ‘get it’ after reading this! I’m curious to see if folk drop the font size in their images in order to say more!

  11. Nancy says:

    Robin, this is the first article I have read where I understand how to figure out the 20% rule. The graphics are amazing. Fantastic explanation.

  12. Marilyn says:

    I just hope I can figure this out and not get in any trouble with Facebook.

  13. hagar says:

    yours and Shortstack’s were the two most useful posts on this topic. I’m writing one as well, and will qoute you in it. Good job; great post!

  14. Antonio says:

    Hi Robin,
    thanks for this article, it’s simple and very useful!
    I Really appreciate it :)

Join your peers and receive our latest articles by email.

That email address is already subscribed, thank you!
Oops. Something went wrong. Please try again later.
Please provide a valid email address.
Thank you, your sign-up request was successful! Please check your e-mail inbox.
Please complete the CAPTCHA.
Please fill in the required fields.

Categories

Contact us today!

+1 (248) 889-0266

Let’s Connect