Share this: Twitter

Reddit

Email

LinkedIn

Facebook



Boring but Useful Image Placeholders

There’s all types of image placeholder sites. Think of image placeholders as lorem ipsum, but for images instead of text. Some popular image placeholder services are Dummy Image and placehold.it. Both of those sites let you specify your image dimensions in the URL and then they will spit out an image in the requested dimensions.

Both are good services, and I’ve used Dummy Image extensively, especially while working for the Ames Tribune. As a newspaper, we used the IAB standard ad sizes, which Dummy Image has built-in. So all we needed to do for a standard 300x250px IAB placeholder ad image is this:

That’ll produce the image below.



Background color of the image is #222222 and the text color is set to #eeeeee.

The Problem and Solutions

That’s fine and dandy, but what if we need placeholder images that give more life to our mockups? Like actual people, objects, and other organic stuff you find in the meatspace. Having dull placeholder images can give a bad first impression when meeting with new clients. Why not spice it up a bit and add some placeholder images that are somewhat relevant to the project at hand?

Also, flat, plain images simply don’t fit with some designs. Thankfully, this is where sites like placekitten, PlaceBeard.it and placezombie.com come in.

These sites will give you actual photos for placeholder images, not just plain boxes with the image dimensions inside. The image attached to this post is a placeholder image from Fill Murray. Here’s a smaller placeholder image from Fill Murray, accomplished with this

My Absolute Favorite Image Placeholder Service

Placezombie.com. I like zombies, my oldest daughter loves zombies. So, I decided to revived the now dead placezombies.com and got a new domain for it at placezombie.com. The original placezombies.com domain expired and someone else picked it up, unfortunately. I maintain placezombie.com and use it everywhere, I could be a bit partial to it, I suppose. 🙂

Placezombie.com does color placeholder images and greyscale placeholder images.

Color Image Placeholder

Greyscale Image Placeholder

Genre-Specific Image Placeholder Services

Only because I’ll be giving them a photo of me soon.

Kittens just bring a certain, I dunno, something to your early designs. They’re cute and usually quite fluffy.

There’s a ton of great photos on Flickr, so this isn’t really genre-specific, but it needs mentioned. Pull images based on tags to simplify finding images that are relevant to your current project.

I now maintain this site at https://placezombie.com. This one is a must if you’re building a horror or zombie related site. Some of the images might even be useful as production pieces.

Like bears? So do I. As with most of these services, you can get your images in full color or in greyscale, and Placebear is no exception.

See below for a Placezombie example.

Novelty Image Placeholder Services

Who doesn’t like Nick Cage? I particularly like this one.

Charlie Sheen was everywhere a few months ago, why not memorialize him with an image placeholder service?

I really like Bill Murray, so I could actually see myself using this service for personal projects where I don’t necessarily care if the images are of a certain genre.

Can you guess who’s featured in this image placeholder service? Unfortunately, yes, the always pleasant Vanilla Ice. Reminds me of the good old days.

I would never use this for anything, ever. And neither should you. But, if you must, don’t come bitching when you start dreaming of Steven, with hair slicked back, pointing a gun at you due to overexposure to Mr. Segal.

You can never have enough Morgan Freeman in your sites. Just specify any size as per the examples below and make your website Mogan Freeman-tastic.

I know Steven Segal has a pretty loyal following, but I think his followers even look at him as a joke, his acting career for sure. Since I’ve hated on Steven so much, here’s a placeholder image just for him, because I secretly watch his movies every chance I get.

Use Unsplash.com Images for Placeholders

Sellaphix mentioned in the comments an image placeholder service that’s driven by Unsplash.com, called Unsplash.it. Pretty cool, definitely worth checking out. Unsplash.it even has the code that drives the site available on GitHub! You could roll your own, basically.

There’s a TON of image placeholder services around, there’s probably a few new ones being built right now. Google “image placeholders” and you could probably spend a few hours looking at various image placeholder services.

The ones I’ve listed are extremely easy to use and don’t require you to download anything. Just format your img tag as explained at each service and you’ll be set.

A Quick Note

If you’re switching image placeholder services around, beware that some use different URL formats. For example, image URL’s at Placezombie are https://placezombie.com/700×250. While others, like Fill Murray are formatted with a slash, like so http://www.fillmurray.com/700/250. So make sure you know what format the service you’re using is expecting.

End

If you have any other image placeholder services that you use that weren’t mentioned, I’d love to hear what they are. You can comment below or start a discussion at Hacker News.

Update

In the comments, Babak mentioned Loremflickr.com, and I love it! Check out Loremflickr.com.

0

Well, now what? Work with Me I'm available for hire and always taking new clients, big and small. Got a project or an idea you'd like to discuss? Startup plan but no developer to make it happen? Just get in touch, I'd love to see if I can help you out! Leave some Feedback Got a question or some updated information releavant to this post? Please, leave a comment! The comments are a great way to get help, I read them all and reply to nearly every comment. Let's talk. 😀 Longren.io is proudly hosted by DigitalOcean

Share this: Twitter

Reddit

Email

LinkedIn

Facebook



Like this: Like Loading...