Content Workshop - Creating Effective Content for Your Website

C H A N C E B L I S S
V P , U S E R E X P E R I E N C E
CONTENT
WORKSHOP
© 2016 Copyright iMedia Inc. Proprietary & Confidential

“BEST PRACTICES“

“People don’t come for
technology, web design
or an experience, they
come for content.“

Interface design is dictated by
user behavior
EYE TRACKING
 Studies show that users scan
pages quickly in search of
key information.
 Eye movement begins in upper
left corner and moves diagonally
to the lower right corner.
 This area is prime real estate
and should be taken
advantage of.
PAGE FOLD
 Valuable and critical content
must be available above
the fold.
Page Fold

People read in an F-pattern

Implement a customer-centric
framework
Body Content & Contextual Link Cross-Pollination Links
Header & Branding
Section Navigation
Call-to-Action
Cross & Upsell
Related Links
Marketing Promotions

Writing content for
scanability
In a recent study 79% of test users scan pages before making
a next steps decision.
Control Study Paragraph
Promotional writing using the "marketese" found on many commercial
websites.
Nebraska is filled with internationally recognized attractions that draw large
crowds of people every year, without fail. In 1996, some of the most popular
places were Fort Robinson State Park (355,000 visitors), Scotts Bluff
National Monument (132,166), Arbor Lodge State Historical Park &
Museum (100,000), Carhenge (86,598), Stuhr Museum of the Prairie
Pioneer (60,002), and Buffalo Bill Ranch State Historical Park (28,446).

Writing content for
scanability
Scannable Layout – 58% Improvement
Using the same text as the control condition in a layout that facilitated
scanning.
Nebraska is filled with internationally recognized attractions that draw large
crowds of people every year, without fail. In 1996, some of the most popular
places were:
• Fort Robinson State Park (355,000 visitors)
• Scotts Bluff National Monument (132,166)
• Arbor Lodge State Historical Park & Museum (100,000)
• Carhenge (86,598)
• Stuhr Museum of the Prairie Pioneer (60,002)
• Buffalo Bill Ranch State Historical Park (28,446).

Writing content for
scanability
Scannable Layout Simplified - 124% Improvement
Using the same text as the control condition in a layout that facilitated
scanning.
In 1996, six of the most-visited places in Nebraska were:
• Fort Robinson State Park
• Scotts Bluff National Monument
• Arbor Lodge State Historical Park & Museum
• Carhenge
• Stuhr Museum of the Prairie Pioneer
• Buffalo Bill Ranch State Historical Park

“People won’t read web
content unless the text is
clear, the sentences are
simple and easy to
understand.“

ReadabilityLegibility
Comprehension
Scannable
Content

Legibility Guidelines
How easily you can distinguish letters
• Use appropriate fonts for screen viewing
• Use appropriate font weights, cases and capitalization
• Use appropriate letter spacing (kerning)

Legibility Examples
FONT FAMILY
Sans-serif typefaces are effective
Roman typefaces are effective
Decorative typefaces are not as effective
Condensed typefaces are not as effective
FONT STYLE & CASE
Upper and lowercase type is effective
Italic type is not as effective
ALL CAPS IS NOT AS EFFECTIVE
LETTER SPACING (KEARNING)
This letter spacing is effective
Thisletterspacingisnoaseffective

Readability Guidelines
How easily can you read words
• Larger font sizes for headers and body copy (16px+)
• High contrast between the font color and background
• Proper line height (font size times 1.5)
• Line length width between 560 - 620px
• White space to break up content
• Headers and sub-headers to break up content
• Direct, short headlines
• Short paragraphs (1-5 sentences)
• Lists (bullets and numbers)
• Action oriented terms (e.g. “Apply Online”) for links and buttons

Readability Examples
LINE SPACING (LEADING)
This line spacing is effective. In
typography, leading refers to the distance
between the baselines of successive
lines of type. The term originated in the
days of hand-typesetting, when thin
strips of lead were inserted into the forms
to increase the vertical distance between
lines of type.
This line spacing is not as effective. In
typography, leading refers to the distance
between the baselines of successive
lines of type. The term originated in the
days of hand-typesetting, when thin strips
of lead were inserted into the forms to
increase the vertical distance between
lines of type.

CONTENT WIDTH
This is an effective content width. In order to avoid the
drawbacks of too long and too short lines, but still energize
your readers and keep them engaged, we suggest keeping
your text within the range of 50-75 characters per line (or
between 560 - 620px wide).
This is not as an effective content width. In order to avoid the drawbacks of too long and
too short lines, but still energize your readers and keep them engaged, we suggest
keeping your text within the range of 50-75 characters per line (or between 560 - 620px
wide).

FONT COLOR CONTRAST
This font color and background are
effective.
This font color and background are not
as effective.
FONT SIZE
This type size is effective
This type size is not as effective

Comprehension Guidelines
How easy is it to understand
A language and tone that is appropriate to your audience segments
• First person singular and plural voice
• Active rather than the passive voice
• Plainspoken language
• Avoid jargon, acronyms, abbreviations or made-up terms
• Most to least important information (inverted pyramid)
• Break content into multiple sections
• Images, videos or infographics rather than words to explain ideas (1
image to 75 words)

Comprehension Examples
COMPLEX
The app highlights long, complex
sentences and common errors; if you see
a yellow sentence, shorten or split it. If
you see a red highlight, your sentence is
so dense and complicated that your
readers will get lost trying to follow its
meandering, splitting logic — try editing
this sentence to remove the red.
SIMPLIFIED
This application helps you make complex
sentences shorter.
Instructions
• Shorten or split yellow sentences
• Rewriting red sentences

SEO Guidelines
Identify and use key search terms in your:
• Page titles
• Meta descriptions
• Headers and sub headers
• Body content
• Hyperlink text and tags
• Image alt tags

The Big 5
Users are searching for the best, most specific answers to their question,
need or problem.
1. Problems & Issues
2. Cost & Prices
3. Comparisons
4. Reviews
5. Frequently Asked Questions

RelevantInformative
Interesting
Good
Content

Structured Content
GIVE IT A PURPOSE
Each piece of content should be given a purpose.
• Who is the primary audience for this page?
• What’s the point of this page?
• What’s the most important takeaway?
BREAK IT DOWN
For each content type identified, break them down into their core components.
• Headline
• Teaser
• Author’s name
• Date and time published
• Body Content
• Images
• Videos
• Categories

Writing Compelling Copy
• Conversational
• Clarity
• Brevity
• Stories
• Benefits
• Answers
Source:
https://boagworld.com/content-strategy/7-way-great-copywriter-crafts-compelling-web-copy/

Categories
Headline
Publish Date
Image
Body
Video
Related

Effective Content Lengths
Headlines – 6 Words
“Man Has Loyalty to Pretzel Brand”
Email Subject Line – 50 characters
“Snyder’s has the best crunch in pretzels!”
Facebook Post – 80 characters
“I love Synder's. They have the best crunch in pretzels. I always get them.”
Twitter Post – 100 characters
“I love Synder's. They have the best crunch in pretzels. I always get them
for holiday parties.”

Effective Content Lengths
Email Subject Line – 50 characters or less
“Snyder’s has the best crunch in pretzels!”
Facebook Post – 80 characters
“I love Synder's. They have the best crunch in pretzels. I always get them.”
Twitter Post – 100 characters
“I love Synder's. They have the best crunch in pretzels. I always get them
for holiday parties.”

Content Governance
WORKFLOW
Establish a clear and simple workflow
• Who are the content writers?
• Who is reviewing the content?
• Who approves the publishing of content?
MAINTENANCE
Plan periodic content and web analytics reviews
• Adding new content
• Updating existing content
• Retiring old content

Web Writing Tools
GATHERCONTENT
Gather and manage content
www.gathercontent.com
HEMINGWAY EDITOR
Write bold and clear copy
www.hemingwayapp.com
GRAMMARLY
Writing app with grammar and spell
checking
www.grammarly.com
READABILITY SCORE
Measure readability
www.readability-score.com
TITLECAP
Automatically capitalize your headlines
and titles
www.titlecapitalization.com

“How content is organized
is key to a website’s
performance.“

Content Organization
Guidelines
• Think about the context of the user in their daily activities, tasks and
environment
• Provide users with a clear and consistent conceptual structure
• Prioritize your content categories
• Establish a relationship between categories
• Don’t over-categorize content

Wrike Example

Common ways to organize
content
USER NEED
“Find a New Doctor”
AUDIENCE
“Patients”
USER TASK
“Make an Appointment”
TOPIC
“Arthritis”
CONTENT TYPE
“Video”
CALL TO ACTION
“Find the closest doctor”

Workshop
AUDIENCES
• Lifecycle
• Needs
• Tasks
BUSINESS
• Goals
• Objectives
• Messaging
CONTENT
• Structure
• Types
• Tone & Voice

User Journey

Quickbooks Example

Customer Lifecycle
Maintain Buy
Learn
Evaluate

Workshop
Who exactly do you anticipate will be using this website?
• [Insert User Group]
• [Insert User Group]

Workshop
What are their pain points?
• [Insert Pain Point]

Workshop
What problem is this website solving for them?
• [Insert problem and solution]

Workshop
What will they accomplish by using this website?
• [Insert goal]

THANK YOU
CHANCE BLISS
VP, User Experience
iMedia Inc.
973.224.5154
cbliss@imediainc.com
Imediainc.com

Content Workshop - Creating Effective Content for Your Website

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (6)

Destacado

Destacado (20)

Similar a Content Workshop - Creating Effective Content for Your Website

Similar a Content Workshop - Creating Effective Content for Your Website (20)

Último

Último (20)

Content Workshop - Creating Effective Content for Your Website

Notas del editor