8 Reasons content comes before design

You know that a content-first design strategy is what you need to create the website of your dreams. But do you know how to get there? Do you fully understand why it is important?

Creating and developing content ahead of a website design will help you organize all those creative thoughts and brainstorms into usable work product. Crafting a solid outline for the content will help the design team and the creative team get on the same page regarding the focus of the website.

Here are eight reasons why content must come before the design of any project to ensure its success.

1. Content determines the “rules of the game”

Starting the design process with content in hand sets the “rules of the game” for how the visuals and website user interface will come together.

Content provides a mood or feel for messaging. Without content how do you know what type of tone to set with users?

Content also shapes how elements such as color and typography are selected. These elements must help organize content in a way that’s easy to see and digest. They must also corroborate the message so that the visuals and words “say” the same thing.

Look at the two instances of “I love you,” above. Having the content tells you whether the right design is the soft, romantic version or the more childish, cartoon style presentation. Knowing what content goes with the whole of the design will shape and help determine which option fits best.

2. Content helps you create a story (or find that you don’t have one)

Sometimes the best ideas fall short because there’s nothing that pulls the story together. Starting with website content before the design ensures that the story is already in place.

• Who are you talking to with the design and story?
• What are you trying to tell people?
• What do you want them to know?
• Why is it important? Why should they care?
• When will it have relevance?
• How will you make sure they understand?

A great story answers these questions. If you can’t form a narrative from these guidelines, you might be lacking a comprehensive enough concept to keep moving ahead.

3. Content puts everyone on the same page

Starting the design with content puts every member of the team on the same page. From the first brainstorming session, everyone has the same information and idea of what the project entails

It’ll make it easier for you to direct the creative process and pull in designers and developers that have a similar vision of the project.

Alzheimers New Zealand uses a quiz to help users understand the disease. The creative team had to develop a simple concept, using color and icons to connect the content to the rest of the design. Think of how different this content might have looked had it been created after the design. Part of what makes it work is the simplicity of the visuals, which make users focus on answering quiz questions.

4. Content sets constraints

There are very few projects that start with a blank canvas. Most come with starting points or elements that have to be a part of the design. From color palette to tone to length of text blocks, having content from the start of a project sets constraints so that the design doesn’t go wild in a way that won’t work with said content.

If you develop content and design in silos, the pieces won’t always fit when the time comes to put it all together. Too often, these pieces are forced together, leaving a disjointed and somewhat off-balanced final design.

While no designer will ever say he or she wants to work within a well-defined set of guidelines, it helps them focus on elements that matter for the project at hand. It’s been said that the best design happens within a set of constraints because the designer must focus on solving the problem, not decorating the canvas.

5. Content helps prevent endless loops of revisions

A content-first design strategy can save you time and money. Seriously!

Designing without content can result in an endless loop of revisions that can be frustrating for the client, creative team and designer/developer team. If you have the content to start, a lot of these pains – and delays – can be avoided.

Providing content up front will ensure that the creative direction matches the needs of the project and that the designer/developer team is right for the project. It’s a much less risky prospect than just hoping it all works out in the end.

For Sunway, a company that sells window coverings, think of the design confusion that could have ensued if the design didn’t start with images of the product in use. Having key content – in this case, photos – allows the design to take on a more minimal style because the image is the most important element.

6. Content shows if the design works

Have you ever gotten back a design concept and just knew that it would not work? Maybe all of the content spaces were way too small (or large), or there weren’t places for the large photos that you use to tell your story?

When you build the design around the content, these problems just don’t arise. Design elements, content locations, and types are built using the words, photos and elements that would actually appear on the screen, proving whether a design concept works (or not) right from the start.

7. Content tells us what is important (and what’s not)

Content helps pull out design elements with meaning.

Do you have the content necessary to build a certain visual element? Too often clients want a website with video, but lack video content or want a homepage slider and only have a handful of photos.

The content you have in hand when creating the design will shape how you think about the visual presentation, how to plan for calls to action or clickable elements and help you see what design elements you don’t need. Injecting actual content into the design can help you see redundancies in the visual flow and help streamline visuals.

8. Content changes can change the design

Changes in content change the design. So why would you create a design without content, knowing that everything about it is subject to change?

The more content you have to work with from the beginning, the more realistic design prototypes will be throughout the process. Even unfinished content is better to work with than none at all. If the content plan is still in progress, ask for one representative – and complete – content element for each design element: a calendar listing, a blog post, a call to action, a product review, etc. Use these elements to create a more well-rounded content-based design outline.

For the design of Socrates in the City, the main content includes videos and interviews. All of the images follow the same format, so the design team could build the website frame off of just one piece of completed content that contained a still image, description of the content and call to action button.

Conclusion

You probably know the scenario all too well. There’s a great creative plan for a project; it’s all wireframed out. Then the content team comes to you with something totally different than what you brainstormed with designers. The project just got more expensive and time-consuming because you have to start over.

If you had the content first, you wouldn’t be in that situation. Make it a rule of the game for your creative team. Don’t pass the project on to the next step – design and development – until there is at least a good working prototype of the content to use as the basis for the design. That includes copy, images, video and branding. Make sure all of these elements are in hand as the design concept and wireframes are developed. You’ll be thankful in the end.