Email Design Practice

44
EMAIL DESIGN PRACTICE @ringomoss nerv.co.uk

Transcript of Email Design Practice

Page 1: Email Design Practice

EMAILDESIGN PRACTICE

@ringomossnerv.co.uk

Page 2: Email Design Practice

@ringomossnerv.co.uk

Who AM I?

Page 3: Email Design Practice

@ringomossnerv.co.uk

+

Who AM I?

Page 4: Email Design Practice

@ringomossnerv.co.uk

RINGO MOSSProduct Design Director

-nerv-

Who AM I?

Page 5: Email Design Practice

@ringomossnerv.co.uk

NervFULL SERVICE DIGITAL AGENCY

Who AM I?

Page 6: Email Design Practice

@ringomossnerv.co.uk

NervFULL SERVICE DIGITAL AGENCY

We CREATE.

WE CONNECT.

WE CONVERT.

Who AM I?

Page 7: Email Design Practice

@ringomoss

ANATOMY OF Reading

nerv.co.uk

Page 8: Email Design Practice

@ringomossnerv.co.uk

Sender

Subject Line

The BodY

CALL TO ACTION

Preview PANE

ANATOMY OF Reading

Page 9: Email Design Practice

@ringomoss

SUBJECT AND SENDER

nerv.co.uk

Page 10: Email Design Practice

@ringomoss

SUBJECT AND SENDER

nerv.co.uk

50 Chars OR Less, Unless Highly Targeted, OR NOT.

Page 11: Email Design Practice

@ringomoss

SUBJECT AND SENDER

nerv.co.uk

50 Chars OR Less, Unless Highly Targeted, OR NOT.

LINK SENDER FIELD. PERSONAL SENDER. FEMALE.

Page 12: Email Design Practice

@ringomoss

SUBJECT AND SENDER

nerv.co.uk

50 Chars OR Less, Unless Highly Targeted, OR NOT.

LINK SENDER FIELD. PERSONAL SENDER. FEMALE.

LOCALISE DON’T Personalise.

Page 13: Email Design Practice

@ringomoss

SUBJECT AND SENDER

nerv.co.uk

50 Chars OR Less, Unless Highly Targeted, OR NOT.

LINK SENDER FIELD. PERSONAL SENDER. FEMALE.

LOCALISE DON’T Personalise.

NEVER USE “HELP”, “PERCENT OFF” OR “REMINDER”.

Page 14: Email Design Practice

@ringomoss

SUBJECT AND SENDER

nerv.co.uk

50 Chars OR Less, Unless Highly Targeted, OR NOT.

LINK SENDER FIELD. PERSONAL SENDER. FEMALE.

LOCALISE DON’T Personalise.

NEVER USE “HELP”, “PERCENT OFF” OR “REMINDER”.

DON’T SELL WHAT’s INSIDE, TELL WHAT’s INSIDE.

Page 15: Email Design Practice

@ringomoss

PREVIEW PANE PAIN

nerv.co.uk

Page 16: Email Design Practice

@ringomoss

PREVIEW PANE PAIN

nerv.co.uk

0.5 Seconds TO IMPRESS - 2 Second Rule.

*ExactTARGET - 2013

Page 17: Email Design Practice

@ringomoss

PREVIEW PANE PAIN

nerv.co.uk

0.5 Seconds TO IMPRESS - 2 Second Rule.

EMAIL PANES ARE TINY - Design to 250PX x 250PX.

*ExactTARGET - 2013

Page 18: Email Design Practice

@ringomoss

PREVIEW PANE PAIN

nerv.co.uk

0.5 Seconds TO IMPRESS - 2 Second Rule.

EMAIL PANES ARE TINY - Design to 250PX x 250PX.

REMEMBER MOBILE - 48% Read on mobile*.

*ExactTARGET - 2013

Page 19: Email Design Practice

@ringomoss

PREVIEW PANE PAIN

nerv.co.uk

0.5 Seconds TO IMPRESS - 2 Second Rule.

EMAIL PANES ARE TINY - Design to 250PX x 250PX.

REMEMBER MOBILE - 48% Read on mobile*.

CHEAT! TEST! TEST! - PREVIEW YOUR PANES.

*ExactTARGET - 2013

Page 20: Email Design Practice

@ringomoss

PREVIEW PANE PAIN

nerv.co.uk

0.5 Seconds TO IMPRESS - 2 Second Rule.

EMAIL PANES ARE TINY - Design to 250PX x 250PX.

REMEMBER MOBILE - 48% Read on mobile*.

CHEAT! TEST! TEST! - PREVIEW YOUR PANES.

*ExactTARGET - 2013

BE USEFUL.

Page 21: Email Design Practice

@ringomoss

PREVIEW PANE PAIN

nerv.co.uk

ENTICING PRE-HEADER SNIPPET

Page 22: Email Design Practice

@ringomoss

PREVIEW PANE PAIN

nerv.co.uk

ENTICING PRE-HEADER SNIPPET

ARCHIVE LINK

Page 23: Email Design Practice

@ringomoss

PREVIEW PANE PAIN

nerv.co.uk

ENTICING PRE-HEADER SNIPPET

ARCHIVE LINK

LOGO

Page 24: Email Design Practice

@ringomoss

PREVIEW PANE PAIN

nerv.co.uk

ENTICING PRE-HEADER SNIPPET

ARCHIVE LINK

LOGO

LINKS

Page 25: Email Design Practice

@ringomoss

PREVIEW PANE PAIN

nerv.co.uk

ENTICING PRE-HEADER SNIPPET

ARCHIVE LINK

LOGO

LINKS

BANNER SNIPPET

Page 26: Email Design Practice

@ringomoss

BODY IS A TEMPLE

nerv.co.uk

Page 27: Email Design Practice

@ringomoss

BODY IS A TEMPLE

nerv.co.uk

A PICTURE SAYS ZERO WORDS.

TYPOGRAPHY & FONTS. KEEP IT SAFE.

RESPONSIVE DESIGN FOR DEVICES.

TARGET YOUR EMAIL. ONE MESSAGE.

Text Versions are Pretty. important

Page 28: Email Design Practice

@ringomoss

BODY IS A TEMPLE

nerv.co.uk

A PICTURE SAYS ZERO WORDS.

Page 29: Email Design Practice

@ringomoss

BODY IS A TEMPLE

nerv.co.uk

TYPOGRAPHY & FONTS. KEEP IT SAFE.

Page 30: Email Design Practice

@ringomoss

BODY IS A TEMPLE

nerv.co.uk

RESPONSIVE DESIGN FOR DEVICES.

Page 31: Email Design Practice

@ringomoss

BODY IS A TEMPLE

nerv.co.uk

RESPONSIVE DESIGN FOR DEVICES.

Page 32: Email Design Practice

@ringomoss

BODY IS A TEMPLE

nerv.co.uk

TARGET YOUR EMAIL. ONE MESSAGE.

Page 33: Email Design Practice

@ringomoss

BODY IS A TEMPLE

nerv.co.uk

Text Versions are Pretty. important

Page 34: Email Design Practice

@ringomoss

CALL TO ACTION

nerv.co.uk

Page 35: Email Design Practice

@ringomoss

CALL TO ACTION

nerv.co.uk

PERSUASIVE AND COMPELLING.

Page 36: Email Design Practice

@ringomoss

CALL TO ACTION

nerv.co.uk

PERSUASIVE AND COMPELLING.

USE COMMAND WORDS AND VERBS.

Page 37: Email Design Practice

@ringomoss

CALL TO ACTION

nerv.co.uk

PERSUASIVE AND COMPELLING.

USE COMMAND WORDS AND VERBS.

BUTTONS VS LINKS.

Page 38: Email Design Practice

@ringomoss

CALL TO ACTION

nerv.co.uk

BUTTONS VS LINKS.

Page 39: Email Design Practice

@ringomoss

CALL TO ACTION

nerv.co.uk

PERSUASIVE AND COMPELLING.

USE COMMAND WORDS AND VERBS.

BUTTONS VS LINKS.

DO THE SQUINT TEST.

Page 40: Email Design Practice

@ringomoss

CALL TO ACTION

nerv.co.uk

DO THE SQUINT TEST.

Page 41: Email Design Practice

@ringomoss

CALL TO ACTION

nerv.co.uk

PERSUASIVE AND COMPELLING.

USE COMMAND WORDS AND VERBS.

BUTTONS VS LINKS.

DO THE SQUINT TEST.

WT…F - Shape.

Page 42: Email Design Practice

@ringomoss

CALL TO ACTION

nerv.co.uk

WT…F - Shape.

Page 43: Email Design Practice

@ringomoss

ASK ME ANYTHING

nerv.co.uk

Page 44: Email Design Practice

@ringomoss

THANKS VERY MUCH

nerv.co.uk