What comes first - content or design?
Design should enhance the core message of a page, funneling people to useful content and products.
But too often, the web design process starts with mockups and forces writers to work within existing constraints. That leads to problems.
In this article, take a deep dive into why content should always precede design.
Why is it an issue to design first?
Layout before content causes chaos. Aside from the entire website looking slightly off, you might also notice:
Quality suffers: In these situations, a writer could be squeezing content into existing character counts to make the design appealing. On the other hand, they might have to write extra nonsense to fill a page, even when there is little to say (clashing with Google’s new guidelines to cut down on spam). Whether the design requires too much or too little content, its constraints put quality at risk.
UX suffers: On the other hand, maybe the writer proceeds to write five paragraphs of needed text where the designer wanted one. Suddenly, your design looks strange and web visitors can spot the disconnect.
SEO suffers: When SEO isn’t made a priority from the start of content, it can be awkward to squeeze it in. For instance, let’s say a design includes a low-character count H2. But this page is supposed to be optimized for a longtail keyword. Now, the writer either has to make the keyword the full headline or exclude it from the H2s.
Below, this marketing agency has a common web component: a bolded summary followed by a paragraph of descriptive text. However, the paragraphs are a bit long and would be more readable if they were broken up.
Since the design didn’t allow for breaking up the text, the writer is forced to cram the description into one block.
What process works best for content-first design?
So how should writers, designers, and stakeholders collaborate to bring pages to life? The only part of design that should be done before content (or at the same time) is basic branding elements - colors, fonts, logos, and any sort of basic guidelines.
These processes will keep things flowing smoothly and boost the professionalism of the final product.
Content and design process for page design
Step 1: The content strategist provides an outline of what they’d like to say (in what order) and verifies with stakeholders. For example, I could define Content Land’s homepage like this:
Headline
Intro paragraph
Blog feed
Resource feed
Step 2: If the outline is agreed upon, the content writer can populate this outline with text. If the page is going to be copied into multiple versions, filling out one primary example should be plenty.
Step 3: The designer can start building a page layout and continue the design process, using the text provided.
Content and design process for redesign
While a designer (or UX specialist) plans for a new website, they’re often in charge of the navigation and new site structure.
But before they make these decisions, taking a content step is crucial. Take a content inventory and follow this process.
Step 1: Crawl the existing site to generate a spreadsheet of live pages. You can do this in a tool like Screaming Frog, Moz, or Ahrefs.
Step 2: Label each page as “keep” or “delete”. Have team members who understand the value of a page (whether that’s traffic, conversions, or revenue) score each page.
Step 3: Now, designers have a list of pages they need to incorporate into the new design. If they add the new URL next to the old, this spreadsheet can serve as a redirect map.
Step 4: Designers create the structure of the new website for approval.
Why is it so common to design first?
With a lack of well-planned process, it’s easy to fall into the trap of creating a layout too early. Here’s why that usually happens:
Limited Time: This fallacy usually occurs when working within a strict timeline. It’s faster for the designer to work in tandem with the writer.
Design can be more exciting: Sometimes people would rather show a client their design because they appreciate it more. It might feel like the team made progress quickly when starting with design.
Avoiding decision making: Other times, a writer who is indecisive about what belongs on a page might look to a designer for direction.
Lack of expertise: And finally, the person producing content might not have the skill set needed to determine page elements. If it feels like guesswork (rather than a decision based on research and testing), you may as well have the design first!
All in all, content-first designs will result in a more professional look and feel. If you’re stuck in a process of layout before content, it’s worth some pushback!
Thanks for reading! You might also like…
