I finally got around to do something about my twitter page. How? It’s really easy. The twitter help files explanation is straight forward but I like making things simple. really simple. So here’s how to do it quickly and painlessly.

1) Select a photo from your library to use as a background
2) Open a new photoshop file, size it to 1800px by 1000px, this should cover most screen resolutions. Twitter layout is auto-centered-fix-width-div.
3) Drag your photo onto the background layer, move and adjust the size (CMD+T or Ctrl +T on windows)
4) Insert a new layer, hit M, Draw a rectangle on the left margin you want to personalize. You can use the left margin to insert custom text, logos etc. I wouldn’t make it wider than 100px because then it dissapears under the content div if your viewport is shrunk.
5) Here’s what I did: With your second layer marquee active, hit D to set your palettes to default, hit Option (alt) + Backspace to fill the selection in black. hit cmd (Ctrl) + D to deselect, drag the opacity down to about 80%, type your text or insert your tiny logo, drag it on the semi transparent left margin you created, cmd+T to twist, resize or adjust, and that’s it.
6) cmd + option + shift + s to save for web, Jpeg 75% will give you a file size of about 180K. which is more than acceptable for a twitter background (they recommend under 800k)

and here’s how I did it, quick and easy. twitter.com/kevinbhookun

Share this!