
How to Design the Perfect Twitter Profile Page - pgrieselhuber
http://www.loudnoises.us/the-noise/how-to-design-the-perfect-twitter-profile-background/
======
pubby
This is really just an article on handling different size monitors rather than
actual graphic design and layout.

The funny thing is that author's website and twitter get cutoff horribly on my
monitor (1024*768 which about 20% of web users use).

~~~
pgrieselhuber
Hey Pubby, yeah the post is meant to be a quick tip, in and out, get your
twitter profile fixed.

We specifically decided to avoid teaching people design in this post. That is
forthcoming. :)

Also, thanks for the feedback on our own site - we just launched about 60
hours ago and are still working out a few kinks. We'll get this fixed pronto.

Best, Paul Grieselhuber

------
rkudeshi
The biggest takeaway from this article is that at some point in the recent
past, Twitter finally added an option to CENTER your background image.

The reason most of those brands have "bad" profiles? Because they were
designed before the center option was added.

For context, centered background images were a long-standing request of Matt
Mullenweg: <http://ma.tt/2010/07/centered-twitter-backgrounds/>

~~~
pgrieselhuber
Yep, what amazed us most was who WASN'T on top of the change yet, given
Twitter's importance to branding these days. Well, and the free template.

------
lifeisstillgood
I am going to have to channel patio11 here - the Perfect Twitter Profile Page
is one that supports your Twitter goals and is proven to do so with empirical
testing.

What are your online goals? How do you measure them? Now how on earth does a
twitter home page help that? If Facebook pages for major brands are one step
removed then twitter home pages are a long down the road towards the shops.

If your tweet goes viral and most people then go to your twitter homepage,
instead of that embedded URL, something is badly wrong

frankly your twitter homepage irrelevant - it's a 140 character broadcast
service with no relevant interactivity on yr homepage - make it blank, put up
a picture - if it is more than one hours work for the same designer who did
your real home page then it's too long

Edit: curiously their own twitter page is my ideal - simple, clearly states
who and what and links right into their main online presence - which fwiw is
very funky.

~~~
pgrieselhuber
Thanks for the compliments on our Twitter profile design!

Completely agreed re: your Twitter page (and any other marketing channel)
needing to serve your business objectives.

As quality design is one factor in establishing trust in a brand, we feel that
when brands get something so basic as layout of their Twitter profile wrong,
it warrants a nod and perhaps a nudge, which is what this post is intended to
be.

------
ghostfish
First of all, this is something that's always bugged me when using twitter,
and I like seeing someone address it, but I have a comment. I agree with the
13" laptop screen examples, but how many people browse the web full screen on
monitors over, say, 21"? On my 24" monitors (1920x1200) I usually have browser
windows dragged to 2/3rds of the screen at most. Most websites look patently
ridiculous at full 1920 width, let alone 27" or 30" monitor resolutions like
2560x1600.

~~~
pgrieselhuber
Thanks Ghostfish, the post seems to be getting great response here and on
Twitter. It's been a pet peeve of ours so wanted to get it out to the world as
our first major content contribution.

Granted, most of the world isn't seeing twitter at full size on a huge screen.
Our goal is simply - let's make it perfect for everyone in one fell swoop.

------
empire29
Im not a twitter user, so this may be just initial shock -- but while looking
through the article's screenshots, i had flash backs of myspace.. not quite as
bad, but a crowded over-personalized, over-whelming page.

------
Sumaso
Maybe I'm way off here but I was under the impression:

Size of screen != # of pixels on that screen

Shouldn't the article talk about that? A Retina Mac's screen may not be as
large as a 21 inch screen, however it probably has more pixels.

~~~
pgrieselhuber
Hey Sumaso,

Thanks again for pointing out the super high-res on Retina screens. We've
updated the post. If you have any more feedback, feel free to leave a comment
on the post!!

------
m_ke
wow you really like macs

~~~
pgrieselhuber
we do. :)

~~~
Smudge
It's the reason your site's fonts look so terrible in Chrome for Windows.

Nothing says _built on a mac_ like jagged webfonts on Windows.

Edit:

Here's some more info on the issue, to (hopefully) be more useful:

"Using Web fonts in your design requires thorough testing on as many different
browsers and platforms as possible, with a close look at various options for
rendering text. If the screen display is of poor quality and lacks subpixel
rendering, then opt for graceful degradation by serving system fonts to older
browsers and OS. Conditional comments are the easiest way to exclude older
browsers and operating systems from style sheets with Web fonts. Of course,
JavaScript is a more elegant way to detect whether a client’s subpixel
rendering is turned on."

[http://www.smashingmagazine.com/2011/03/02/the-font-face-
rul...](http://www.smashingmagazine.com/2011/03/02/the-font-face-rule-
revisited-and-useful-tricks/)

Also useful:

[http://www.smashingmagazine.com/2012/04/24/a-closer-look-
at-...](http://www.smashingmagazine.com/2012/04/24/a-closer-look-at-font-
rendering/)

~~~
pgrieselhuber
Smudge, this is awesome feedback. You probably noticed in our comment above
we've just launched this week, so this is much appreciated. If you see
anything else, feel free to fire away. We'll be working to address these
issues this weekend.

