Discovering how to customise your Twitter homepage background is essential for a good brand representation, but learning how to design that background itself would definitely add value to your Twitter communication. When I was designing the background for my Twitter homepage, I discovered that there is no fixed template to begin with. This is because the size of the background is not permanent. It is variable, depending on the size of the computer screen. I tried out many canvas sizes for the background on various screen size and came out with one of the most standard size templates which works perfectly well with most screen dimensions. Here’s sharing it with all of you.

After trying so many sizes, I realised that the best canvas size to work on is 1500px (width) and 1000px (height). The most active place would only take up 1000px (width) and 800px (height). The remaining space acts as a buffer as it would only show on bigger screens.

Here’s the set of guidelines I used for my Twitter background design. The guidelines serve as an indication on where your default Twitter elements will fall on. You may download this template guide file at the links below.

The black-filled portion above is the area on which your Twitter posts, logo and menu bar will appear. This means that it is not advisable to put your design on this area as it will not be visible anyway (unless your readers have a huge screen).

This highlighted green area is what I call the Active Area. This is where you present your visuals, copy and message to your readers. It’s kept at 250px width so that no matter how small your screen is, this panel will still appear on the screen.

Now, the last part, is this yellow L-panel which I have highlighted. This is the unsafe area, which means that readers may or may not see any visuals or copy placed on this area (depending on the size of their screen). I recommend a gradient effect from yoru visual to this unsafe area (filled with solid colour which is paired with the default background colour of Twitter). That way, it will seem as if there is no end to your visual.

Overall, this is how the template guide looks like. And this is exactly what you will receive in the PSD file which is available for download at the links below.

This is how I have designed mine. Notice that the visual slowly fades into a solid black colour on the unsafe area. In my Twitter settings, I used Black as the default background. Should my visual be smaller than the preview screen size, it will blend nicely to the default background to appear as one.

And this is how it looks like on my browser now. Download your Twitter background template (photoshop file) and try it out for yourself now!

• Twitter Background Template (CS4)
• Twitter Background Template (2.0)

Popularity: 1% [?]

Related posts:

1. How to Customise Your Twitter Homepage
2. Illustrator CS4: How to Draw Ketupat Background
3. Basic Principles of Design
4. Free Vector: Simple Calendar 2010 Design
5. How to Pitch Your Logo Design