The Case for Content-First Web Design

  • Categories:


  • Date:

    December 14, 2017

The Case for Content-First Web Design


Content-first design can be the difference between a website that is well planned, on time and on budget and a website that launches on a delayed timeline after repeated updates and redesigns. 

What is content-first web design?

Here’s a simple definition: content-first web design prioritizes website content creation before page layout design. As a result, layouts can be guided by the content that will be featured — elements like copy, images, videos, product specs, charts and graphs. What assets do you already have? Do you need to have a photo shoot or produce new videos? What are your best-selling products? Your worst-selling products? 

Here’s another way to look at it: content-first web design elevates pretty websites into pretty websites that work well for the user (and thus the site owner).

What are the benefits of content-first web design?

Design exists to present content, so content should always come first. In other words, never build the box (the design) until you know what’s going in the box (the content). Otherwise, you might have to saw the box in half, which is expensive and wastes a lot of time. 

Content-first web design:

  1. Prevents a disconnect between content and design. Putting content strategy first allows design teams to analyze the opportunities, constraints and implications that content might have on the design. When teams are forced to condense or cut content elements to fit within a completed design, page content no longer follows a logical, conversational, easy-to-digest flow.
  2. Makes website projects more efficient. Using real content helps uncover potential issues much earlier in the digital development process. For example, if we identify large gaps in content before we ever begin designing the website, we can address them upfront rather than trying to frantically solve the problems near the end of the project.  
  3. Allows for efficient modular web design. Modular web design means that we try to create reusable modules as much as possible. For example, if several pages begin with an introductory section that consists of a headline and about one to three sentences of copy, we create a reusable content module for those sections. This approach significantly reduces the number of hours required, saving clients money and getting their new sites online more quickly. But modular web design is difficult to achieve if we start with design instead of content.
  4. Promotes collaboration between agency teams and clients. When we kick off any new website or website redesign, we start with a content strategy phase. During this phase, we hold workshops with our clients to define project goals, map out potential user flows and establish messaging priorities. What do we want to achieve? How will people interact with the site? What actions do we want them to take? What kind of information do we want to share? What story do we want to tell?  

Addressing content strategy at the beginning helps our clients play an active role in projects. We work together to fill content gaps. And because our clients are involved in early discussions about content priorities, everyone is on the same page about the site content and its importance.

What should you do if you can’t get the content first?

The world isn’t perfect, and neither is website development. So, while content-first web design is a proven approach, it isn’t always easy to achieve. If you’re a marketer, you likely have a million other things going on with your day-to-day work, so identifying missing content and creating new content might be a tall order.

One potential solution? Reusing or repurposing existing content as much as possible. If you have an existing website that already has content, start with that. Begin by defining the goals you hope to achieve with your new or revamped website. Then, view your existing content through that lens. Ask yourself questions like:

  • What existing content can help me achieve my goals?
  • What type of content would be most helpful but is missing from my current website?
  • Can I create this missing content in a reasonable amount of time? 

By working closely with your agency or design team, you can make content development a more manageable, efficient task — and maybe give your website exactly the head start it needs to get online quickly and work hard for your business.

Explore more articles from Wray Ward.