Pete Hamilton

Kittens Make Great Placeholders

There often comes a point in web dev projects when you need to stick an image placeholder into your page. At this point my options are usually as follows:

  1. Style a div to have a solid background and imagine an image there
  2. Create images which are the right size by hand and stuff them in the source ‘temporarily’
  3. Host common image sizes somewhere else, like Amazon S3

The methods are messy, time consuming and quite frankly, crap.

Enter placekitten.

An AWESOME site which can serve you an image of a kitten at any resolution you want. Just provide a width and height in the url like so:

BAM, perfectly sized kittens.

It even transpires that there is a Ruby gem for this on github - PlaceKitten

Using this in a rails app is then as simple as adding gem 'placekitten' to your gem file and then adding the following in your view:

# Insert an 800x600px kitten image
image_tag(Placekitten.kitten_for(800, 600))

I found it nice to have a simple helper function for this:

require 'place_kitten'

# Inserts an image of a kitten with the specified WxH
def kitten_image(width, height)
  image_tag(Placekitten.kitten_for(width, height))