Email design best practices presented by bronto software inc http bronto com
This presentation is the property of its rightful owner.
Sponsored Links
1 / 25

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


  • 109 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.

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