Summary of precautions when writing EDM in HTML (general precautions for sending emails)

Format Encoding

1. Please set the page width within 600 to 800px and the length within 1024px.

2. Please use utf-8 for HTML encoding.

3. The HTML code should be within 15KB. (Each mailbox has different standards for receiving mail. If the size of your mail exceeds 15KB, it is very likely to go into the spam folder.)

4. Please use table for layout. Put only one picture in the same <td>, such as <td><img src="photo.jpg" /></td>. All images must have a defined width and height. The same paragraph of text is placed in the same <td>.

5. If you need the email to be displayed in the center, please set align="center" in the table.

6. Word files cannot be directly converted into HTML format, otherwise it will cause non-standard encoding.

7. Do not use external CSS styles to define text and images (external CSS styles cannot be read in emails, so the emails sent out will lose their content style because they are not linked to the styles). The correct way to write it is: <td style="font-family:arial;font-size:12px;color:black">text</td>.

8. Do not use flash, Java, JavaScript, frames, iframe, activeX and DHTML. If the pictures in the page must be dynamic, please convert the flash file into gif animation for use. However, in outlook 2007, gif will not be displayed normally because outlook 2007 limits gif animation.

9. Do not use tags such as body, meta and html other than <table></table>, as some email systems will filter them out.

10. The background image code is written as follows: <table background="background.gif" cellspacing="0" cellpadding="0"></table>, but please note that Outlook does not recognize background images.

11. Do not use "onmouseover" and "onmouseout". Even if they are set in <td>, they will be filtered after being sent to the email, and the content displayed when the mouse passes over cannot be displayed.

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

13. If there is blank space on the inside or above and below the email template, do not use padding. You must use standard td to set the blank space, otherwise it will cause different parsing in different mailboxes.

14. Notes on defining line-height in Yahoo Mail: line-height needs to 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 a tag. If you define line-height only in td or p, then Yahoo Mail will not recognize the line height in a.

15. Set background-color where there is a background image to prevent the background image from being displayed and make it more beautiful.

16. Use float, margin, and padding sparingly. Absolute positioning cannot be used. To clear floats, use <table style="clear:both"></table>

text

1. The email subject should be within 18 characters. Avoid using special symbols, which may cause garbled characters.

2. Do not include information with website addresses in the email subject and content, such as "xxx.com wishes you a happy new year." If the client’s brand is well-known, the company name can be included in the theme, such as: “NIKE Sports Fashion”.

3. For text content, the layout should be as concise as possible and highlight the theme to achieve a higher click-through rate.

4. Do not use sensitive or promotional words such as: free, discount, special offer, special price, low price, cheap, cheap, video, make money, mass mailing, get rich, get rich, agency, salary, making friends, payment, business opportunity, magic weapon, treasure book, secret, intelligence, confidential, confidential, top secret, mysterious, secret, etc. If necessary, please make sensitive words into pictures.

5. If more than 200,000 emails are sent, the subject content should be changed. If more than 2 million emails are sent, redesign should be considered.

6. The font style of the text should be defined as much as possible. The default font style of each mailbox is different. In order to achieve the effect you want, the font style must be defined completely.

picture

1. Use pictures as much as possible to avoid text display differences in various mainstream mailboxes. For example, in QQ mailbox, if it is not set in the code, the text in the email cannot wrap automatically, and the font of the email content in the Gmail mailbox will automatically enlarge, which is inconsistent with the originally set character size.

2. The number of full-page images is limited to 8, and the maximum size of each image cannot exceed 15KB.

3. Please do not write the local path for the image address, for example: <img src="images/aa.jpg" /> (the recipient of the email sent in this way will not be able to see your image).

4. The image name cannot contain the character "ad", otherwise the image will be displayed as "filtered advertisement" after it is uploaded.

5. If the entire email template only has one picture, be sure to cut it into 2-3 small pictures and retain some text appropriately.

6. The requirements of Gmail and QQ mailboxes have changed again. The attributes of the picture must be completely defined. For example, <img src="images/1.jpg" style="vertical-align:top;" height="30" width="100" alt="" /> Here, style="vertical-align:top;" must be defined, otherwise there will be gaps between the pictures, deformations, and other display abnormalities.

7. Add the alt attribute to the img tag so that when users receive emails, they can still see the content in the alt even if some mailboxes hide the images. For example: <img src="images/1.jpg" style="vertical-align:top;" height="30" width="100" alt="Show content" />, let customers know the content of the email and attract them to click to display the image.

Link

1. The number of links cannot exceed 10. If the link addresses of all pictures are the same, please merge all the small pictures into one large picture.

2. Please write the link as an absolute address. (To ensure that recipients can browse your content normally when clicking the link).

3. The length of the link address cannot exceed 255 characters, otherwise it will result in untrackable or link errors.

4. Do not use the map function to link images. This function will cause the email to be classified as spam by most mailboxes.

5. To avoid users being unable to view images in emails, please create a web page with the same content as the email, and then write at the top of the email: "If you cannot view the email content, please click here" to link to the web page with the same content.

6. There is a high risk that the website address link appearing in the text will be blocked as spam. For example, for links like http://xxx.com, it is recommended to write "XXX Company" plus a link, or make the URL into a picture and add a link.

7. It is best not to use special symbols in the link to avoid email parsing errors.

8. The link code should be as short as possible. If the code is too long, it will increase the template size and affect the email sending effect.

Outlook Rules

1. The <col> tag cannot be recognized. If you want to define the same width for several TDs, you can write the specific width in the specific TD. For example, <td width=""></td>.

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

3. The vertical-align of inline elements cannot be recognized. For example, <img src="1.jpg" style="vertical-align:bottom" />, this image will not be aligned with the bottom of the elements in the same row. You can write <td valign="bottom"><img src="1.jpg" /></td>.

4. If td contains a table, the style of the label defined in the child table will only correctly display the style defined in the child table, and the style in the parent table cannot be displayed correctly. Note: If there is an a tag in a table, the color style of the content in the a tag must be defined in the a tag. It is invalid to define it in the parent td or the table where it is located.

5. If there is a space between td and td, use <td style="border-bottom:10px solid #fff"></td>. In this way, there will be no space between td. There will be no spaces when using <td style="margin-bottom: 10px"></td>. If there is a gap between td, it must be separated by <td></td><td height="10px">&nbsp;</td><td></td>. But if it is a table, then the content in <table style="border-top:10px solid #ffffff; border-bottom:20px solid #ffffff"></table> will have blank lines above and below.

6. The width of the p tag is not recognized. For example, if <p style=”width:320px” ></p>, the content in the p tag will not automatically wrap at 320px. Only when the width of <td> is set, the content will wrap at the width limit.

7. If you want to use the <P> tag, you must consider the line height between the upper and lower lines of the <P> tag itself.

8. Setting margin in <td> is invalid, whether it is margin-left, margin-right, margin-top or margin-boottom, it has no effect.

9. When <img align="left" /> or <img align="right" /> is set, the image will be out of the document flow. If margin or padding is set on its parent element, it cannot be moved down, left or right.

10. In Outlook, if the nested picture is too long, it will cause abnormal display. You can cut the picture into several shorter pictures and then lay it out.

Also, when you send an email template, try to paste the source code in the format. The style may be lost if forwarded too many times!