1. Computing

Twitter Header: Basic Tutorial

New Twitter Design Introduces Custom Header Images


Twitter header

Adding a Twitter header image


Twitter header images for profile pages are a design change the microblogging service implemented in September 2012 as part of a new Twitter design to revamp user profile pages. The result? Twitter profile pages look a bit more like Facebook profiles, chiefly because of the introduction of Twitter header images.

"Twitter header" refers to the new, oversized, horizontal image introduced at the top of a user's profile page.

Design changes announced in September 2012 gave each user a big header image and more room to personalize the look of their Twitter profile page. Before September 2012, there was no big image, just a small profile photo which was displayed inside a little box at upper left on the user's Twitter home page/profile page.

Now the header image serves as the background for all the profile information.

Embedded or superimposed on the header image is the user's profile info, including:

  • a small profile photo
  • the user's name
  • the user's Twitter handle
  • web address
  • short bio

The 2012 design changes also were intended to make profile pages more effective for viewing on mobile screens, by enlarging and putting user profile iamges more prominently atop the tweet timeline on user's pages. Twitter CEO Dick Costello debuted the new profile pages on the "Today" show.

Another design change announced at the same time was the display of photos right below each user's three most recent tweets, via a small, horizontal photo strip on mobile apps. It's swipeable, so you can swipe to see more photos from any particular user. Twitter announced updates to all its mobile apps at the same time it revamped the profile pages.

Twitter Headers: Sizes for Customs

The addition of a custom Twitter header graphic was the biggest design change announced in fall 2012. The size of the new horizontal image that you can upload to serve as your Twitter profile graphic should be 1200 pixels by 600 pixels (Twitter's recommendation for the optimal dimensions.) File size is capped at 5 megabytes.

You can upload a larger image and crop it with Twitter's tool to fit the actual header size. Ultimately, the web display size will be 520 by 260 pixels--so at the very least, your image needs to be that big.

To activate the new profile layout, all you have to do is upload a horizontal header image.

How to Add a Twitter Header Image

Here are the steps to take to upload a header image in Twitter's new layout:

  • Click the "ME" button on the top of your Twitter navigation menu.
  • Click the gear/settings icon in the horizontal menu at the top of every Twitter page
  • Click "Edit Profile" beneath your Twitter name in the drop-down menu
  • Click "DESIGN" in the menu at left
  • Click the "Change Header" button
  • Select the image from a folder on your computer and upload it.

White Type in Twitter Custom Header Image

Twitter's new profile design superimposes the user's Twitter handle, name and biographical blurb on their header image using white typeface. So it's a good idea to use a darker image or one that doesn't have too much white in it, considering the header image will serve as the background behind the font.

Some people may also want to coordinate their Twitter header image with any background image they have uploaded to Twitter, since the background image appears on either side of the tweet timeline in the 2012 Twitter design.

For more guidance on optimal use of the header image on Twitter, check out Mashable's Twitter header examples.

All in all, September was a big month for Twitter. Consider:

  • At the same time it revamped profile pages, Twitter also introduced new versions of its mobile apps. One nice touch is how you can tap a photo and have it open in full screen for easier viewing on your smart phone. More link-sharing functionality has been embedded in mobile tweets, too.
  • Twitter also rolled out an expansion of its interactive tweet box functionality, allowing these interactive tweet boxes to be more widely and easily embeddable across the Web. Twitter's developer blog explained more about how to create interactive timelines for embedding. One example is viewable on author Margaret Atwood's website.
  • Twitter CEO Dick Costolo said in a talk at the Online News Association that he hopes Twitter will be able to offer a long-requested capability by the end of this year -- letting users download ALL of their tweets, CNET news reported. Costolo also promised better curation tools to let users do a better job of selective retweeting at live events, for example. He further said Twitter will soon allow even more interactive functionality inside o tweet boxes.

©2014 About.com. All rights reserved.