Note that I now have a generic icon for the BrainYard Stories tab, whereas before I had a small image of the colored ball icon used in our logo next to the tab. Fixing this required adding a larger image (which previously only used to be used for content displayed as an "app" rather than as a tab).
For example, the screenshot below is from a custom tab I registered to display clips of my work. Note that the small scissors icon is set, but the larger one isn't--until now, it didn't need to be.
Now here is what that custom tab for displaying a list of headlines looked like, pre-Timeline:
Here is what it looked like after activating Timeline, before making any other changes:
Note that most of the wrap-around Facebook content is gone, leaving the app floating, centered in the middle of the page with a lot of white space all around. Facebook tabs used to be limited to a 520-pixel width, but now they can be displayed as wide as 810 pixels. Designers will probably welcome having more room for larger images and other custom content, but initially the transition could be awkward.
The technology Facebook uses to embed apps and page tabs is the HTML iframe, a technique for embedding one Web page inside another. Apps and page tabs are registered using a developer tool on the Facebook website, where the developer records the URLs of the Web pages that will be referenced. When a Facebook user navigates to a tab, the website generates an iframe to contain the content from that external application.
There is now a radio-button setting in the app registration tool that lets you toggle between the 520- and 810-pixel widths for the iframe. Initially, your tab will still be displayed within a 520-pixel wide iframe, with that frame centered on the page. Here is the same tab in the 810-pixel layout.
Here is how my initial redesign of this Facebook page came out, with the tab icon fixed and a cover image added.
This could still use some love from a professional designer, but it's workable for now.
Attend this Enterprise 2.0 webcast, Rebalancing The IT-User Relationship: The Business Value In Consumerization, and learn how the consumerization of IT will ultimately help organizations drive innovation and productivity, retain customers, and create a business advantage. It happens March 7. (Free registration required.)
