Coding the Wheel

Of Gravatars and Robohashes

Webmasters who use Gravatar to decorate comments with custom avatar images will be familiar with the d parameter of the Gravatar image request.

<img src="http://www.gravatar.com/avatars/8ca7425c8a9da807b9bf6934f10d59fa.jpg?d=monsterid" alt="" />

You can specify values like monsterid, wavatar, identicon, or retro here and Gravatar will generate a unique avatar image corresponding to the MD5 hash of the user’s email address. You’ve seen these all around the web:

There are just a couple problems with these sets of generative graphics:

• They look like they were drawn by programmers.
• They’re fast becoming cliche as many thousands of sites use them.

For a fresh interpretation we head over to Robohash, a cool little service that generates a unique robot/monster avatar for any arbitrary piece of text such as an email, username, or IP address. Here’s the Robohash avatar returned for the text “Coding the Wheel”:

Just one of us robots, hanging out on our desert island, hopefully obeying Asimov’s three laws of robotics. Here are some other Robohashes generated from random strings of text:

To my eyes, the playful lines, suggestive backgrounds, and antialiased edges are a nice addition to existing generative avatar schemes. Still, Robohash isn’t a replacement for Gravatar, because it doesn’t allow users to upload custom avatars the way Gravatar does; it’s missing the identity component. What we really want:

1. If the user has a custom Gravatar image, display that.
2. Otherwise, display a unique, auto-generated Robohash.

It would be nice if you could pass a value of “robohash” over to Gravatar, the way you can with monsterid, wavatar, and so forth. There’s no question that the Gravatar service would benefit from Robohash-style avatars:

<img src="http://www.gravatar.com/avatars/8ca7425c8a9da807b9bf6934f10d59fa.jpg?d=robohash" alt="" />

But until the Gravatar people get together with the Robohash people, you can’t do that. What you can do is pass a Robohash URL to Gravatar via the “d” parameter, making sure to URL-encode it first:

<img src="http://www.gravatar.com/avatar/8ca7425c8a9da807b9bf6934f10d59fa.jpg?&d=http%3A%2F%2Frobohash.org%2F8ca7425c8a9da807b9bf6934f10d59fa.jpg%3Fsize%3D50x50%26bgset%3Dany" alt="" />

That will tell Gravatar to return the custom avatar image corresponding to the MD5 hash of the user’s email address. If there isn’t one (if the email address hasn’t been registered with gravatar), then Gravatar will pass the request along to Robohash via URL specified in the “d” parameter (shown here in it’s unencoded form):

http://robohash.org/8ca7425c8a9da807b9bf6934f10d59fa.jpg?size=50x50&bgset=any

The result: Gravatars for users who have them, Robohashes for users who don’t.