We've Moved!

That's right, our new blog is www.DotComConfessions.com.


There you can find everything that was here, and so much more!









Monday, March 23, 2009

Twitter - Create a Custom Background, Keep Twits Informed

If you spend any time on Twitter, you've noticed the trend is fast growing to have a custom background for your Twitter page. The developers of Twitter were generous in developing a way for users to add custom background images and leaving the size limitations up to the user. If you so choose, you can upload a 1600 pixel wide by 1100 pixel tall background loaded with beautiful graphics and details of all that you do, including urls of whatever you want or anything else for that matter.

Some examples of innovative background ideas include:
twitter.com/pcbdaily
twitter.com/ijustine
twitter.com/problogger
twitter.com/chrisspooner

So, what's important to think about when designing your own custom background?

First off, you have to think about file size. A background graphic that is 500k won't load that quick for most users and for some, it may take quite a while. Short of getting the Fail Whale, Twitter loads extremely fast, you don't want to hold up your followers with a 500k png. I would say a good rule of thumb would be to keep the file size below 200k - this should be easy if you use some basic techniques when designing - use solid colors, use large areas of solid colors, keep the overall contrast low and overall number of colors to a minimum.

There are three basic design schools of thought when laying out a new Twitter background for your page.
  1. Repeat Background: This is where you have an image of a smaller size that is repeatable. That is to say that if it repeats across the page, the pattern will remain consistent and look uniform. Many will do this with a regular image giving that "tiled" effect. Depending on the image, this can be good or bad. However, if you have a good pattern, this can be a very appealing effect. Examples: Good - Bad
  2. Larger, then Fade to Color: This is when you have a larger background image, that will fade to a background color, off to the right and bottom. The overall file size will be smaller than example three and if done right, can have a great effect. Examples: twitter.com/gordymac, twitter.com/bittbox
  3. Super Large: This is when you make an image that will span even the largest of screen resolutions. Some of the larger screen resolutions span to full HD territory - like my 24" iMac which is a ridiculous 1900 pixels wide. When using a background of this size, you have to be careful in your design. A 500k background image is easy to make in this size range. I recommend having large blank area and solid colors to keep the size down. Also, the less contrast the better. I still recommend in this option to fade out to a solid color and set up your background color in your Twitter settings to match, it will ensure a good smooth look for those really crazy people with screen resolutions larger than what you've accommodated for. Examples: twitter.com/pcbdaily, twitter.com/ijustine
Some of the things you want to think about including in your background design are your url(s) to your web site(s), a brief (and I mean brief) description of who you are and what you do, a picture of you (if you are branding yourself), and your logo. Also, remember to keep the important stuff all to the left and within around 200 pixels of the edge - you have to remember most user's screen resolution is around 1000 pixels wide.

Ok, so you've made a sweet design, but you can't figure out how to get it live on your Twitter page. All you have to do is login to your Twitter account, go to settings and click on the Design tab. Down at the bottom, click Change Background Image and upload your graphic, then click save changes. After you get your background image up, you'll want to be sure that you click on the Change Design Colors tab. Change all the colors to match your new background to finish off the look.

This is the 2nd of a series detailing what Twitter is and how you can use it to enhance your social network, create greater visibility on the web and ultimately use it to find new clients, customers or create new opportunities for your business. Click here to read the 1st.

1 comment:

SP said...

Thanks for the info.