Tips for creating HTML emails that can be normally displayed in mainstream mailboxes _ HTML/Xhtml _ webpage Creation

Source: Internet
Author: User
Tags set background
Suggestions for sending html emails: use styles to write inline CSS; use fewer images; Use tables to implement left and right la s or more complex la s; and use background to Set background images. Almost every membership website needs to send emails to communicate with its members through the background, such as registration confirmation and marketing promotion. Suggestions for sending html emails by the website: Use style to write inline CSS; use fewer images; Use table to implement left and right layout or more complex layout; and use background to Set background images.
Almost every membership website needs to send emails to communicate with its members through the background, such as registration confirmation and marketing promotion. These messages sent by the website to members are often in plain text format and cannot meet the interface and interaction requirements. At this time, we need to send HTML pages. Because HTML mail is not an independent HOST on the website page, it is sent by a sender. Therefore, writing HTML emails is very different from writing HTML pages. Because mainstream mailboxes for Internet users are more or less used to filter HTML emails they receive in the background. Without a doubt, JavaScript code is strictly filtered out, including all event listening attributes, such as onclick and onmouseover, which are based on mail security considerations. In addition, CSS code is partially filtered. What I want to talk about is how to compile HTML emails that can be normally displayed without being filtered by mainstream mailboxes.
Suggestions for sending html emails: use styles to write inline CSS; use fewer images; Use tables to implement left and right la s or more complex la s; and use background to Set background images.
First, let's take a look at how the mailbox shows HTML emails. I have never done a mail system, and the filtering algorithms in the background of various mailboxes are not that easy for outsiders to know. Therefore, we can only use the front-end display to speculate which are accepted by the mailbox, and which are filtered out. Through the analysis of gmail, hotmail, 163, sohu, and sina mailboxes, I divided them into two types:
The first type includes gmail, hotmail, sohu, etc. The mail content is placed in a certain p on the entire mailbox page.
The second category includes 163 and sina. emails of this type are arranged in an independent iframe.
Anyone familiar with HTML knows that iframe is an independent document, which is irrelevant to the elements and CSS of the parent page and can be treated as an independent page. If the mail content is in p, the Mail content is an integral part of the entire mailbox page. Obviously, if you use iframe as an email address, you will be more tolerant of the email content, because it gives you enough independent performance space. P is not that polite. Think about it. If you write such a CSS in your email, is it because the font on the entire mailbox display page is 20px and the mess is caused:


We need to write a unified mail template compatible with all mailboxes, so we must avoid the above external CSS writing, and style similar to float, position, and other non-normal content streams will also be filtered, if you write it, it may affect the performance of the external mailbox.
Below I will list some writing principles:
1. Do not write a global rule

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.