The Importance of Copywriting in Web Design

by on 15th June 2010 with 45 Comments

Designers often neglect to focus on both well-written copy and structuring a design so that it highlights the copy on the page. Today we’ll discuss why copywriting is so important, who needs to learn it, and how to create content-centric designs.

Good Design, Bad Copy

As designers, we rightfully spend our time focused on aesthetics. We are pixel pushers who firmly believe with the strongest conviction that attractive websites are fundamentally better websites.

We build our mockups with “lorem ipsum” so we can go back and write something better when we have the time. Deadlines approach and still we put off the text until the last possible second. Finally, as our various GTD apps inform us that the time has come to submit the artwork, we hash out some quick text to throw onto our beautiful creations and send them off, without a visual blemish yet still marred by the subpar copy that appears on every page.

For many of us, this is simply how we’re programmed. We’re visual beasts that thrive on good design. The problem of course is that the neglect of solid copy will often cause the finished product to suffer as much or more than a poor design. Unless designers are your target market, your user base will be populated largely by individuals that don’t speak design. Show them Dribbble.com and they’ll wonder aloud why anyone would ever create such a service.

Sure, they can often interpret what is ugly and what isn’t similarly to how we can, but only on an intuitive level. What they really notice is how the website feels. Whether it’s smooth or clunky, easy to navigate or impossible. This is what is meant when designers say that great design is transparent. If your users notice your interface too much, it’s probably because they hate it.

This same metaphor of transparency applies to copywriting on the web. It’s worth noting that the average user is in fact trained in reading and writing far more than design, though still only as much as a standard education supplies. To these users, we’ll call them “normal people” as opposed to we visual freaks, browsing the web is a reading experience. Evaluating a service involves skimming the sales pitch and reading the list of features as much or more than evaluating the visual layout of the elements on the page. They’ll even hire a designer based as much on what he says about himself as what appears in his portfolio. If you have strong copy, they won’t notice or evaluate it too much, they’ll be far too busy being convinced of what it’s saying.

Heads or Tails?

The point that I’m driving at here is that design and copywriting are two sides of the same coin; inseparable in every way. The user doesn’t see the design and the text, he sees a website. A single integrated item that is either desirable or not.

The trick then is to toss out “lorem ipsum” for as much of the design process as possible. Stop designing without any notion of the goal of the design. To engage in design without copy is to build a box before you know what will be placed inside. To put it differently, consider the following quote from Jeffrey Zeldman:

“Content precedes design. Design in the absence of content is not design, it’s decoration.”

This is precisely my point. Unless you’re designing purely for the sake of design and not engaging in some professional venture, the design should serve to reinforce the message, not the other way around.

As an experiment, try building your next project by first placing in all the content that should be on the page. Throw in the headlines, the copy, the features, the widgets, the navigation; everything you can think of, but do so without design. The first step is merely to put it all in one place. Once you’ve got it there, then begin to style it. Think about different ways you can arrange it, color it, and bring it to life.

This will lead to design that is both more effective and more original. It will be more effective because the entire page is structured to highlight and communicate your primary message. Obviously, to even begin this design process, you’re forced to focus entirely on structuring your communication. Use a simple text editor so that you’re not distracted by how the message looks. Instead pay attention only to how it reads.

Consider above all else your target audience. Who are you seeking to appeal to with this message? What do they already possess in this area and why ins’t it good enough? And of course the most important question of all: Why wouldn’t they want to use the site, buy the product, hire the person, etc.? We’ll discuss this question more in a later article so for now just know that this question is the key to great marketing.

Finally, the method mentioned above will lead to more original design because you’re not designing by using other sites you’ve seen as a starting point. Rather than wireframing someone else’s design with your own coat of paint you’re instead solving a puzzle. The puzzle is of course how to best arrange and style the content that is already on the page. The tradition method involves jamming content into a predefined space as is the case when you purchase a pre-built design template. The better route is to tailor and evolve the space to accommodate pre-existing content.

Focusing On Content Whether You’re Writing it or Not

A common question that arises out of this question is whether or not it’s your job as a designer to write good copy. The ultimate answer sounds like a copout but is completely accurate in real-world settings: it depends. However, no matter what the answer to this question is for you personally, your job is still to focus on the content.

There are cases where designers need never consider writing a single word themselves. These settings exist mostly in traditional brick and mortar design offices that contain both a design department and a copywriting department. I’ve personally seen this setup in most of the big marketing companies that I’ve worked with as well as print-based businesses such as magazine layout departments.

In this latter situation, magazines employ countless writers and would never expect their designers to be gifted in sesquipedalian locution. However, the mode of operation in these businesses is often exactly that which I suggested for the web design experiment. Magazine designers are daily given new content to work with and “pretty up.” The magazine already has a developed style, but this can and does vary drastically from page to page and each issue presents new challenges for both creativity and spatial requirements. As a result, even though they’re not writers, magazine designers often excel at creating content-centric designs.

The other common scenario is the plight of the freelancer. In this case, you’re a one man/woman show. There’s no copywriting department or senior editor working in conjunction with a design team, just you. In these circumstances, it becomes absolutely necessary for you to hone your copywriting skills. Whether or not you think it’s fair for clients to expect this of you, the truth is they will.

I apologize for the harshness, but if you can wield Photoshop better than Deke McClelland but can’t write a great headline to save your life, you’re a bad freelancer. It’s time to drop the excuses and learn to write great copy. Turn your weakness into one of your strongpoints. Make it your competitive advantage, something you can tell potential clients that they won’t find in cheaper designers dishing out templated designs from the other side of the planet.

Resources for Writers

To get you started on your path to becoming a copywriting guru, here are some excellent resources.

Closing Thoughts

To sum up, remember that the goal of your designs is to reinforce the content on the page. If you’re the kind of designer that does it all, make writing strong, convincing copy a primary goal in every job you take.

Leave a comment below and let us know what you thought of the article and whether or not copywriting is a main function of your design process.

Comments & Discussion

45 Comments

  • http://www.fabian-irsara.com/ Fabian Irsara

    Great Article! Reading through your resources right now…
    and love the quote from Jeffrey Zeldman.

  • Niubi

    I can’t agree more with this article as a copywriter myself! The web is inundated with sub-par content, and it’s really important to get webmasters, web designers and anyone else involved in the whole process to realize that this isn’t acceptable. Take a look at the DubLi website, and you’ll see that it’s quite possible to have a gorgeous design and excellent writing. Why aren’t more websites like this?

  • http://www.fatdux.com Eric Reiss

    Excellent stuff. May I be so bold as to suggest the following link for your resources:
    http://www.fatdux.com/blog/2009/08/07/20-tips-for-writing-for-the-web/

  • http://kennybrijs.net Kenny

    Interesting article, I agree.

    I’m not trying to spam, but this article at 24Ways is a great help to implement the ideas brought up here: http://24ways.org/2009/make-your-mockup-in-markup

  • Pingback: CSS Brigit | The Importance of Copywriting in Web Design()

  • http://twitter.com/SpeedAirMan Jerome (SpeedAirMan)

    Thank you for your article, it’s interesting !

    I like this part : “As an experiment, try building your next project by first placing in all the content that should be on the page. Throw in the headlines, the copy, the features, the widgets, the navigation; everything you can think of, but do so without design. The first step is merely to put it all in one place. Once you’ve got it there, then begin to style it. Think about different ways you can arrange it, color it, and bring it to life.”
    It’s an excellent idea !

    It makes me think about an eBook written by Ben Hunt : “Save The Pixel”, in which the writer says : “Design the content, not the box it comes in”. It’s exactly that !

  • http://www.cabedge.com WordGeek

    I have only one bone to pick with this article. I agree with much of it. However, the call for “freelancers” [read: designers] to learn better copy writing isn’t quite the answer. Finding a great (or even a good) web copy writer is the real answers.

    As a writer I wouldn’t assume to know how to properly design the UI of a website. Fortunately, I work with talented UI designers. They don’t have to write well because the work with me.

    If you’re a freelance designer, find and befriend a good copywriter. Life will get so much easier.

  • http://www.glantz.net Keith Glantz

    I must agree with this article. A good design is very important, but IF the copy is just okay, the website won’t succeed. EVER.

  • http://mothership.co.nz Karl Hardisty

    Despite the fact that getting the actual content/copy from clients can be a task at times, this is how we approach building a site. First and foremost, the site is there to communicate and/or interact with the viewer.

    Communication is a mixture of images and words and these two should not be separated from each other for the length of the design process, as the end result is never cohesive or effective.

    The graphic element (images, layout, etc) set the scene for the transfer of information through form and function, but this information has to be of the same standard, or the reader is left struggling.

    Of note is function; Part and parcel of the UI, the elegance (in the truest sense of the word) and intuitiveness of function is paramount. Referred to colloquially as the ‘look and feel’, form and function set the foundation and aid the telling of the story, but the story itself has to be compelling.

  • http://webcontentqueen.wordpress.com Nina Furu

    Great stuff! It’s a very unique and special designer who understands that whereas the design is the medium, the copy is in fact the message.

  • http://www.writesquared.com Suzanne Wright

    Great article, Joshua! The smartest clients understand that design and copy work in tandem. My best experiences are partnering with designers who understand how one supports the other.

  • Gerard

    Thanks! I’ve noticed for a while now that a company I work for is ‘kinda’ expecting me to do all the copy and at the same time design in html/css (which is something I’m starting to understand and implement)
    The truth is, I enjoy writing copy (I was magazine designer…) and having control over the way my designs behave in markup…
    It seems to me we all have to study together and work as a team, the hardest part is instigating it all and hoping that everyone grows and works together.

  • Lola

    I agree that good copy is essential to a good website and a good message. I also think that designers really need to understand the written word. I do think freelance designers should be able to at least write good copy, there should be people who specialize in writing web copy. You can’t be good at everything, and if designers start writing, they might lack in one subject and it could actually harm their work.

  • http://www.katcreative.co.uk Kathryn McCann

    I agree with WordGeek. The article is great, but the conclusion that freelance web designers must hone their own copywriting skills is disappointing.

    I’m a freelance copywriter and received this link from a freelance web designer I work with regularly. Working as a team we create great work for clients that neither of us could have achieved alone.

  • Jenny

    Fantastic article. I am sending this on to every web designer I know! As a web writer and editor I know how life can be from the other side of the table – a beautiful design that doesn’t work when I want to add my copy!

  • http://sukhdugal.com/journal Sukh Dugal

    Good reminder.

  • Dave

    Web designers have gotten by without copy-writing skills for quite a while now, and they probably will for several more years.

    The key is that the window is closing. As the web matures as a medium, your skills must mature with it if you want to create top-tier work (and get paid accordingly).

  • Ellen Ambrose

    This is a great article! I love it. Thanks!

  • http://thriftview.blogspot.com/ Van

    I agree wholeheartedly with everything written in this post. I’m a designer yet I’m interviewing others to hire so I can focus on making good copy as a priority.

  • http://watsonx2.com Stu Watson

    I agree with much in this post, but would suggest one key step before dropping in all the copy. Maybe this is implied, but planning what you need to say, and how you can say it for the web environment, are essential steps to guiding the actual copy writing. The web in many ways asks writers to refresh their use of the outline. Remember that tool? Back in elementary school, we all groaned when it came to outlining time. But it was fundamental to clear writing, and never more appropriate than to the task of blocking out content elements for a web site.

    I would also say that, yes, better writing can be taught (and learned), but why not engage an excellent copywriter than try to improve skills for which one may not be aptitudinally suited? I don’t pretend to be a designer, but I appreciate their work immensely. The same attitude should apply to designers. As my rasta friends like to say, “Respec’, Mon, respec'”

  • Pingback: Good Design, Bad Copy()

  • http://lrhcreative.com bcr8tive

    I agree and appreciate this article immensely. Personally, I don’t try to write copy for any client, but instead try to stress the importance of it in the pre-design process.

    I am of the belief that this is one major factor in even beginning my project and is the crucial time when I must lead my client into putting in the effort to cooperatively develop the copy for “us” to build an engaging site.

    Whether or not that requires “we” incorporate the assistance of a good writer, is neither here nor there. It is imperative if you want to build an engaging site that performs.

    The copy also provides me with the ability to pick out the key selling points of their business objectives, which is another critical aspect of a good design and additionally being able to forecast the navigation and it’s possible future scalability.

    If utilizing the “lorem ipsum – dipsum doodle strategy” in my design, I can expect copy after the fact, to throw my entire design off – unless I’m building a blog.

  • http://www.redradishmarketing.com XuanThu Pham

    This is an informative post. I am going to bookmark this as future reference and share it with my clients. Please keep these coming.

  • http://copywritingedge.com/ Wizely

    Totally agree – the goal of web design is to communicate and maximise the potential of a site’s content. Therefore, with text constituting the majority of web content and words being our primary means of communicating, that makes copywriting a vital skill.
    So I couldn’t agree more with your recommendation that copywriters should hone their web design skills.
    Oh, hang on…

  • Pingback: 20 Websites with Carefully Crafted and Convincing Copy | Design Shack()

  • Pietro Polsinelli

    We had exactly the problem of mediocre copy and I took some notes in the learning process: http://pietro.open-lab.com/2009/10/19/get-visitors-to-read-and-remember-your-home-page-the-principles/

  • Pingback: 20 Websites with Carefully Crafted and Convincing Copy | Design Shack @ Mange Mes Briefs()

  • Pingback: 7月15日 XJP新闻快评 - XJP的碎碎念()

  • Pingback: 产品设计, 文案 | Hello Tea()

  • Pingback: 网页设计中文案的重要性 | BingB()

  • Pingback: How persuasive is your website’s copy? A simple, five-step checklist | PrintMediaCentr.com()

  • http://timelycopy.com/WP875de/copywriting/ copywriting

    It was very informative post. Content is really important in one website.

  • http://nexus-copywriting.co.uk David

    A refreshing article! It’s good to see ever more web designers developing an appreciation of this.

    It’s so easy to become blinkered by the satisfaction of producing the web design, thereby forgetting what the ultimate point of the site is.

    For a business website in particular the primary focus is to generate action from the visitors to that site. Whether it’s to buy goods or services, submit an e-mail address or request a brochure, the site has to make it happen.

    Whilst flashy visuals may grab attention, they don’t persuade. Only words can achieve this and if you don’t get them right the website has failed.

    Of course, having my own copywriting business it’s not surprising that I would advise hiring professional wordsmiths, but it really is true. Poor writing loses customers. Skilful writing generates action.

  • http://www.discountwebdesign.co.uk/ Imrozz – web design

    Interesting article on The Importance of Copywriting in Web Design. All designers needs to read it so they can improve their work.

  • samuel

    need an interactive website.how do i go about it?

  • samuel

    want to knw wat the business is all about

  • samuel

    need to chat with an agent

  • http://www.brettwidmann.com Brett Widmann

    Copywrighting is a very serious issue and all designers should make sure that their work is protected and not to steal other peoples work.

  • http://www.gdhwebdesign.com/ GDH Web Design

    I think the majority of web designers have to get involved or at least understand the principles of good writing on the web. Not all projects will have the budget for a copywriter and decent copy is essential for a website to convert, the addition of a few simple factors or some advice and guidance to a client can go a long way!

    nice in depth article, many thanks!

  • Pingback: Creating a Web Presence for your mobile app « StartupCafe()

  • Pingback: Myth #19: 웹사이트를 디자인할때 그 내용이 필요한 것은 아니다? | Clearboth()

  • http://www.joeghostwriter.com Joe

    It’s great if a designer can write copy on top of graphic design. But it hard to find the same skills in one person. It comes down to the individual, but if a designer can find a great copywriter to work with, and vice versa, great things happen.

  • Pingback: Lorem Ipsum Is a Crutch! | The Phuse()

  • Pingback: Bring Mockups to Life with Real Content! | UX Passion - UX design agency()

  • Pingback: Design process | T-graphic and web design()

Subscribe

Membership
About the Author