Step one: Finding out what resolution to use
First I took a look at my website analytics tool (mine being google analytics) and checked out the user settings page. It basically told me that the visitors that come to my site have 4 screen resolutions that, in total, make up over 98% of my traffic. Keep in mind that those visitors are to my website, not my twitter, but I can make a good assumption that most of my web visitors look at my twitter and vice versa. Here is the breakdown of that list:
Step two: Selecting the template
So based on those stats I can assume that over 80% of my visitors that look at my site have a screen resolution of at least 1280×800 px. Going off of that, I am going to open up my template in photoshop and work my design around that. The PSD template is at the bottom of the post, download it and open it up. The PSD file is a large file with 5 layers. Each is a template for the four screen resolutions that I described above. Take a look at your web stats and see what most of your users’ resolutions are. If for some reason you dont have web analytics, just go ahead and use the 1280×800 tehmplate, as it is probably the most common screen resolution these days. Here is a screenshot of the template.
Step three: Filling in the blanks
Now all you need to do is make visible the resolution of your choice and put your logo design just to the left of the twitter content. I chose a horizontal layout to match the design of my website, but you can also do a vertical one like the one below.
Step four: Save and upload
Now make your design and save it as a JPEG and upload it to twitter, and you are all done! Feel free to take a look at my twitter to see how mine came out. I hope you found this tutorial useful, and If you do decide to make one (or if you have any questions), shoot me a comment or a message and Ill be glad to help out. Good Luck!
The PSD link doesn’t work.
I just tested it and it seems to be working for me on IE, Firefox, Chrome, and Safari. What browser are you using?
the link to psd site doesn’t work. tried on firefox, safari & IE.
keeps going bk to home page.
The link isn’t working for me either. I’m using Firefox.
Sorry about that guys, ill put up an external link to it, gimme a minute.
This is a really great tutorial and thank you for creating it. If you feel like creating a video of this tutorial we have a $1000 USD contest running for the best video tutorial. We are a social learning network and we would love to have great work like this displayed for everyone to learn from. Check us out @ http://www.gurushare.com, but regardless, thank you again for a solid tutorial.
Great result. Twitter is really taking of at the moment as well!