How to use my Twitter Background Template

How To Use My

Background Template

www.Doug-Gilbert.com


First thing to do is download the template here:

http://www.doug-gilbert.com/downloads/http://www.doug-gilbert.com/downloads/

Download Template


After you’ve downloaded and unzipped it, open the PSD file in photoshop.

Open in Photoshop


Take a look at the side panel.

Pay attention to the folders and layers.

Hide Before Saving For WebThis folder contains layers that you can use as guides when making your background.

• Main Content Guides – This is where the main Twitter content box, Twitter Nav box and Twitter logo will be when you upload your background to twitter.• Sample Layout – This is just an example layout so you can get a better idea of where things will line up.

Review Layers: Hide Before Saving




Sample BackgoundsNothing special here. Just a solid background layer and a gradient background layer.

Review Layers: Sample Backgrounds




Place Your Stuff HereIn this folder (or below it) you put your design.

* When designing your background, Toggle the above Folders (Layers) off so you can see your work. Toggle them back on to see how everything looks and lines up.

Review Layers: Place Your Stuff Here


The majority of computer users have wide screen monitors and use a resolution of 1024x768px or higher. I use 1280x800px. So please note that this template works best for 1280x800px resolution.

the Guides

With a screen resolution of 1280x800px, this area won’t be seen so keep your important design elements above the 2 bottom guides.

Keep content you want visible between here

This area will be behind the Main Twitter Feed and sidebar therefore it won’t be visible

This area will be seen but depending on the screen resolution most or only half of it will be.. Keep that in mind when designing you background.

The Guides


Click the Sample Layout layer to get an idea

Toggle Sample Layer


Notice the guides

Here is a recent background I did to again show you where to place your main design images and text.Toggle the Main Content Guides layer to see where the Twitter elements will be.

Notice The Guides


And here is an actual screenshot from a Twitter Profile using the background.

(screen resolution set to 1280x800)

Twitter Profile Using a Background


Any questions please leave a comment below or leave a link to your profile so I can check out what you did.

“Save For The Web” and that’s basically it!

Things To Remember

•When “Saving For The Web” choose Jpeg and make sure your file size is under 800kb or Twitter won’t accept it.

•Again, this template is what I use to make Twitter backgrounds. It works great with screen resolutions set at 1280x800px. You can experiment with other resolutions if you like but you may have to arrange things differently.

Save For The Web

ThanksFor Viewing!

Doug Gilbert, Freelance Graphic Designer

Twitter: Facebook: Myspace: Website:

Twitter.com/itsdougFacebook.com/douggilbertMyspace.com/9795Designs Doug-Gilbert.com

Thanks