[HTML] EDM email Production Guide

Professional EDM email sending requires strict production. This Guide provides instructions on format encoding, text, images, and links, follow this guide to create your EDM email template one by one.

Format Encoding

1. Set the page width to less than 600 to PX and the length to be less than PX.

2. Use UTF-8 for HTML encoding.

3. htmlCodeWithin 15 kb. (Different email receiving standards vary. If your email exceeds 15 kb, it is likely to enter the recycle bin)

4. Use a table for layout. Put only one image in the same <TD>, for example, <TD> </TD>. The width and height of all images must be defined. Put the same text in the same <TD>.

5. If you want to display emails in the center, set align = "center" in the table ".

6. You cannot directly convert a Word file to an HTML format. Otherwise, the encoding is not standard.

7. Do not use CSS styles of external links to define text and images (CSS styles of external links cannot be read in emails, so the emails sent out are not linked to styles, will cause the style of your email content to be lost.) the correct syntax is as follows: <TD style = "font-family: Arial; font-size: 12px; color: black "> text </TD>.

8. Do not use flash, Java, JavaScript, frames, IFRAME, ActiveX, or DHTML. If the images on the page must be dynamic, convert the Flash file to gif animation, however, in outlook2007, GIF cannot be displayed normally, because outlook2007 restricts GIF animation.

9. Do not use tags such as body, Meta, and HTML other than <Table> </table>. Some mailbox systems will filter these tags out.

10. The background image code is written as follows: <Table background = "background.gif" cellspacing = "0" cellpadding = "0"> </table>, outlook does not recognize background images.

11. Do not display "onmouseover" or "onmouseout". Even if it is set in <TD>, it will be filtered out after it is sent to the mailbox, and the content displayed after the mouse is set cannot be displayed.

12. The font-family attribute cannot be blank; otherwise, it will be blocked as spam by QQ.

13. If there is a blank gap between the side or up or down of the email template, do not use padding. You must use the standard td to set the blank gap. Otherwise, the resolution of each mailbox may be different.

14. Note for defining line-height in Yahoo Mail: Line-height must be defined in block-level elements. If there is a p tag in TD, line-height must also be defined in P. Whether it is TD or P, if there is a hyperlink, line-height must be defined in the tag. If line-height is defined in TD or P, Yahoo Mail cannot identify the Row Height in.

Text

1. Email subject should be within 18 characters to avoid using special symbols and prone to garbled characters.

2. Do not add any information with the website address to the subject or content of the email, such as "xxx.com wish you a Happy New Year ". If the customer's brand awareness is high, the topic can be added to the company name, such as "Nike sports fashion ".

3. text content and layout should be as concise as possible, highlighting themes to achieve a higher click rate.

4. Do not use text similar to the following sensitive and promotional materials: free, discount, special offer, special offer, low price, cheap, cheap, video, making money, sending a group, making a fortune, getting rich, opening up, salary, making friends, payment, business opportunities, magic weapon, baodian, secret, intelligence, confidential, confidential, top secret, mysterious, and secret. If necessary, make sensitive words into images.

5. If more than 0.2 million messages are sent, the topic content should be changed, and more than 2 million messages are sent, you should consider re-designing.

6. Try to define the font style of the text. The default font style of each mailbox is different. To achieve the desired effect, the font style must be completely defined.

Image

1. Try to use images to avoid text display differences in mainstream mailboxes. For example, if QQ mail is not set in the Code, the text in the mail cannot be automatically wrapped, And the font of The Gmail mail content is automatically enlarged, which is different from the original character size.

2. The number of images on the entire page is limited to 8, and the maximum size of each image cannot exceed 15 kb.

3. Do not write the image address as a local path, for example, . (In this way, the recipient will not be able to see your image ).

4. The image name cannot contain ad characters. Otherwise, the image will be displayed as a "filtered advertisement" after being uploaded ".

5. If the entire email template has only one image, cut it into two or three small images and retain some text as appropriate.

6. The requirements for Gmail and QQ mail have changed. The image attributes must be completely defined, for example, style =" vertical-align: Top; "must be defined, otherwise, there may be gaps, deformation, and other abnormalities between images.

7. Add the alt attribute to the IMG label so that when you receive the email, you can see the content in ALT even if some mailboxes hide the image. For example, , let the customer understand the content of the email and attract the customer to click and display the image.

Link

1. The number of links cannot exceed 10. If the link addresses of all images are the same, merge all the small images into a large image.

2. Write the link as an absolute address. (To ensure that the recipient can view your content normally when clicking the link ).

3. The link address cannot exceed 255 characters, leading to tracing or Link errors.

4. Do not use the map function to link images. This function divides most emails into spams.

5. To prevent users from browsing the email images they receive, make a Web page with the same content as the email, and then enter "if you cannot view the email content, click here to link to the web page with the same content as the visitor.

6. the risk that the link of the website address is blocked as spam is extremely high in text, for example: http://xxx.com such link, it is recommended to write "XXX company" text plus link, or you can add a link to an image.

7. Do not use special symbols in the link to avoid mailbox resolution errors.

8. The link code should be as short as possible. If the code is too long, the template size will be increased, which will affect the mail sending effect.

Outlook rules

1. <Col> labels cannot be recognized. To define several identical TD widths, you can write the specific width in the specific TD. For example, <TD width = ""> </TD>.

2. the padding of inline elements cannot be identified, for example, <a href = "#" style = "padding-left: 40px;"> </a>, the content in tag a is not 40 PX away from the left. You can define padding in TD.

3. Vertical-align of inline elements cannot be recognized, for example, , this image is not aligned with the elements of the same row. You can write it as <TD valign = "bottom"> </TD>.

4. If TD contains a table, the label style defined in the sub-table will only display the style defined in the sub-Table correctly, the style of the parent table cannot be correctly displayed. Note: If a label exists in the table, the color style of the content in the label must be defined in the label, and the definition in the parent TD or in the table is invalid.

5. If there is an interval between TD and TD, use <TD style = "border-bottom: 10px solid # fff"> </TD>, in this case, there will be no interval between TD. <TD style = "margin-bottom: 10px"> </TD> does not contain spaces. If there is a gap between TD, it must be separated by <TD> </TD> <TD Height = "10px"> & nbsp; </TD>. If it is a table, <Table Style = "border-top: 10px solid # ffffff; border-bottom: 20px solid # ffffff "> </table>.

6. The width of the P tag is unknown. For example, if <P style = "width: 320px"> </P>, the content of the P tag will not automatically wrap at 320px. Only when <TD> width is set will the content wrap in the Width limit.

7. If you want to use the <p> label, consider the Row Height between the upper and lower rows of the <p> label.

8. Setting margin in <TD> is invalid. No effect is available, whether it is margin-left, margin-right, margin-top, or margin-boottom.

9. When or is set, the image is out of the Document Stream, if the parent element is set to margin or padding, it cannot be moved down, left or right.

10. In outlook, if the nested image is too long, the display will be abnormal. You can crop the image into several shorter small images and then layout it.

PS: The red part is newly added.