How to Make Efficient Twitter Background that Fits Most of the Screen Size

twitter logo
Twitter is not only become a Trend, it’s also an unique marketing and communication platform. Twitter comes with few preset themes, yes they have some glitters but those are used by millions of people. So why not make your own Twitter background Image that will show off your uniqueness, at the same time give different and outstanding impressions. Well, design is easy for the designers to do but not as easy for anyone to implement it. I am not a designer and I only know a little bit of here and there, so it was pretty tough for me. Anyway, you should know there are almost a hundred types of Screen resolutions peoples are using and almost impossible to fit the background for any screen size. So you need to narrow down the audiences. Now a days most people uses screen resolution higher than 1200 pixels. So we should narrow down and try to make the screen work for 1200 or higher pixel display. I’ve seen several sites those who made twitter background image of 2048 pixel width. A jpg file with that wide view would be more than 400KB easily.

So how to cover any screen size higher than 1200 pixels? Here is how:

  • Unless we are decided to use a tiled image, we should put our designs aligned to the left and top, basically you have some space on the left and top
  • Anything information or art objects you want to put on the left side keep them in between 200 pixels width
  • Do not cross the height of 570pixels for any of your information or photo objects
  • If you have a background scenery object/gradient, just make sure they fade out to a single color on the right side, because twitter allows you to setup your bakground color, so you can match the fade to background color to your twitter background color, Savvy!!
  • Do not use horizontal lines, in case you use then fade them out to the right and blend it to your selected twitter background color. Also remember there is not much of spacing left in between twitter logo and twitter posts, so align it nicely
  • Capture your twitter screen and set it as photoshop layer, set the transparency to 10% so you can align your objects accordingly

My Twitter background graphics
Here is a screenshot of my twitter profile. The photoshop psd file includes the exact template. After making the JPG it is 47KB in size.

Advertisement

Well this should do it, rest it upon your graphics skills (talking like I’m so pro, funny i know!). I’ve seen people designed their twitter background which is almost 600KB jpg file, trust me its not easy for a browser to download and display a 600KB background jpg. With a little bit of creativity you can put an impression within 150KB or even less. Feel free to download my photoshop template that I did for my own Twitter background. I know it might not be so nice as you expected but it should give you the overall idea and a head start. Don’t forget to check out my twitter Profle or follow me on twitter.

Now here is the file you want…

Advertisement
In Category: Articles, Resources
Show 24 Comments
  • Integraphix Designers May 16, 2011, 10:19 pm

     Veeery nice. Love it! I’ve been wondering what size that is and deciding whether I want to do that for a little while now.

  • Georgia September 26, 2010, 4:40 pm

    Spot on as always. Love my Ruhani. – Georgia aka mamagg

  • Jay Gentile July 23, 2010, 6:18 am

    Thanks for the template for creating the twitter backgrounds. Its nice to see how you made it functional for most people screen size. Great use of information, thanks again.

  • Ruhani Rabin May 13, 2010, 3:47 am

    If you didn't noticed, the background I've provided is pretty optimized even
    for a slower connection :)

  • Nicole Adrian May 13, 2010, 3:32 am

    Thank you for the zip file of the template! IMO, it is really better if you can make your twitter background optimized for the web with a smaller file size instead of uploading the same one with twice or three times the size; especially for folks are still using a dial-up connection. I strongly believe that consideration to the other uses will lead to a better follower base.

    If I remembered correctly, I passed by to a site that shares “hot twitter backgrounds”, “cute twitter backgrounds”, “retro twitter backgrounds”, and many more for free. The site can be helpful for someone who needs inspiration while creating their own background or someone who simply needs a new look to their twitter profile.

  • Arun Basil Lal February 28, 2010, 9:29 am

    Thanks for sharing the zip, You got a nice one there :)

  • andy February 24, 2010, 4:34 pm

    thanks ruhani

  • AdityaNayak January 1, 2010, 5:59 pm

    Thanks a lot for sharing. Nice work

  • AdityaNayak January 1, 2010, 12:59 pm

    Thanks a lot for sharing. Nice work

  • gisnap December 23, 2009, 5:24 am

    Its really cool, I came to know this really worth visiting, just bookmarked your site.

    http://gisnap.com/
    The place where fun never ends

  • BinaryHaiku November 22, 2009, 11:16 am

    Liking the new twitter background.

  • Ruhani Rabin October 21, 2009, 7:00 am

    Mark it could be your browser and anyway you can always reposition the links in photoshop :)

  • WAN NUR IZZATI October 11, 2009, 9:01 pm

    thansk for sharing.. good job

  • Deb September 4, 2009, 8:53 pm

    You are a genius! Thanks for sharing your knowledge with NEW Twitter members!

  • James F July 19, 2009, 6:45 pm

    Nice article! I usually leave the right side with nothing because different resolutions will make it disappear behind the main wrapper. The left side is all game though and I agree with you 100%!

    Thanks for your time writing.
    James F.
    Free Twitter backgrounds

  • DotSauce July 17, 2009, 2:38 pm

    I don't know if it's just my monitor or what, but your URL's below the Twitter navigation links are a bit too low. Bottom of the text is cut off a bit.

    Thanks for this though, cheers.

  • aithnejarretta July 17, 2009, 11:01 am

    Thanks so much for the help! Yay! My page looks super. ;o) ~ Aithne

  • Daniel July 9, 2009, 3:04 am

    Hi, thanks a lot for the information. Found it extremely useful.

  • Thomas Dolby June 7, 2009, 6:35 am

    The zip ist broken, its 0 kb when downloaded

  • Thomas Dolby June 7, 2009, 4:35 am

    The zip ist broken, its 0 kb when downloaded

  • Ruhani Rabin May 16, 2009, 2:38 pm

    can you try to download again please =)

  • firedealer May 16, 2009, 4:08 am

    I'm not sure if it's a bug but some reason I can't download the psd file here?

  • facebook-616957628 May 15, 2009, 1:41 pm

    Nice work. . .thanks for sharing ideas. . sometimes I feel so lost!

  • Christiana February 8, 2009, 6:05 pm

    Thanksfor the tips. I was wondering how some people had that type of info in their Twitter profiles. I didn't realize it was just a graphic !!