1. HTML 207 HTML e-Newsletter Donna Carnduff Susannah Finley

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

3. HTML207: HTML e-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 Headlines http://www.copyblogger.com/magnetic-headlines/ http://www.copyblogger.com/magnetic-headlines/ Article Titles Action Items Above the Fold Writing for Your Newsletter

4. HTML207: HTML e-Newsletter http://itc.utk.edu/web/html207/ UTWrdmrkPlainLong-420px.gif header-earth.jpg soil-samples.jpg template.html Download Template Files

5. HTML207: HTML e-Newsletter campaignmonitor.com/templates (free)campaignmonitor.com/templates Downloaded Original Premailer Copy Or…Find Templates Online

6. HTML207: HTML e-Newsletter Understand Current Code Standards Code Standards Adapt for Your Organization Top links Main content Footer Preview the Document Customize Your Template Code in DW

7. HTML207: HTML e-Newsletter Consider Title (will be subject line) Create permanent image folder Add alt tags to images Send mix of images and text Use absolute paths for images, links Open a new window Build your image resources Best Practices

8. HTML207: HTML e-Newsletter 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 clients http://www.campaignmonitor.com/css/#p http://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/ Resources

9. HTML207: HTML e-Newsletter 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/ Resources

10. HTML207: HTML e-Newsletter Pre-Mailer Move Styles Inline

11. HTML207: HTML e-Newsletter What are your options for uploading? Dreamweaver CyberDuck (Mac) CyberDuck WinSCP (PC) WinSCP VolSpace Post to the Web

12. HTML207: HTML e-Newsletter Distribution List Internet Explorer Outlook File -> Send -> Page by email… Send as e-Newsletter

13. HTML207: HTML e-Newsletter Safari Mail/Entourage File -> Mail Contents of This Page Send as e-Newsletter

14. HTML207: HTML e-Newsletter Send from a PC Send from a Mac Test in email clients: http://www.campaignmonitor.com/stats/email-clients/ http://www.campaignmonitor.com/stats/email-clients/ Outlook 2003, 2007, 2010 Hotmail / Windows Live Yahoo iPhone Gmail Send and Evaluate

15. HTML207: HTML e-Newsletter Put styles back in the 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; } Span around each link this is a link Link Color in Gmail, Headers in Hotmail

16. HTML207: HTML e-Newsletter Campaign Monitor Homepage Features Pricing HomepageFeaturesPricing Mail Chimp Homepage Features Pricing HomepageFeaturesPricing Emma Homepage Features Pricing HomepageFeaturesPricing Constant Contact Homepage Features Pricing HomepageFeaturesPricing Fee-Based Services

17. HTML 207: HTML e-Newsletter Ask now... or … Ask later at 974-9900 or email us at dcarnduf@utk.edu or sfinley@utk.edu dcarnduf@utk.edusfinley@utk.edu Questions?