Hilinsky Consulting Social Media Blog

Facebook recently announced that custom tabs hosted on fan pages will soon have to re-format according to a new significantly reduced application canvas width. In the near future, more space for advertisements will be claimed on your favorite social network! Facebook Developers are told this is coming in ‘Early 2010′. Are you ready?

Most customizations which are hosted on a fan page are actually custom FBML applications. For many who currently host custom tabs, it means that some big changes are going to have to be made. This will effect thousands of applications which are live on Facebook and loosing 240 pixels vertically on your UI (to ads) isn’t something that most developers, marketers or business owners are really looking forward to.

This diagram to the left shows proportionately how much UI space we’re talking about. (Ouch, 31% less.. larger ads? Less content for users?)

240 pixels is a big compromise when your company is trying to market a fan page and utilize the already small space provided.

Here’s what you need to know about change: previously, all Facebook fan page custom tabs had 760 pixels of space horizontally to present their data.. this was what’s called a canvas size. Vertically you can make you page as long as you need to, but it had to stay within 760 pixels to make sure all the other page elements fit.

Facebook is saying that very soon they will launch a new canvas size of 520 pixels for all applications hosted as a custom tabs (to make way for new UI elements and more ad space.)

Here’s more information from Facebook describing the change from their API roadmap:

“Application tabs (including static FBML tabs) will be the only way to integrate applications into profiles and Pages. Application tabs will shrink from 760 pixels wide (today) to 520* pixels wide to accommodate a slightly revised design. Boxes, info sections, and the Boxes tab will be removed in the near future.

In the longer term we are evaluating a number of new and interesting ways for you to help users express connections to your applications as a part of their identity. You can expect to see some of this thought emerge in future iterations of the profile.

*Note: We previously stated that profile tabs would be shrinking to 510 pixels. Our latest designs indicate they will instead be 520 pixels. We’ll keep this page updated with the latest information.”

Here are some things to consider regarding this upcoming change:

• When will this change go live? How much time do you have? Answer: it hasn’t been published yet when this will go live. Typically you have a brief window of time (like 30 days) to fix your app before it starts to break. Any customizations will have to fit within a 520 pixel canvas space and that will require time to redevelop your applications code.
• Facebook hasn’t published much information on how the ad framing will look either (how it will be framed) – make sure that if you’re resizing or shrinking your application, that you consider the text size of your app. If you shrink down your UI to fit the reduced amount of space, make sure your fonts are still the same size or larger than the advertisements surrounding. Otherwise, you’re customizations will simply become overshadowed by the surrounding elements.
• After the change has taken place, your application will break and most likely discontinue to load once the change has gone into effect. If the application still loads, it will become cut off on one side. Beware: don’t expect Facebook to automatically resize your application for you – this will be something that needs to be done on a individual, code level basis.
• The vertical canvas size is still unlimited, you can have your app as large as you need it (although realistically, you should set boundaries to reduce your page load time!)
• IMPORTANT: This change does not effect applications which are NOT hosted as custom tabs (ie. if you application is accessed using a direct view URL). This mean that you can still have promotional landing pages (which are custom applications) hosted inside Facebook.. however if you host the application as a ‘tab’ on a fan page you will be subject to abiding to the new width limitations. Many applications that are NOT hosted as custom tabs on fan pages will not have to change their UI.
• Contact our team if you have a Facebook application which might require a UI redesign, our team can provide a quote on the cost to take your existing UI and keep your application within proper code. We understand there’s going to be a lot of confusion when this goes live, some people might not be ready. We provide solutions!

Common Question: What’s a good, quick strategy for updating a custom fan page (application UI) on a budget? I don’t have time to entirely redesign my custom page or application but I want to keep it linked to my fan page.

Solution: A good fix is to to use a 520 pixel splash page to transition from your tab view for the application to the direct app view (which can remain at 760 pixels). Using a splash page like a simple image with a link tag can be a quick fix to keeping your application live, but keep in mind that adding a splash page image can in the long term reduce your traffic due to the increased number of clicks to access the content. (Really, adding 1 click can really make a difference – but it can keep your application at least functional for the time being without an entire UI redesign)

For more questions contact solutions@hilinskyconsulting.com. Stay tuned to our blog for more information  about this change, we’ll post updates and new articles regarding the new roadmap changes in the pipeline for 2010 (there are a LOT!)

Article by Michael Bobrowski

2 Responses to “Facebook Fan Page Tabs Change to 520 Pixels”