Design Checklist

Transcription

1 TAMARAGIELEN w w w. t a m a r a g i e l e n. c o m Design Checklist Tamara Gielen Marketing Consultant tamara@tamaragielen.com

2 Design Checklist Envelope Include your brand name in the from name Make sure your from address is recognizable Use a short and descriptive subject line Pre-header Start with a line of text that describes the content Include a link to an online version of your Preview pane area (top 400x300 pixels) If you have multiple topics, include a table of contents If you have multiple product categories, provide a navigation bar with links to each of these categories Include a value proposition (headline) and a call-to-action Body copy Use short sentences and paragraphs Make sure the copy is scannable Use bold typeface and subheadersto make certain words stand out Use bullet points to showcase benefits Make sure all text is formatted as text Use bullet-proof html buttons instead of images for your call-to-actions Include more than one link to your call-to-action Spell-check your copy Use alt-tags to describe your images Footer area Include your contact details Include a link to an unsubscribe and an update your profile page Include links to the main sections on your website or to your main product categories Add social sharing buttons and a forward to a friend link

3 Design Guidelines 1. Take advantage of the preview pane Always include preview pane friendly code in your designs, this uses basic HTML to render colour, branding and information before the has even been opened or approved. 2. Code s by hand if you can Programs such as Word / FrontPage are not ideal for designing HTML s, because these "WYSIWYG" (What You See Is What You Get) editors typically add extra code that causes havoc with certain clients. Although most platforms clean this code when pasted into your design, it is better to have an HTML programmer code your template by hand to keep it clean. Otherwise, use programs such as HomeSiteor Dreamweaver and remove any unnecessary code by hand. 3. Do not use canvas background images(they don't display in most clients) Do not use background images in tables or as a canvas background, background images have always been a problem within Lotus Notes. Now Office 2007 uses Word to render this is more of a problem. 4. Avoid pixel spacer gifs Pixel spacer gifs are used to force widths in table data cells to aid formatting, spammers use them, so you shouldn t.

4 Design Guidelines 5. Avoid using Cascading Style Sheets. As far as best practice is concerned, inline styling is a better option. Your designs will be delivered exactly as they should be. CSS on a Website can simplify the coding process and ensure a consistent style, but in HTML , they can cause incorrect rendering in some clients or simply get stripped out or overwritten. CSS can still be used in all its glory on landing zones. 6. Keep HTML s from 500 to 650 pixels wide HTML messages that are wider force the recipient to scroll horizontally to see the whole message. Messages that are too wide are especially problematic when users give your only a quick glance in a preview pane. 7. Validate and check your HTML content Validate your design code to ensure its conformance to W3C recommendations and other standards. Use a spam checker to allow you to check your content before you send your campaign. 8. Avoid scripting in your s Do not use scripting in your designs. Save any scripting for your landing pages, including Java Script.

5 Design Guidelines 9. Link to a Web version of your message and add a text version This benefits recipients whose clients don't render your properly, no matter how carefully you format it. As most platforms send a 2 part Mime message, don t forget to include a text version with your design. 10. Use image alt tags These show one or two words describing an image or an action when the image doesn't display because of slow loading time or default image blocking. 11. Use horizontal layout rather than vertical This allows readers who scroll down in the preview pane to see more content in the pane. Eliminate story layouts and "skyscraper" ad formats that are more than the pixel equivalent of 4 inches deep. 12. Don t overuse HTML functions Keep the use of HTML functions to a minimum, for example, layout items such as layers are a bad idea. Don t use any scripts in your s. 13. Text Version Always include a text version of every that you design.

6 About the author Tamara Gielenis an independent and digital direct marketing consultant and a recognized marketing thought leader. She has over 10 years of experience in online, and direct marketing. Tamara is the author of a leading marketing best practices blog and the founder of The Marketer s Club, an international knowledge-sharing and networking community with 3,600 members. Before starting her own consulting business, Tamara ran marketing programs at ebay.beand Cognosand helped clients such as DHL Express, IBM and many others in her role as Director, & Digital Dialogue Strategies at OgilvyOne Worldwide. Whether you are just starting with marketing or you are ready to take marketing to the next level in your organization, Tamara offers training, coaching and consulting services to help you achieve the best results possible: marketing strategy & advice creation and sending of newsletters and campaigns choosing an service provider managing campaigns training & workshops solving deliverability problems and so much more... For more information, visit