[Ubiquity for Firefox from Aza Raskin on Vimeo]

I’m also a big fan of kinetic typography, so i dug the video’s intro.

Nowadays most sites will let you upload JPG, GIF, and PNG in any shape and usually with a generous file size limit. Then they’ll convert it to their own preferred format and let you crop it if you want (some require a square-shaped image). Very easy.

Here’s what i found out.

On Twitter with a colored background showing through.

Twitter does respect PNG transparency. At least two resized versions (73px and 24px square) are saved on Amazon S3. You can easily change your Twitter picture, but old pictures are not saved to use again. I tried uploading a few different sizes to see if the down-sizing would make it look any worse; there wasn’t any noticeable difference.

Facebook converts uploaded images to JPG format, so does not support transparency. They can be any shape, and are automatically sized down to 500px 604px 720px on the largest side. The transparent area of my image was cleanly converted to white—which looks great in my case, but might not for others. Facebook of course keeps your images in albums and you can make any of your photos your profile picture.

Gravatar, being the only of these services whose sole purpose is to serve icons, does just about everything you’d want. It maintains transparent areas in PNGs, provides a tool to crop to their square shape (80px and 32px), and lets you store more than one image. Gravatar serves icons for WordPress.com, many WordPress-powered sites, Disqus, and probably a bunch of other sites and services.
Update 20080903: Gravatar should now work with a few more image types.

On a MySpace blog page with a background image showing through.

I was surprised that MySpace accepted my PNG image and kept it transparent. MySpace uses a 90px-wide version of your photo for icons throughout the site. MySpace, like Facebook, keeps albums of your images and you can use any of them as your default picture.

On Flickr showing the garbled alpha area.

And now Flickr. You’d think that Flickr the photo site would have buddy icons down. But they practically fail. The problem i had for my new icon is they use JPGs for buddy icons, so no transparent PNGs. In addition, if you do try to use a PNG with alpha transparency, it garbles the transparent area instead of making it solid. Another issue with their icon uploader is that it “intelligently” crops or stretches images to fit the 48px square. Images with large solid areas are cropped off and the remaining image is stretched out to fill the square. I tried uploading a pre-sized 48px square black on white version of my icon, and Flickr cropped and stretched it instead of using it as i designed it.

I haven’t looked into the Google picture options in much detail, but it looks like they get converted to JPGs, and are reduced to 96px. If you upload via Gmail web interface you are forced to crop to a square shape. But using the Google Talk chat client i’ve uploaded non-square images. My PNG icon was converted to a JPG with a white background.

Update 20080901: The Get Satisfaction customer support site accepts and maintains transparency in PNGs. When uploading, the longer sides of an image are automatically cropped to a square shape and saved as 100px and 30px copies.

Notes

This was just a quick sampling of some of the services i use more often; i may update as i encounter more.

I created this new version to be square because a majority of sites expect square images. I was tired of seeing my previous icon cropped down or stretched, or having to manually add white bars top and bottom to make it fill a square.

Obviously, a black icon with a transparent background won’t really be visible on a page with a black or dark background, but i like how it looks on most other pages, so i’m willing to accept that. Internet Explorer 6 does not properly display transparent areas of PNG images, but there’s not really any reason to still be using that browser.

The one thing that consistently varies is the size of the images that sites use. For some it is no issue, but with some designs, especially at smaller sizes, it can drastically change the appearance of an icon. For example, at the full 256 pixels, i think my icon looks great. But once it’s been shrunk down by Flickr to 48 pixels, and then again to 24px by the browser, the icon’s features start to break down.

[the new look]

It’s a cleaner, more modern look. More whitespace, less clutter, easier on the eyes. Similar to Wikipedia, with a little more color. They adjusted the style of the sidebar to better tie in to the page’s content.

[the old look]

Why don’t you understand that this:

Actually i am not an active serfer, but this this site is really great, i will spread it through my friends.

is comment spam. I’ve recieved at least a dozen of these same comments, and you ask me to moderate them because you’re not sure if they are really spam. I can tell that they’re spam with a simple glance—i don’t even have to read them.

For that matter, if i get more than one comment with identical text, it’s almost certainly spam. Especially if the emails and URIs are all different.

I think you’re cool and all, Akismet, but you really need to step your game up.

Now for the behind-the-scenes portion. I’m using Mark Jaquith’s Subscribe To Comments 2.0 plugin for WordPress. Installation was too easy, just dropped the new files and activated. All i changed was the “from” email address for the email notifications. Let me know if you have any problems.

The 7 minutes x-men trailers did show Wolverine move. It is cool. cannot wait until it coming out

x-men will be a good movie. cannot wait until it coming out. Do you guys think there will be another x-men?

I starred it in Gmail as something to come back to as it was a little fishy, but i didn’t have time to look into it then. So tonight i cleared out my moderation queue, and went ahead and approved the comment. I was even about to reply comment, but paused for a second. The email address appeared to be real, and the linked site looked legit, “human”—real, fresh content. But it somehow lacked personality. And of course there was the illiterate writing in the comment, and the fact that x-men was linked twice to the same post about the movie on that site.

So Googling the comment text brought up many hits of the exact same comment on other sites with posts about the X-Men movie. Some even with short “hand-written” additions for that personal touch. I also found similar mass-comments linking to other posts on that site.

Look, steve, even if you posted all those comments by hand, you didn’t have the sincerity to write original thoughts—actual comments—about those posts. Copy-pasting links to your site ain’t gonna fly around here. If it smells like spam, it probably tastes like spam. And i’m not biting.

It gave me a chance to play with SSH, which is probably good to know—i had to grab and install PuTTY to get that to work. Everything went just as prescribed. It only took maybe 15 minutes—very similar to WordPress’s simple installation. You basically just upload some files, and edit a configuration file. The last step is loading in old log data (AWStats only reads the most current log file). There’s a simple script on Digerati’s page to import the backlogs on TextDrive servers.

But i had two year’s of logs from 1&1 servers that i wanted to import. And there’s where i ran intro trouble. It seems 1&1 had to do everything differently, and their log files were in a different format that didn’t taste good to AWStats. Fortunately, digging around AWStats’ documentation got me goin in the right direction, and a post on eBooger.com mentioned the same problem and provided the correct log format. I also had to manually rename a bunch of the log files because 1&1 complied them weekly instead of daily and there were name conflicts between the two years. I also had to make sure there were no spaces in the names left over from the batch rename tool i used—the AWStats import function chokes when filenames have spaces. Once i got that all sorted out, i used Digerati’s script slightly modified to import the 1&1 logfiles from ~/logs/1and1_logs/ and removed the -rt list option so they would be imported by filename order since the datestamps were all messed up.

The original script is currently running to pull in the log data collected on TextDrive since the beginning of the year. Once that finishes, i think i need to check on the cron settings to make sure it grabs the daily log file for updates. Then i may look into one of the several “daily” analyzers suggested at the TextDrive Forums.