Written for BookPromotion.com, March 23, 2013
A common complaint I hear from authors and other clients regarding social media is the lack of options available to customize that design. That it’s hard to stand out from the crowd on Twitter and Facebook, particularly.
I respectfully disagree. Look at what a yardsale MySpace became by allowing its users to go nuts with animations, fonts, color, and more. From the start, the two most important social networking properties—Twitter and Facebook—have been very deliberate in the options they offer users in terms of design. But what you do with those options can help you stand out and promote your work.
I recently redesigned the social media properties for The Rookie Moms, two Bay Area based authors (Heather Flett and Whitney Moss) who maintain a vibrant online presence. In this article, I’ll show you how I put their social media pages together and used the design options to bring them to life.
Let’s Start with Twitter
The most valuable design real estate on your Twitter page is your background image. It’s recommended that your total image size should be 1600 x 900px. These proportions will have you covered for most screen resolutions—particularly the most common, 1024x768px. I built mine in Adobe Illustrator, collaging together different images to create one cohesive message. You can use any photo or image editing software that you are comfortable with.
Just to the left of your tweets on the body of the page provides an excellent space to for branding. The space will expand and contract based upon the user’s screen size. But if you allow yourself a narrow column of no more than 225px, you should have enough space to create a visible on most screens.
For the Rookie Moms, I stacked their logo on the patterned background (which echoes their site), right on top of their tagline. I placed their two book covers below, and then their author photo. The result is consistent, but not overwhelming—you get a great sense for the Rookie Moms brand, their books, and identity.
To change your background image, go to SETTINGS > DESIGN > CHANGE BACKGROUND IMAGE. Do not check the box to tile this image unless you don’t mind the information you included in the left bar to repeat. Rather, you can also choose a complimentary background color to fill in where the image stops tiling.
Twitter also allows you to change the background of your profile image. The recommended size for this is 520x260px. For this space, choose a color, pattern or photo that will set off your profile picture. This is not a good place to use type—Twitter silhouettes this image with drop-shadows, so it’s best to use a complementary image. To edit this image, navigate to your home page and click the EDIT button in the upper-right-hand corner of the screen.
Last, choose a profile picture that best reflects you or your brand—this is what will carry through to each of your messages and your profile image. The size for this is 81x81px. To edit this image, click on your profile image and follow the prompts.
Now, Facebook
Before Timeline, Facebook offered users few options for customizing their pages. But now, with Timeline, you can edit the background image of their page’s header—sized to 815x315px.
Creating a great Timeline cover can be a little challenging, since you must design around the space where your user icon is, so let’s start there. This image should be sized as 180x180px and ideally oriented as a square. (I’ve seen far too many people try to shoehorn different shapes in their profile image, with odd results.) Like Twitter, your Facebook profile picture is your first impression to the world at large, so choose wisely. The Rookie Moms chose to have their stick-figure mom logo as their icon rather their individual photo since it was more tied to their site and thus their brand.
Now, consider your Facebook timeline image—think of this as a billboard promoting you and your books. Again, I used Illustrator to compose this composite image. For the Rookie Moms, I pulled the blue striped background from their existing site to use as the timeline background. Their logo and tagline are the first things that leap out with you in the upper left corner, the same place you find the logo in most other sites.
In the open space to the right, I put the book covers (along with the titles) in the right-bottom corner and author photos (along with their names) in the upper right. This space is always a great place to craft a custom message of some sort—and balances nicely with the icon in the lower left. Make sure you are leaving at least a 125px margin around the left corner, where the logo will go.
Facebook makes it very easy to edit your page. When you are logged in, simply click on the image you want to edit, and follow the prompts. The best advice I can offer here is to make sure that your images are sized properly so they are distorted as Facebook places them in the template.
Making these changes can help you pull together a branded, beautifully designed social media destination that will help you stand out—but not in a MySpace kind of way. And that’s a good thing.