Engage Your Audience Now PURPOSEFULfiles.meetup.com/18783556/AlisonKnott_WPHalifax... · Engage...

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


The struggle is real.


Art + Science + Technology


Art + Science + TechnologyDesign PyscologyPsycholog

yWordPress!

Part One: Your Content’s

PURPOSE


Inform

Sell

(blogs, articles, essays)

(products, services, subscriptions)

Inform

Sell

(legible, sharable, organized)

(legible, clear benefits, secure)


The purpose of my content is to _____________ to _____________.inform/sell my audience


The purpose of my content is to _____________ to _____________.


sell more accessories w ith clothes purchases buyers

chronicle my charty group’s events

people


Part Two: Your

AUDIENCE




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


http

://w

ww.

lapi

erre

quito

urne

.com

/

http

://w

ww.

lapi

erre

quito

urne

.com

/

1

2

3


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















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



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


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


Push those header tags

I Am The Important Header 1

I Am The Next In Line, Header 2

Here I Am Header 3


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


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


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

/

Don’t let basic legibility issues compromise your messaging.

COLOUR


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


18% OFF MacBook Fart27% OFF MacBook Fart 50% OFF MacBook Fart















serepudi doluptatur rerupta voluptatibus.

It lautat aut et verchicabo. To consequ iducilibus nulparci

quisite mperum aut accae verovit atibust ioreiciet re conem




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-


Don’t forget mobile devices and visuallyimpaired users

*


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


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


The time it takes to make a decision increases as the number

of alternatives increases


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


Keep navigation under 7 items


Widget Tastefully

http

://co

sche

dule

.com

/blo

g/br

and-

advo

cate

s


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


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


This isn’t about perfection.


Check data and get feedback often.


Never stop being inspired!

THANK YOUSee Ya Tomorrow At The Site Clinic!

Engage Your Audience Now PURPOSEFULfiles.meetup.com/18783556/AlisonKnott_WPHalifax... · Engage...

Documents

Transcript of Engage Your Audience Now PURPOSEFULfiles.meetup.com/18783556/AlisonKnott_WPHalifax... · Engage...