Email Design Best Practices Presented by Bronto Software, Inc. bronto - PowerPoint PPT Presentation

Email design best practices presented by bronto software inc http bronto com
Download
1 / 25

  • 127 Views
  • Uploaded on
  • Presentation posted in: General

Email Design Best Practices Presented by Bronto Software, Inc. http://bronto.com. Hosts: Eric Boggs – Director of Account Management Jon Norris – Online Marketing Associate and Design Guru. Agenda. Do’s Don’ts Resources. DO: Pander to the Preview Pane.

I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.

Download Presentation

Email Design Best Practices Presented by Bronto Software, Inc. bronto

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Email design best practices presented by bronto software inc http bronto com

Email Design Best PracticesPresented by Bronto Software, Inc.http://bronto.com

Hosts:

Eric Boggs – Director of Account Management

Jon Norris – Online Marketing Associate and Design Guru

Bronto Software, Inc.


Agenda

Agenda

  • Do’s

  • Don’ts

  • Resources

Bronto Software, Inc.


Do pander to the preview pane

DO: Pander to the Preview Pane

  • Keep impact in the “Northwest”

  • 500-700 pixels wide for 1|2

  • 200 pixels wide for 1|1|1 in AOL

  • Design for blocked images

  • Include link to web version

Bronto Software, Inc.


Microscan preview pane

Microscan – Preview Pane

Bronto Software, Inc.


Microscan preview pane revamp

Microscan – Preview Pane - Revamp

Bronto Software, Inc.


Bronto bulletin preview pane

Bronto Bulletin – Preview Pane

Bronto Software, Inc.


Bronto bulletin preview pane example

Bronto Bulletin – Preview Pane Example

Bronto Software, Inc.


Do design for delivery

DO: Design for Delivery

  • Efficient HTML code

  • Images

  • Text

  • Simple text alternative

Bronto Software, Inc.


Bad example html code

Bad Example – HTML code

Bronto Software, Inc.


Bad example html code1

Bad Example – HTML code

What should you worry about?

  • Excessive tables

  • Extraneous, open, or improperly nested tags

  • CSS

  • “Save for Web”

  • Use a validator!

Bronto Software, Inc.


Bad example images text

Bad Example – Images/Text

Bronto Software, Inc.


Bad example images text1

Bad Example – Images/Text

Bronto Software, Inc.


Good example alternative text

Good Example – Alternative Text

Bronto Software, Inc.


Do keep it simple

DO: Keep it Simple

  • Tables can be tricky

  • Top-to-bottom works best

  • Easy HTML-to-text translation

  • Google School of Design

Bronto Software, Inc.


Red hat keep it simple

Red Hat - Keep it Simple

Bronto Software, Inc.


Red hat keep it simple1

Red Hat - Keep it Simple

Bronto Software, Inc.


Do test

DO: TEST!!!!!

  • Test email clients

  • Test browsers

  • Test subject, layout, call-to-action, etc.

Bronto Software, Inc.


Stockton graham thunderbird

Stockton Graham - Thunderbird

Bronto Software, Inc.


Stockton graham css

Stockton Graham - CSS

Bronto Software, Inc.


Stockton graham gmail

Stockton Graham - Gmail

Bronto Software, Inc.


Stockton graham revamp

Stockton Graham - Revamp

Bronto Software, Inc.


Don t do these things

DON’T: Do these things

  • Don’t use Flash

    • Will not work consistently across email clients.

  • Don’t use Javascript

    • Disabled in most email clients as a security precaution.

  • Don’t embed audio or video

    • Link to a landing page.

Bronto Software, Inc.


Don t do these things either

DON’T: Do these things either

  • Don’t use external style sheets

    • Use inline styles

    • Embedded causes problems in webmail programs

  • Don’t use relative image/document links

    • Link absolutely

  • Don’t “Save as HTML” in Word, Publisher, etc.

  • Avoid:

    • Area maps

    • Dark backgrounds

Bronto Software, Inc.


Resources

Resources:

  • Online Resources:

    • http://www.w3.org/

    • http://www.csszengarden.com

    • http://www.alistapart.com

    • http://www.alvit.de/handbook/

  • Bronto Blog - http://bronto.com/company/news/blog/

  • Your account manager

  • “Good artists borrow, great artists steal.”

~Pablo Picasso

Bronto Software, Inc.


Questions

Questions?

http://bronto.com

  • Note: We will make presentation slides and recording available later this afternoon.

Bronto Software, Inc.


  • Login