a quick guide to long-form content (wordcamp toronto 2014)

19
A Quick Guide to Long-Form Content David Hamilton [email protected]

Upload: david-hamilton

Post on 10-Jul-2015

187 views

Category:

Internet


0 download

TRANSCRIPT

Page 1: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

A Quick Guideto Long-Form Content

David Hamilton

[email protected]

Page 2: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

Different stories require different

ways of telling them.

TL;DR

Page 3: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

Long-form examples

Snow Fall (New York Times)

Savages (Pitchfork Media)

A Stiff Upper Lip Is Killing British Men (VICE)

Page 4: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

Long-Form is here

Page 5: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

Long-form stories get shared!

Page 6: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

Short and long content

Short Long

Simple Complex

One development in a

larger story

Mostly self-contained

Often easy to write Requires info, time,

perspective

Value is in speed and

quantity

Value is in quality

Page 7: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

How you tell a long-form story

News/Information Narrative

Important

Less

Important

Beginning

Middle

End

Page 8: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

In storytelling, it’s what

you leave out that makes

the story good.- Casey Neistat

Page 9: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

Long-form design considerations

It’s about story,

not navigation, or

ads.

Focus on readability.

Think of the flow of

information.

Page 10: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

The central design characteristic of Long-form:

It’s all about scrolling.

Page 11: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

Navigation that packs things onto the site

Page 12: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

Navigation for long-form content

Page 13: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

Long-form in WordPress

WP themes suited to long-form

The Aesop Story Engine plugin

Tweaking CSS

Page 14: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

A few of my favourite themes… (from themeforest.net)

Page 15: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

And long-form themes from Creativemarket.com

Page 16: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

Aesop Story Engine adds content options

Page 17: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

CSS tweaks to text

Snow Fall Text CSS:

font-size: 15px;

line-height: 22px;

padding-right: 50px;

margin-right: 348px;

WordPress Plugin for CSS: Simple Custom CSS or Jetpack

Stiff Upper Lip Text CSS:font-family: Arial,sans-serif;font-size: 1rem;line-height: 1.7rem;margin-bottom: 2rem;

Changes to text can make things more readable.

NOTE: 1rem = 16px

Page 18: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

Long-form is extremely difficult to pull off

online...but it’s worth it.

Page 19: A Quick Guide to Long-Form Content (WordCamp Toronto 2014)

Contact me:

e: [email protected]

t: @davidwroteit

Thanks for

listening!!