Jay Holtslander

Technologist

Posted May 13, 2015

Someone recently asked me to wireframe a website for them. A wireframe is an early rough “sketch” of the design of a website. Sometimes it’s an actual sketch, sometimes it’s a computer aided drawing. The purpose of a wireframe is to get the idea of layout and structure to a website.

The problem in this case was that they asked me to do this without providing any of the text or images that were meant for the website. Sure I could plop in placeholder images and fill the text areas with placeholder Lorem ipsum text but I know from experience that this would come back to haunt me and waste everyone’s time and money. Why? Because it creates more work later by not planning ahead properly.

There is an unoffical rule when it comes to good design. “Content first” (Design second).

We know what we want. We just don’t know what we want.

What is “Content first”?

Many people have written about this subject so I don’t see the need to rewrite what others have said. instead I will point to some of the better articles and write ups out there that have already been written.

Rian Van Der Merwe wrote:

If we design before we have content, we effectively create the packaging before we know what’s going to go in it. And if the content doesn’t fit the package, there are only two options: start from scratch, or try to jam the content into the existing package. We don’t want that.

But it’s not just about making the design work. Developing the content first allows us to be much more strategic about the words we put on the page. It gives us the opportunity to start with user and business goals, and make sure our content meets those goals.

He even posted the perfect illustration of the problem with adding content later and how what works earlier can break once the content is changed.

Content Last 1Content Last 2
Content Last 1Content Last 2

You can read Rian’s full article here.

Bobby Anderson wrote:

How many times have we been asked to use ‘filler’ content and stock imagery so that the client can gauge and approve the layout of their new site? The correct answer is too many.

Being asked by a client to ‘mockup a few ideas’ seems great at first, you can create a few layouts, throw in some filler text and some placeholder images and you think you’re there. You feel good, you’re happy that you’ve been able to turnover some designs for a client that you really want to impress and you PDF those designs up to send them over for feedback. You provide design concepts hoping to get the ball rolling on the project, give the client some idea of where to start from and ideally provide some inspiration to get the client on a similar level of enthusiasm as you.

This is where it can all start to go wrong. Designing blind like this may actually have the opposite effect on the client, seeing designs they might not have been expecting from an initial meet may actually result in them ‘reassessing’ the project and leaving you in a position to claw back the positivity that was originally invested in the relationship.

You can read Bobby’s full article here.

Also check out these great write ups

Hopefully after reading these you will understand the importance of not jumping the gun and getting cracking on wireframing, designing and coding a website before coming up with the content that will populate it is so important.

And now for some humorous submissions found on the website “ClientsFromHell.Net”:

“I don’t know what I want until I know what the final product looks like. So, I would like you to create 5 fully functional websites so I can decide then pay you for one of those.”

“I don’t know what I want precisely, but to be sure, I want everything.”

“I don’t know what I want…but I don’t want it to look like a website.”

“I don’t know what I want, but I’ll know it when I see it.”