Html 207 html e newsletter
This presentation is the property of its rightful owner.
Sponsored Links
1 / 17

HTML 207 HTML e-Newsletter PowerPoint PPT Presentation


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

HTML 207 HTML e-Newsletter. Donna Carnduff Susannah Finley. HTML207: HTML e-Newsletter . Writing for the Web. Good Design Follows Good Content Grammar = Credibility Know Your Audience Call to Action – Where does it point?. HTML207: HTML e-Newsletter . Writing for Your Newsletter.

Download Presentation

HTML 207 HTML e-Newsletter

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


Html 207 html e newsletter

HTML 207HTML e-Newsletter

Donna Carnduff

Susannah Finley


Html207 html e newsletter

HTML207: HTML e-Newsletter

Writing for the Web

  • Good Design Follows Good Content

    • Grammar = Credibility

    • Know Your Audience

    • Call to Action – Where does it point?


Html207 html e newsletter1

HTML207: HTML e-Newsletter

Writing for Your Newsletter

  • Subject Line – short, descriptive, find out more

  • Best Practices in Writing Email Subject Lines

    • http://kb.mailchimp.com/article/best-practices-in-writing-email-subject-lines/

    • Magnetic Headlineshttp://www.copyblogger.com/magnetic-headlines/

  • Article Titles

  • Action Items

  • Above the Fold


Html207 html e newsletter2

HTML207: HTML e-Newsletter

Download Template Files

  • http://itc.utk.edu/web/html207/

    • UTWrdmrkPlainLong-420px.gif

    • header-earth.jpg

    • soil-samples.jpg

    • template.html


Html207 html e newsletter3

HTML207: HTML e-Newsletter

Or…Find Templates Online

  • campaignmonitor.com/templates(free)

  • Downloaded Original

  • Premailer Copy


Html207 html e newsletter4

HTML207: HTML e-Newsletter

Customize Your Template Code in DW

  • Understand Current Code Standards

  • Adapt for Your Organization

    • Top links

    • Main content

    • Footer

  • Preview the Document


Html207 html e newsletter5

HTML207: HTML e-Newsletter

Best Practices

  • Consider Title (will be subject line)

  • Create permanent image folder

  • Add alt tags to images

  • Send mix of images and text

  • Use absolutepaths for images, links

  • Open a new window

  • Build your image resources


Html207 html e newsletter6

HTML207: HTML e-Newsletter

Resources

  • Microsoft to Ignore Web Standards in Outlook 2010: Enough is Enough

  • http://www.campaignmonitor.com/blog/post/2799/microsoft-to-ignore-web-standards-in-outlook-2010/

  • Guide to CSS support in email clientshttp://www.campaignmonitor.com/css/#p

  • Stupid HTML Email Design Mistakes

  • http://www.mailchimp.com/articles/stupid-html-email-design-mistakes

  • How to Code HTML Newsletters (All New Version)

  • http://www.reachcustomersonline.com/2009/01/23/09.27.00/

  • MailChimp Guides

  • http://resources.mailchimp.com/guides/


Html207 html e newsletter7

HTML207: HTML e-Newsletter

Resources

  • UT Listserv site

  • https://listserv.utk.edu/cgi-bin/wa?INDEX

  • Hotmail Turned my Headings Green

  • http://www.creativeglo.co.uk/blog/email-design/green-headings-in-hotmail/


Html207 html e newsletter8

HTML207: HTML e-Newsletter

Move Styles Inline

  • Pre-Mailer


Html207 html e newsletter9

HTML207: HTML e-Newsletter

Post to the Web

  • What are your options for uploading?

  • Dreamweaver

  • CyberDuck (Mac)

  • WinSCP (PC)

  • VolSpace


Html207 html e newsletter10

HTML207: HTML e-Newsletter

Send as e-Newsletter

  • Distribution List

  • Internet Explorer

    • Outlook

    • File -> Send -> Page by email…


Html207 html e newsletter11

HTML207: HTML e-Newsletter

Send as e-Newsletter

  • Safari

    • Mail/Entourage

    • File -> Mail Contents of This Page


Html207 html e newsletter12

HTML207: HTML e-Newsletter

Send and Evaluate

  • Send from a PC

  • Send from a Mac

  • Test in email clients:http://www.campaignmonitor.com/stats/email-clients/

    • Outlook 2003, 2007, 2010

    • Hotmail / Windows Live

    • Yahoo

    • iPhone

    • Gmail


Html207 html e newsletter13

HTML207: HTML e-Newsletter

Link Color in Gmail, Headers in Hotmail

  • Put styles back in the <head>

  • <style type="text/css" media="screen">

  • a { text-decoration: underline; color: #C96501; }

  • a:link { text-decoration: underline; color: #C96501; }

  • a:visited { text-decoration: underline; color: #C96501; }

  • a:hover { text-decoration: none; color: #C96501; }

  • a:active { text-decoration: none; color: #C96501; }

  • </style>

  • Span around each link

  • <a href="http://link-example.com/" style="color:#C96501;">

  • <span style="color:#C96501;">this is a link</span></a>


Html207 html e newsletter14

HTML207: HTML e-Newsletter

Fee-Based Services

  • Campaign Monitor

    • HomepageFeaturesPricing

  • Mail Chimp

    • HomepageFeaturesPricing

  • Emma

    • HomepageFeaturesPricing

  • Constant Contact

    • HomepageFeaturesPricing


  • Html 207 html e newsletter1

    HTML 207: HTML e-Newsletter

    Questions?

    Ask now... or …

    Ask later at 974-9900 or email us at [email protected] or [email protected]


  • Login