Our Blog

Anatomy of a web content document

by Amy Wallace on February 23rd, 2010

For anyone who works with content, knowing how to format a web content document—or simply how to read it—is a crucial step in successful content creation. 

Why? Because without a clearly structured web content document, you run the risk of confusing your content reviewers, designers, and developers. And that confusion can lead to mistakes and frustration—stuff that could end up manifesting itself on your website.
 
Remember, a web content document isn’t just used by web writers, even though they are often the people who create and manage it.
 
Content reviewers use it to make copy edits and review messaging/tone. Designers use it to get the right copy into their design mock-ups. Developers use it to determine which copy appears as links on the actual website, and when to display dynamic content—for example, content that goes live on a specific date.
 
Here are a few of the formatting essentials you’ll need to cover to make sure your web content document (commonly called a “copy deck”) works for everyone on your marketing and/or creative team(s):
 
Links and buttons
You can count on link and/or button copy to be in just about every web content document you work with. As you probably know, this is the content that takes the user to a new page, cross-references relevant information, or helps a user complete a task.
 
You’ll need to choose a style for representing links and buttons in your document. Our standard is to format this copy as blue, underlined text. This tends to be the industry standard, too.
 
Examples:
 
Read the Brain Traffic blog
 
Submit your request
 
If you do decide to format the links and buttons in your document in a different style, make sure it’s clear—and that everyone on your team knows what it is. Keep in mind that straying from the norm might confuse reviewers, designers, and developers used to working with the standard blue, underlined text style convention.
 
Regardless of the style you choose, follow the link and button text in your content document with its destination, which will likely be based on a site map or an external URL.
 
Examples:
 
                Site map page ID:
Submit your request <link to 2.2>
 
External URL:
Read the Brain Traffic blog <link to http://blog.braintraffic.com/>
 
 Descriptive content labels
If your copy isn’t properly labeled within your content document, designers and developers working with the document can have a difficult time figuring out which copy goes where.
 
So, make sure to identify all the content pieces on each page. For example, put the label "Heading" above your page headline, "Body copy" above the main content, and "Right column copy" above content that lives on this part of the web page. Or use whatever labeling convention your agency or organization may already have established.
 
Example:
 
The key is making sure the labels are clear and easy to understand for everyone referencing your document.
 
Dynamic content
Content that may change or is dependent on functionality conditions is often referred to as "dynamic" content. For instance, if you’re working on a project that includes content that launches on different dates or should only be displayed based on certain requirements (maybe after a user logs in, for example), your document will need to specifically state when to display that content.
 
I recommend writing a short note to the developer above the specific piece of dynamic content. Describe the rule for displaying it—for example, "only display this content for California residents."
 
I write these notes in gray text, so it’s easy for developers to skim and find them throughout the content document.
 

Example:
 
<Note to developers: Display this link on 1/1/2010>
See our 2010 plans<link to 3.4>
 
Meta data
Those of you well-versed in web content know what meta data is, but let’s do a quick review. It refers to specific information developers need to make your content searchable.
 
Meta data includes:
 
·         Meta title (the title of the content page, which appears in your internet browser)
·         Meta description (a keyword-loaded description of the content page)
·         Meta keywords (words that refer to specific topics on the content page and make it easily findable)
 
A web writer or SEO expert is usually responsible for creating this information. Whether or not you create ityourself, you’ll need to include meta data in your content document. Which means you might also need to format this content, especially if you receive the meta data in a different type of document, like Microsoft Excel.
 
It’s a good idea to place the meta data in a separate section of your content  document—say, at the top of each page—so it’s clearly distinguished from the actual web copy.
 
Example:

Remember, the web content document you create isn’t just black-and-white. Sometimes it’s blue. And underlined. With notes. Because that’s what works.

  • http://www.richardingram.co.uk/ Richard Ingram

    Writing dynamic content for developers is usually the acid test of any web content document.

    As I'm used to working with php programmers I tend to use its syntax for a variable (a $ sign followed by the variable name itself) to indicate a changing word or phrase within written content. So if a particular sentence contains a variable such as:

    We've identified Heathrow as your nearest airport.

    I'll usually write something like:

    We've identified ($airport_name) as your nearest airport.

    Or, if the content changes depending on the user's actions I'll try to best explain the scenario that should result in its appearance. For instance, in the event of an exact match being returned by a search engine I'll write something like:

    !Exact Match! Header2: We've identified ($city_name) as your location.

    Or, in the result of a best guess scenario I'll write:

    !Best Guess! Header2: We've identified ($city_name) as your nearest city. Is this correct?

    It's always interesting to read how others approach the creation of these documents. Thanks.

  • MelissaKMcAvoy

    As a web developer turned content coordinator, I think it is also important to give clear instruction (or suggestion) to the developers on the URL or filename for a new web document. It should be clear, short, and keyword heavy. What good is good content if it can't be found easily, especially through a search engine?

  • http://twitter.com/mikecane Mike Cane

    Appearance will change dramatically to accommodate touchscreens.

    Web Designers: Wake Up And Smell The Touchscreen Coffee!
    http://ebooktest.wordpress.com/2010/01/31/web-d...

  • tedgoas

    Do you typically include TITLE and ALT text for images and links? What are you thoughts on who owns this? (assuming this gets done at all!)

  • http://www.expertsfromindia.com/content-writer.htm web site content writer

    Hi
    It is quite interesting.
    Thanks for this.

  • http://impresswebdesign.com/seo.html Dianne White

    That’s true. You just don’t write something and post it online, since you need to do a bit more than that if you want to get noticed. Stuff like tags, formatting, and SEO can help make things easier for your readers to find you. The web is a big place, so you need to do something to help you get noticed, after all.

  • La Rue

    > So, make sure to identify all the content pieces on
    > each page. For example, put the label “Heading”
    > above your page headline, “Body copy” above the
    > main content, and “Right column copy” above
    > content that lives on this part of the web page.

    So in the above example, shouldn’t it say “Heading” above the word “Headline”?

blog comments powered by Disqus