PROFESSIONALLY OPTIMIZED WEBSITES STARTING AT $995
Our team of SEO Web Design gurus are standing by to assist you achieve your online marketing goals.

+1-971-599-3330

REQUEST QUOTE
SEO Web Design, LLC aims to improve business by delivering effective solutions based on innovative technologies and professional designs. Discover the variety of services we offer and convince yourself on the basis of the latest works that we've done. We love building fresh, unique and usable websites optimized specifically for your niche.

Responsive Web Design

SEO / SEM / Social Media

Conversion Rate Optimization

Email Marketing

Online Presence Analysis

Web Hosting
Top
SEO Web Design, LLC / Web Design  / Why Content Is Such A Fundamental Part Of The Web Design Process

Why Content Is Such A Fundamental Part Of The Web Design Process

About The Author

Matt Saunders is a passionate social entrepreneur helping purposeful organisations make greater impact with digital technology. He provides development support … More about Matt ↬[1]

As designers, we are often burdened by the responsibility of producing and managing website content. It’s not our job to write it, but it’s not the client’s either. In many cases a vacuum emerges which ultimately gets filled with poor content. We can avert disaster by including content production in the design process.

When embarking on a new website project, designers tend to focus on the aesthetics and functionality of their work. This means that content writing is a task often pushed onto the client to fulfil. The unfortunate consequence of this decision is that the website’s content ultimately comes in too late, in the wrong format, and of poor quality.

21 years ago, usability consultant Jakob Nielsen said this about content written by laypeople:

“The biggest problem is that most people are (and always have been) bad content creators. That’s why we have professional writers, graphic designers, filmmakers, speakers, musicians, and other types of media professionals. When an average person tries to create content, they typically don’t have much to say and what they do say is often said badly.”

Jakob Nielsen, 2000[2]

When it comes to writing content, I’m sorry to say that clients are often just not very good. My clients are amazing in many ways, but writing persuasive and informative content that prompts the reader to action, is generally not one of their talents.

As a web designer myself, I have been guilty of encouraging my clients to produce their own content. In one project I used Google Drive to manage the process. Unfortunately, the client required a lot of coaching on how to use the document editor and when they finally produced the content much of it lacked focus. I had to tell them it was unworkable. They went back to the drawing board and the project took months longer than it otherwise could have.

I sometimes feel like I’ve spent half my career waiting around for clients to write content. The other half has been spent trying to make sure whatever they produce doesn’t ruin the design.

Content production within the website design process can be tricky to manage. In this article I share my key learnings from years of experience, as well as offer some tips to enhance your own procedures.

The Difference Between Design And Content

In its most essential form, content is the material that users consume. Content can take the shape of words, pictures, video and audio. It is the tangible material that people cognitively consume, where design is the presentation of that content, influencing how people feel in the moment. They are symbiotic, yet distinct in their own right.

A common misconception among clients, and even designers themselves, is that design and content are one and the same. As such, it becomes incredibly difficult to know where the work of the designer ends. Most web designers will acknowledge that it is not their job to create video content, but at the same time, they may stray into the production of written content. This is not a problem if the designer has the expertise and resources to deliver on this fundamental aspect of the project, but most often they do not, and nor does their client. The reality is that design and content are completely separate.

It is imperative, therefore, that content be given its place alongside visual design during the web development process.

Close-up of website wireframes
Planning content as part of the web design process is crucial. (Source: Alvaro Reyes[3] on Unsplash) (Large preview[4])

Why We Should Start With Content

There is a well-known maxim born out of the building industry in the 1800s which states that form follows function. Coined by architect Louis Sullivan, his full quote expresses this idea eloquently:

“Whether it be the sweeping eagle in his flight, or the open apple-blossom, the toiling work-horse, the blithe swan, the branching oak, the winding stream at its base, the drifting clouds, over all the coursing sun, form ever follows function, and this is the law.”

Architects know that if a building does not meet real world needs, it would be impractical, regardless of how nice it appeared. This law can be applied directly to the way we build websites today. The relatively modern role of the UX designer was intended to act as the glue between form and function, bridging the gap between what something looks like and how it is interacted with. But the truth is that few projects carry the budget for a dedicated UX designer, and as such this responsibility often falls to the web designer who may be more concerned with aesthetics.

The client, who comes to us for guidance, is mostly interested in what a website can do for them. Therefore, their role is to bring their business objectives and specialist knowledge, not to write pages of content.

Can you see the problem? A cavernous gap has emerged, one that allows the production of content to fall through. We need to bring content production into our website design process, and that means creating a space for it at the start.

Naturally, this extension to our project will incur a greater cost. This often means the need for professional content production is met with resistance. Let’s have a look at some strategies for dealing with this.

What To Do If Your Client Cannot Afford Copywriting

Not only does content production often represent an unwelcome deviation for a designer, but clients also see it as an unnecessary cost. We must challenge this mindset, and that begins by covering the positives. Professional website copy will:

  • Consolidate and solidify the overall brand message.
  • Save a lot of time for you and the client.
  • Make the design (and the design process) more effective.
  • Result in a better end user experience.

The bottom line? Professionally written content will drive a higher return on the overall investment.

The reason that clients often claim they “cannot afford” copywriting is because they don’t understand what it can do for them. They don’t appreciate the potential for a return, and therefore they are hesitant to make the investment. Simple economics commands that if you can make the offer compelling, the person will want it. Use those bullet points above to instil the vitality of good content, not just on the web, but in business comms more generally.

I recently worked with a company[5] whose services proved a challenge to understand at first, but with the help of a copywriter we developed a sitemap that reflected both the end-user’s needs and covered what was on offer succinctly. This freed me up to work on the visual design system and more technical integrations. Without this investment in content production, the end result would have been much poorer for it.

Now let’s take a look at some strategies for plugging content writing into the website creation process.

Strategies For Stitching Design And Content Together

If you want to create a great website that fulfils the business objectives of your client and doesn’t give you the headache of sourcing content along the way, you will need to give copywriting its due attention. After years of struggling with this, what follows are some core ideas I’ve used to improve the process.

1. Run A Content Workshop With Your Client

Spending a couple of hours focusing on content enables you to work out what is important to the project. It also internalizes a team-wide sense of how vital content is. Here are some ways you might run such a session:

  • Discuss the overarching goals by asking good, open-ended questions such as “what might a visitor want from the homepage? Who would find this piece of content useful? How might the visitor proceed after having read this page?”
  • Intentionally steer the discussion away from how things might look, instead focusing on messaging, and how we expect the visitor to feel.
  • Consider front-loading the session with a definition of content and showing some good/bad examples. Ask the team for their live feedback to gauge and guide their understanding.
Team of people around a desk looking at a monitor
Involve your client in the content production process. (Source: Leon[6] on Unsplash) (Large preview[7])

This session is as much symbolic as it is tangible in use. Whilst some solid ideas will come out of the meeting, it’s real purpose is to get the client on board with the idea that design and content are separate deliverables. Taking this a step further, you might choose to run this workshop as an individual product for which the client pays a fixed fee, before you even begin talking about website design.

2. Partner With A Copywriter Ahead Of Time

By bringing a copywriter into your process you can effectively merge their service with yours. A common approach many web developers take when preparing a quote for a client is to itemize each service. For example, they might split front-end and back-end development into separate deliverables. This is a problem, because it creates an opportunity for the client to ask unhelpful questions. Querying an investment is, of course, wise, but in this case it can force you to justify individual services that are required to deliver the whole.

One of the best ways to integrate content writing into your delivery process is to simply begin behaving like it is a non-negotiable step. The next time you prepare an estimate, include copywriting as a standard part of the process like any other. Here is an example statement you can drop into your proposals to help with this:

Note: A strong content strategy is fundamental to making your website redesign a success. As part of this proposal we will develop content for your new website that will resonate with your visitors and prompt action from them. We will conduct an interview with you to understand your audience and objectives, and integrate this into our content writing process.

If this is met with questions, or if your client wishes to drop this part to save costs, refer back to the benefits I outlined earlier.

3. Use Real Content As Quickly As Possible

To this day I sometimes find myself designing layouts using Lorem Ipsum placeholder copy. I slap myself on the wrist every time. In an ideal world, design would not begin until you have, at least, some of the content. It’s difficult to bring a piece of design to life unless its purpose is rooted in a real world use case, and placeholder text simply doesn’t achieve that.

Don’t be tempted, either, to begin writing content as you design. I have tried this, and unfortunately the copy tends to get subsumed by the design process and forgotten about. Only when it’s time to launch does somebody question it, by which point it becomes a headache to put right. You don’t want to be retrofitting a content strategy deep into the design process; use real content as early on in your project as you can.

4. Interrogate The Brand

Our clients mission and values provide a deep well of content that most designers barely dip their feet into. Many insights and content ideas can be found here, but it means stepping back from the website process to interrogate the brand. This can seem quite daunting, but it is often worth doing in order to understand the core motivations of the project. Here are some questions you can ask your client to help form a content strategy:

  • Why do you do what you do?
  • How does your product or service make your customer’s life better?
  • How do your customers describe you?
  • Who are your competitors and how do you differ?
  • Where will this project take you?

The goal here is to get the client thinking about themselves and their customers. Your aim is to translate their responses into useful content and design decisions. When a client is struggling to understand the value of the substance of content, these discussions can lead to a few “lightbulb” moments.

If you’re feeling bold, consider bringing your clients’ customers into the conversation as well to add an extra dimension. This might feel a little scary, but you could do it in any of the following ways:

  • Ask for existing feedback that your client may have received from their customers. Look for common questions or complaints.
  • Conduct a survey with their customers, acting either on behalf of the client or as yourself.
  • Organise a series of video interviews with their customers. This could add immense value to the project and level you up to a more vital position in the eyes of the client.
  • Bring a handful of customers into your content workshop with the client to involve them in discussions.

It’s important to remember here that when interrogating the brand, we’re simply looking for answers. How do people experience this company? Promote an objective agenda to reduce in-fighting, and this extra mile will serve you very well.

5. If The Client Is To Write Their Own Content, Make It Easy For Them

In situations when the client has in-house resources to produce copy, your job will be to guide them. Here are some tips for keeping the project on track:

  • Delay jumping into visual design until you have some real content to work with.
  • Give the client a content-delivery deadline.
  • Set up all the documents for the client as Word files or Google Drive documents. Ensure each is reflected by a page within the sitemap, and ideally a wireframe to signify layout. This gives the client a framework to write within.
  • Give them templates and use constraints to help them produce content that will work well. For example, have a field for “page title” and state that it should be no more than 6-8 words. Here is a template[8] that I have used with my clients in the past.
  • If there is no budget to run a content workshop, have a pre-recorded video you can point them to or an article on your blog that explains the point of good content.
  • Make content production the responsibility of one individual. If the whole team input, the project will quickly spiral.

Essentially, in cases where your client does not invest in external copywriting, you should seek to make the process as simple as possible. Left to their own devices, you may receive content in dribs and drabs, and when you finally piece it together you’ll end up with a Frankenstein’s Monster. Making it easy for them by managing the process can help avoid this.

Some Resources To Help Facilitate The Content Process

Whether you are collating the content yourself, working with a copywriter or leaning on your client to provide it, you need tools and a process. A common approach, and one that has worked for me, generally follows these steps:

  • You audit the current website to gain a deeper understanding of content that a) needs to be rewritten, b) needs to be deleted or, c) needs to be produced from scratch.
  • You work with the client and writer to establish a sitemap, the overarching structure of the website content. Gloomaps[9] is a wonderful tool to help with this, but there are more sophisticated tools such as Miro[10] that provide a collaborative space.
  • You mock up content layout using wireframe models of key pages. You can go deep into this or keep it surface-level. There are dedicated apps like UXPin[11] and Mockflow[12], but I find that Adobe Illustrator works well with the right wireframe UI kit[13].
Experiment with key content early on in the development process
Experiment with key content early on in the development process. (Source: Sigmund[14] on Unsplash) (Large preview[15])

The key principle here is to include your client in discussions about content and structure. Too often designers disappear into a shaded room, emerging weeks later with a “finished” product. Whilst some clients appreciate a “done for you” service, most find greater satisfaction by being brought into the process. You’ll do better work when you draw on their knowledge and experiences, too.

In Summary: Take Content Seriously

The uncomfortable fact of the matter is that content is the thing you’re designing. Influential copywriter and marketer Eugene Schwartz said:

“Copy is not written, it is assembled.”

Best web designers know that their job is about composition and user experience. We provide the interface to that which the reader seeks. It’s often easy to forget this when faced with the politics and preferences of most web design projects. We get our heads turned by new trends, fancy CSS animations and the latest frameworks. We get stuck into the problem, which is what makes us designers and developers in the first place.

But there will always be a need to refocus. To align our work with the core aims of the project, and in most cases, that is simply to get a message across in the clearest way possible.

We need better content on the web, and that requires investment. As designers we can fly the flag for professional copywriters, or we can distract ourselves with aesthetics. I’ve done both, and I can tell you with confidence that the former produces better work, more quickly, and with less hassle.

Further Reading on SmashingMag:

Smashing Editorial(ah, vf, yk, il)

References

  1. ^ More about Matt ↬ (www.smashingmagazine.com)
  2. ^ Jakob Nielsen, 2000 (www.nngroup.com)
  3. ^ Alvaro Reyes (unsplash.com)
  4. ^ Large preview (cloud.netlifyusercontent.com)
  5. ^ a company (www.worcestersnoezelen.org.uk)
  6. ^ Leon (unsplash.com)
  7. ^ Large preview (cloud.netlifyusercontent.com)
  8. ^ Here is a template (docs.google.com)
  9. ^ Gloomaps (www.gloomaps.com)
  10. ^ Miro (miro.com)
  11. ^ UXPin (www.uxpin.com)
  12. ^ Mockflow (www.mockflow.com)
  13. ^ wireframe UI kit (speckyboy.com)
  14. ^ Sigmund (unsplash.com)
  15. ^ Large preview (cloud.netlifyusercontent.com)

Powered by WPeMatico

[email protected]

Smashing Magazine is a website and eBook publisher that offers editorial content and professional resources for web developers and web designers.

No Comments

Sorry, the comment form is closed at this time.