Engage Your Audience Now...
PURPOSEFULContent Design For Beginners
Alison Knott :: @eraserheader :: eraserheader.com/wcottawa (download slides)
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Engagement:making relevant content
easy to interact with
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
The struggle is real.
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Art + Science + Technology
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Art + Science + TechnologyDesign PyscologyPsycholog
yWordPress!
Part One: Your Content’s
PURPOSE
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Inform
Sell
(blogs, articles, essays)
(products, services, subscriptions)
Inform
Sell
(legible, sharable, organized)
(legible, clear benefits, secure)
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
The purpose of my content is to _____________ to _____________.inform/sell my audience
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
The purpose of my content is to _____________ to _____________.
The purpose of my content is to _____________ to _____________.
sell more accessories w ith clothes purchases buyers
chronicle my charty group’s events
people
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Part Two: Your
AUDIENCE
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
The purpose of my content is to _____________ to _____________.
The purpose of my content is to _____________ to _____________.
sell my e-courses
share betterbudgeting tips
first-time parents
w omen of Ottaw a in leadership roles
Part Three: Principles
OF DESIGNEngage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
VISUAL HIERARCHY
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
http
://w
ww.
lapi
erre
quito
urne
.com
/
http
://w
ww.
lapi
erre
quito
urne
.com
/
1
2
3
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Tora volupta ectium illandignis aute voleceatur? Quiatatur, te
nimolorum eos eiciur, ad es etus am volorunt, serum cus sum-
quamus aliquatem que ent.
Olupta prepuda estionsed maximi, sam similit quis reium, ip-
sum sita si odiaest el et laccull aceatur?
Giae dolupiciet ut liquost oditiis imillectem escia dus quiUt ape
volupic ienienda cus dolorro te conet excepelescit faccatus.
Des dit lautat aut et verchicabo. To consequ iducilibus nulpar-
ci quisite mperum aut accae verovit atibust ioreiciet re conem
natiusc itiist volupta tiaspe nis verum quamend ignit, sitaturiae
ad et alitate dolum nulpa as rehentem enihill uptatem ex ea pe
non nam volupta dolupta tquam, sinvele catecer spiet, quatia
pedia con cum as aut quiaepr aectiisit, qui ut il moditatio. Em
serepudi doluptatur rerupta voluptatibus.
Dit lautat aut et verchicabo. To consequ iducilibus nulparci
quisite mperum aut accae verovit atibust ioreiciet re conem na-
tiusc itiist volupta tiaspe nis verum quamend ignit, sitaturiae
ad et alitate dolum nulpa as rehentem enihill uptatem ex ea pe
Tora volupta ectium illandignis aute voleceatur? Quiatatur, te
nimolorum eos eiciur, ad es etus am volorunt, serum cus sum-
quamus aliquatem que ent.
Olupta prepuda estionsed maximi, sam similit quis reium, ip-
sum sita si odiaest el et laccull aceatur?
Giae dolupiciet ut liquost oditiis imillectem escia dus quiUt ape
volupic ienienda cus dolorro te conet excepelescit faccatus.
Des dit lautat aut et verchicabo. To consequ iducilibus nulpar-
ci quisite mperum aut accae verovit atibust ioreiciet re conem
natiusc itiist volupta tiaspe nis verum quamend ignit, sitaturiae
ad et alitate dolum nulpa as rehentem enihill uptatem ex ea pe
non nam volupta dolupta tquam, sinvele catecer spiet, quatia
pedia con cum as aut quiaepr aectiisit, qui ut il moditatio. Em
serepudi doluptatur rerupta voluptatibus. Download My Free
Worksheet Now.
Dit lautat aut et verchicabo. To consequ iducilibus nulparci
quisite mperum aut accae verovit atibust ioreiciet re conem na-
tiusc itiist volupta tiaspe nis verum quamend ignit, sitaturiae
ad et alitate dolum nulpa as rehentem enihill uptatem ex ea pe
non nam volupta dolupta tquam, sinvele catecer spiet, quatia
pedia con cum as aut quiaepr aectiisit, t alitate dolum nulpa as
rehentem enihill uptatem ex ea pe non nam volupta dolupta
Download My Free Worksheet Now
http
://w
ww.
min
dtoo
ls.co
m/p
ages
/art
icle
/Pla
nnin
gAW
orks
hop.
htm
http
://w
ww.
min
dtoo
ls.co
m/p
ages
/art
icle
/Pla
nnin
gAW
orks
hop.
htm
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
https://s-media-cache-ak0.pinimg.com/736x/5e/ed/21/5eed21b936da28d1cc062ba2703faf4b.jpg
Prioritizing items makes life easierfor engagement.
TYPOGRAPHYEngage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Push those header tags
I Am The Important Header 1
I Am The Next In Line, Header 2
Here I Am Header 3
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
50-75 charactersTias doluptat mo omni aborehent optatempera qui rae mo ellessim ium facia voloris moluptam doluptat rehenim agnatus quam dis rest restet la dolo esto et event doles int derspedis excea sam fugia quiatur? Adis aut quas explatatist omnis aria nonsed moluptatquo quatios ea perum rest mintemp erchil il ipit ipsam ditatem facimin ulpari ut quunt.
Soluptassi cuptatur as eum fuga. Cil ipsa verit pro cumquaes nus, occupientore si blaccusae. Ut ipsam fugitate sum doluptasitae porum ea quiduci llaborerum rerciis eossitia aces ipsunt, ut mos est fugitiam imolupt atust, auditatempos dendelene pre, corrum impossime rem re eum eumet arum, que corepe nonse quid ut volorem rere porume comni volorio nseris ab ipicitias etur sollor se qui officil maio. Facit harum ent quamustrum fugiae. Ferit,
Keep your line lengths short
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Tias doluptat mo omni aborehent optatempera qui rae mo ellessim ium facia voloris moluptam doluptat rehenim agnatus quam dis rest restet la dolo esto et event doles int derspedis excea sam fugia quiatur? Adis aut quas explatatist omnis aria nonsed moluptatquo.
Tias doluptat mo omni aborehent optatempera qui rae mo ellessim ium facia voloris moluptam doluptat rehenim agnatus quam dis rest restet la dolo esto et event doles int derspedis excea sam fugia quiatur? Adis aut quas explatatist omnis aria nonsed moluptatquo.
Tias doluptat mo omni aborehent optatempera qui rae mo ellessim ium facia voloris moluptam
doluptat rehenim agnatus quam dis rest restet la dolo esto et event doles int derspedis excea
sam fugia quiatur? Adis aut quas explatatist omnis aria nonsed moluptatquo.
Tweak line height: 1.5x font size
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Good use of white space between paragraphs and in the left and
right margins increases comprehension up to 20%.
https://www.smashingmagazine.com/2009/09/10-useful-usability-findings-and-guidelines/
http
s://w
ww.
ukes
says
.com
/
http
s://w
ww.
ukes
says
.com
/
Don’t let basic legibility issues compromise your messaging.
COLOUR
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheaderhttp://www.webdesignerdepot.com/2012/08/the-psychology-of-logo-design/
powersophissssstication
mysterydeath
growthnaturemoney
freshnesss
intellectfriendliness
cautioncowardice
hopesimplicity
cleanlinesspurity
innovationcreativitythinking
ideas
peaceconfidence
integritytranquility
lovepassiondangerenergy
royaltyluxury
wisdomdignity
authoritymaturity
securestability
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
18% OFF MacBook Fart27% OFF MacBook Fart 50% OFF MacBook Fart
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Tora volupta ectium illandignis aute voleceatur? Quiatatur, te
nimolorum eos eiciur, ad es etus am volorunt, serum cus sum-
quamus aliquatem que ent.
Olupta prepuda estionsed maximi, sam similit quis reium, ip-
sum sita si odiaest el et laccull aceatur?
Giae dolupiciet ut liquost oditiis imillectem escia dus quiUt ape
volupic ienienda cus dolorro te conet excepelescit faccatus.
Des dit lautat aut et verchicabo. To consequ iducilibus nulpar-
ci quisite mperum aut accae verovit atibust ioreiciet re conem
natiusc itiist volupta tiaspe nis verum quamend ignit, sitaturiae
ad et alitate dolum nulpa as rehentem enihill uptatem ex ea pe
non nam volupta dolupta tquam, sinvele catecer spiet, quatia
pedia con cum as aut quiaepr aectiisit, qui ut il moditatio. Em
serepudi doluptatur rerupta voluptatibus.
It lautat aut et verchicabo. To consequ iducilibus nulparci
quisite mperum aut accae verovit atibust ioreiciet re conem
natiusc itiist volupta tiaspe nis verum quamend ignit, sitaturiae
ad et alitate dolum nulpa as rehentem enihill uptatem ex ea pe
non nam volupta dolupta tquam, sinvele catecer spiet, quatia
pedia con cum as aut quiaepr aectiisit, t alitate dolum nulpa as
rehentem enihill uptatem ex ea pe non nam volupta dolupta
tquam, sinvele catecer spiet, quatia pedia con cum as aut qui-
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Don’t forget mobile devices and visuallyimpaired users
*
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
https://medium.com/salesforce-ux/7-things-every-designer-needs-to-know-about-accessibility-64f105f0881b#.4psilkfu7
Men are colour blind
Women are colour blind
People have low vision
People are blind
121
2001
301
1881
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Use colour in addition to other signifiers
Enable keyboard focus on your site
Check the contrast of important items
http
://w
ebai
m.o
rg/r
esou
rces
/con
tras
tche
cker
/
Use the power of colour wisely
HICK’S LAWEngage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
The time it takes to make a decision increases as the number
of alternatives increases
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
55% of visitors spend fewer than 15 seconds on a website.
38% of consumers give up on content altogether because it is
too long.http://time.com/12933/what-you-think-you-know-about-the-web-is-wrong/ http://wwwimages.adobe.com/content/dam/Adobe/en/max/2015/pdfs/state-of-content-oct.pdf
http
s://p
rezi
.com
/pric
ing/
Make a suggestion
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Keep navigation under 7 items
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Widget Tastefully
http
://co
sche
dule
.com
/blo
g/br
and-
advo
cate
s
http
://co
sche
dule
.com
/blo
g/br
and-
advo
cate
s
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Place your user’s needs above your own.
Part Four: Final Thoughts
MORE NERDERYEngage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
DESIGN
‘Universal Principles of Design’ (a book)William Lidwell, Kritina Holden, Jill Butler
‘Elements of Typographic Style’ (a book)Robert Bringhurst
Really Good Emailsreallygoodemails.com
Behancewww.behance.net
Visuellevisuelle.co.uk
Awwwardswww.awwwards.com
Designsperationdesignspiration.net
USERSConvince and Convertwww.convinceandconvert.com/blog
Buffer’s Blogblog.bufferapp.com/marketing-resources
Unbounceunbounce.com/landing-page-examples/22-brutally-honest- landing-page-critiques/
Smashing Magazine’s User Interaction sectionwww.smashingmagazine.com/tag/user-interaction/
ConversionXL http://conversionxl.com/
Hubspot’s Blog http://blog.hubspot.com/
Slide Images: gratisography.com & morguefile.com
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
This isn’t about perfection.
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Check data and get feedback often.
Engage Your Audience Now: purposeful content design for beginners :: WordCamp Ottawa 2016 :: @eraserheader
Never stop being inspired!
THANK YOUSee Ya Tomorrow At The Site Clinic!