Web

How to Effectively Use Placeholder Content

Photo by Drew Beamer on Unsplash

Content and design can be like the proverbial chicken/egg scenario. In a perfect world, we’d get the final content upfront and be able to put forth a perfectly designed product. In reality, it rarely ever happens which is why we resort to placeholders until we get the real content. This is where the famous “Lorem ipsum” comes from that you may have stumbled upon once or twice. Perhaps you’ve read about the quick brown fox and the lazy dog? ๐Ÿ˜‰

In Tom Greever’s book, Articulating Design Decisions: Communicate with Stakeholders, Keep Your Sanity, and Deliver the Best User Experience he talks about removing distractions and specifically mentions placeholder images and text.

“A lot of people are easily distracted by things that don’t matter to the goal of the meeting. They can be so distracted by one thing that they’ll identify a different, unrelated problem or be unable to discuss the real issues. Consequently part of your job is to pay attention to those things that derail the discussion and remove them altogether.ย  A common example involves the use of placeholder content: stock images and lorem ipsum copy.”

He then goes on to discuss some specific instances where clients were distracted by the placeholder content. This is not to say you can’t use placeholder content but rather you need to be strategic about it. That’s why I follow these general guidelines when it comes to placeholder content.

Know your client. After a meeting or two, you can get a sense of how a client is going to process what you present to them which is why it’s important to choose the right placeholder content. Sure you can use good old fashion Lorem Ipsum, but it’s not necessarily an effective way to get the right feedback from a client. Think distractions.

Use discretion. This piggybacks off number one in that by knowing your client use what’s appropriate. For example, if they are more on the conservative side then it’s probably not a good idea to use Samuel L. Ipsum. ๐Ÿ˜ฌ

Try to repurpose. If the project is a redesign, I try to find out what the plan is for content on their current site ASAP. Will they reuse it? Will they scrap it and start over? Most of the time clients will do a little bit of both, whether they realize it or not. Sometimes, the content they currently have is pretty good, it just needs to be tweaked or cut down. I usually try to repurpose what I can and present it in a new way they may have not been able to imagine. Not only does it show them how their current content can work for them but it takes the pressure off them to rewrite everything which tends to be the big roadblock with getting content in the first place.

When in doubt, put in your vision. Sometimes clients need a little more handholding and whether your use generic placeholder or repurpose their content they just can’t get past that barrier. I had a client that got so hung up on the placeholder content during every.single.meeting to the point where I had to change the verbiage to read something along the lines of “Intro heading about [Name of Client] Here” and “a couple lines of text will go here describing the services of what [Name of Client] offers to their customers” and so forth. By doing this, you’re giving them the exact guidelines you need when it comes time for them to populate their content, and usually, this tends to avoid situations where they’re trying to insert a paragraph of text into an area that requires a sentence or two.

By following these guidelines and carrying them into development (I really pushed for the developers at my previous job to implement the exact content from my designs) it eliminates headaches in the long run.

My Favorite Placeholders

Practical Placeholders

Placeholder – This is an HTML-based one where you can put in specific image dimensions. I love to use this one, especially during development because it gets the client thinking about how to resize their images. That’s probably one of the most common questions we get is, “What size does this image need to be?”

LoremFlickr – Pull placeholder images in from Flickr that have a Creative Commons license. You can pull random images or random images matching a specific keyword. For example, if you’re designing a website for an animal shelter you could pull in random images of cats and dogs. Very handy for taking it up a notch.

The Worldโ€™s Best Industry Specific Lorem Ipsum Generator – Prior to this one I used a generator called Not Lorem Ipsum which allowed you to choose industry-based placeholder content. However, it’s no longer working plus there were certain industries I needed that they didn’t have. This new generator takes it up a notch by letting you type in any topic, and it pulls in content from Wikipedia. ๐Ÿคฏ

Fun Ones

Bullshit Ipsum – “Need some interesting looking bullshit for your work in progress? You came to the right place.” ๐Ÿ˜‚

Trollem Ipsum – Internet troll speak. Are you an Apple Fanboy or an Android Geek? Or perhaps a patient, yet slightly jaded, BlackBerry user? Trollem Ipsum will help you out!

Harry Potter Ipsum – Accio placeholder text! โšก

Outlander Ipsum – Great place for some bonny placeholder text, ye kin

Chuck Norris Facts – “Fool me once, shame on you. Fool Chuck Norris once and he will roundhouse you in the face, Most people have 23 pairs of chromosomes. Chuck Norris has 72… and they’re all poisonous.”

And for plenty of more fun generators, check out Meet The Ipsums.