Why Designers Should Put Content First

The Internet has been blowing up lately with articles encouraging designers and their clients to adopt a “content-first” design approach, and it makes a lot of sense. While this isn’t a new concept, with the growing emphasis placed on responsive design, these techniques are becoming more important.

What is a content-first approach? Content-first places the priority on determining the actual content for the project before starting the design process, and building the site around that content instead of using placeholder elements.

But, as Bobby Anderson says, “Having your client’s content before starting the design process isn’t the be all and end of designing content-first. ‘Content First’ is about giving the website’s content first priority over every other aspect in the design process.”

Rik Schennink goes wild and suggests moving things around in the web development process by developing first and designing last. In his scenario, the content is the priority and is used to develop clean, semantic HTML before layering design on top. Using this approach eliminates the tendency to squeeze content into a layout that doesn’t quite work. This also helps the team and client remember their main goals for the project. “Content creates focus. By focusing on content and functionality early on in the process, you’re less likely to end up in a ‘red or blue?’ discussion with the client. Too often clients are tempted to focus on details when they should be thinking of the big picture.”

The developers over at Google also advise taking a content-first approach to web design and development in their Responsive Web Design Basics documentation. They suggest using content to determine appropriate breakpoints instead of focusing on exact device dimensions.

While not specifically focused on content-first design, UXPin suggests a Validated Learning framework, which emphasizes the variety of questions and steps that need to occur before embarking on the design part of the project. Research, user testing, and conceptual planning can help eliminate the issue of “jumping into generating a solution before properly identifying the target customer and their needs.”

Though its easy to rush to the design phase, focusing on content and asking more questions up front can lead to more thoughtful web solutions.

And now, a bonus link to get your week off to a good start:

Learn how to create this Polylion SVG animation