B2B Marketing Agency for Technology Companies

5 Ways Wireframing Helps You Plan For Better Content

Website content needs careful planning, and wireframing is your content’s greatest ally. By investing in the process early, you’ll produce better content.

Comments 0
by Eric Sharp

“We’ll figure out the content later.”

Ever been in a website planning meeting and heard this? How’d that work out by the way?

website-wireframing-creates-better-content

Once you were forced to address all that juicy content, did the process suddenly become laborious? Did the content get the TLC it deserved? How’d it look once you saw it in your overall design? Did it feel shoehorned?

At the very least, I’m sure you could admit the process could have been somewhat better.

Though your content is the heart and soul of your website, it can easily — and unfortunately — be treated as an afterthought.

Wireframing is your content’s greatest ally. By investing in the process early, you’ll produce better content later.

1. Wireframing helps put content (in particular, words) FIRST!

content-first-dos-equis

This is a frame of mind. Content first. Say it with me. “CONTENT FIRST!”

Choosing your website’s color palette is fun. Making technology decisions such as which CMS to use, is critical. Discussing where your traffic will come from is important.

I get it. There are various moving parts to a website.

But, there’s none more important than the actual content on your website. Effective websites pay attention to text and its impact on overall messaging.

Wireframing almost forces you to think about words earlier than you’re maybe comfortable with. But, that’s a GOOD thing as too many content revisions could blow your website budget.

More about the words you choose

2. Wireframing helps you quickly PRIORITIZE content

“On our homepage, how do we get people to focus on our value proposition rather than our most recent blog or social media links?”

Great question. Imagine if you could get that answer quickly and easily.

(That’s your cue Wireframing.)

A wireframe will help you prioritize information for every page of your website by utilizing design principles such as:

  • Scale
  • Contrast
  • Proximity
  • Whitespace
  • Hirerarchy
  • Rhythm

When you start applying design principles to your content, you begin taking control of the desirable experience you want people to have.

This is designing for flow, a major factor in conversion.

When elements have the same size and contrast (like the above 4), they are perceived as equally important. Sometimes that's good. Sometimes that's very bad. Wireframing gives you the freedom to experiment rapidly to find the right prioritization.

3. Wireframing helps you determine content FORMATTING

Saying, “This page will just have some content” is like saying “This house will just have some walls.” Regardless if you’re building a website or a house, both approaches aren’t helpful.

Wireframing begins formatting conversations such as:

  • “Will a few paragraphs and simple image work for this content?”

  • “Should this content be shown in tabs or an accordion?”

  • “Is a data table the best way to present this content?”

There are multiple user interface elements at your disposal. Wireframing allows you to evaluate quickly what kind of UI element does the best job.

wireframing-determines-content-formatting

Our client, Cactus Technologies, explored a feature's formatting (tabbed design) in the wireframing stage which inspired their final design months later

4. Wireframing helps you VISUALIZE content within an interface, which provides context

Ever stared at a Word doc and thought, “Hmm, how is this content going to look in the website?”

Why wait months to find out? If you’ve already sitemapped out the structure of your website, jump into wireframing!

Once content leaves the simplicity of a Word doc, context changes. A wireframe shows how this content works in a graphical interface where menus, other content and calls to action surround it.

Visualizing how content looks, adapts and functions within a website early in the planning process is nearly impossible without wireframing

5. Wireframing helps you take INVENTORY of creative assets (images, PDFs, videos, audio)

Wireframing will serve as a wake-up call.

It helps spotlight creative assets that need to be purchased, created, edited, or re-factored. The earlier you address this inventory, the more time you’ll have to prepare and polish them before they make their way into the website.

Wireframing jumpstarts conversations around:

  • Images - Stock photos, illustrations or custom created?

  • PDFs - Are they optimized for the Web? Do they need editing?

  • Videos - What videos need to be shot? Can existing ones be trimmed to 3 minutes or less? (the ideal length of videos today)

  • Audio - How’s the quality? What’s the file type?

Wireframing: Content’s Greatest Ally

If you want your content to be attractive and engaging, don’t treat it like some small detail. Treat it like a BIG detail. In fact, plan as if it's the most important detail.

Content needs careful discussion, analysis, and creation. Wireframing is the tool and process you can use early on that’ll produce better content in the long-run.

We help mid-sized B2B Technology companies generate qualified leads and improve sales efficiency.

16

Years in business

50%

Minimum growth in quality leads our clients see after an engagement

200+

Websites we've created, supported, or consulted over the last decade

 0 

The jargon we speak (we'll approach conversation like a layperson)