Thực tiễn tốt nhất và cân nhắc khi viết email HTML

Tôi đã phát triển trang web trong hơn một thập kỷ, nhưng nhanh chóng nhận thấy rằng nhiều thói quen của tôi trong việc phát triển web là vô dụng khi phát triển cho ứng dụng email. Điều này đã gây ra cho tôi một số lượng lớn sự thất vọng, vì vậy tôi nghĩ tôi sẽ đặt ra một câu hỏi hy vọng sẽ làm nổi bật những thực tiễn tốt nhất và những cân nhắc cần thiết cho những người khác như bản thân tôi, những người có thể tự thiết kế cho gmail, triển vọng, v.v.Thực tiễn tốt nhất và cân nhắc khi viết email HTML

Ví dụ:<style>...</style> so với CSS nội tuyến.

Tóm lại: những gì chuyển từ thế giới web sang thế giới email và những gì không.

Nguồn

2010-02-09 Sampson

Css và bảng nội tuyến - hãy nghĩ rằng phát triển web vào khoảng năm 2000 và bạn sẽ ổn. Trình theo dõi chiến dịch có một tài nguyên tuyệt vời cho những thứ mà khách hàng email có thể xử lý. Cũng sử dụng http://www.emailonacid.com/ để thử nghiệm - tiết kiệm phải gửi nhiều lần kiểm tra.

Nguồn

2010-02-09 14:44:02 matpol

cũng có một số hướng dẫn được cung cấp bởi MailChimp đây: http://www.mailchimp.com/articles/email_marketing_guide/ –

Tôi đã làm những việc này (tại thời điểm khá) cho công việc của tôi trong một thời gian. Có rất nhiều cạm bẫy với email HTML. Các ứng dụng Email khác nhau hiển thị HTML khác nhau và làm cho IE6 trông cao cấp hơn.

Đây là tóm tắt về những gì tôi đã học được từ trước tới nay.

Sử dụng CSS nội dòng: Kiểu không phải lúc nào cũng được hỗ trợ.
Sử dụng bố cục bảng: Tôi biết, nhưng bố cục div phụ thuộc vào css và nhiều ứng dụng khách email không thể đối phó.
Không sử dụng hàngpan: Điều này gây ra các vấn đề khoảng cách kỳ lạ.
Không sử dụng hình nền: Hỗ trợ cho những giới hạn này.
Thẻ hình ảnh kiểu có "display: block": Điều này khắc phục các vấn đề khoảng cách kỳ lạ với hotmail.
Nếu sử dụng nhiều bảng lồng chúng trong một bảng cha: Điều này sẽ dừng các vấn đề khoảng cách kỳ lạ hơn.
Không sử dụng Javascript: Một lần nữa không được hỗ trợ rất tốt.
Đảm bảo email của bạn dễ đọc không có hình ảnh: Người dùng không thể tải chúng.
Cung cấp phiên bản trực tuyến và liên kết đến nó: Điều này cho phép người dùng xem nội dung dự định, ngay cả khi ứng dụng email của họ khủng khiếp.
Kiểm tra, thử nghiệm, kiểm tra: Chỉ vì nó hoạt động trong một ứng dụng email không có nghĩa là nó hoạt động ở những ứng dụng khác. Một lớn nhận được ya là Outlook 2007. Nó sử dụng từ để hiển thị HTML (tiếng thở dài).

Đây là danh sách toàn diện, nhưng nên đặt hầu hết mọi người đi đúng hướng.

Nguồn

2010-02-09 14:56:02 Magpie

Bản thân tôi cũng thấy hướng dẫn này rất hữu ích: Guide to CSS support in email clients.

Nguồn

2010-02-09 15:08:21 BalusC

này là tốt quá, vì vậy xem những gì inline CSS được hỗ trợ trong trình duyệt gì email: (! Google nó) http://www.campaignmonitor.com/css/

I và cũng khuyên bạn nên litmusapp. Đây là một công cụ tốt để kiểm tra mọi thứ.

Nguồn

2010-05-28 09:17:08 jos

Điều này có vẻ như một nơi tuyệt vời để liệt kê một số tài nguyên cho bất kỳ ai đang cố gắng tìm hiểu email HTML. Đây có thể là danh sách toàn diện nhất về tài nguyên Email HTML bạn sẽ tìm thấy trên web. Học tập vui vẻ.

Bắt đầu Hướng dẫn:

Hỗ trợ CSS & Hướng dẫn chung:

Bạn luôn nên inline CSS của bạn trong html-email.Dưới đây là danh sách các CSS Inlining Tools

Hướng dẫn Responsive:

Templates & Khung:

.210

Responsive Các ví dụ khác:

Ngoài ra Ted Goas liên kết Responsive trên có một ví dụ chất lỏng tuyệt vời.

đáp thắc mắc & chung Hướng dẫn:

Bạn sẽ cần sử dụng VML để tải hình nền hoạt động trong Outlook (Ngoại trừ in the body tag). Dưới đây là một số liên kết VML:

Nguồn

2014-01-29 17:04:18 John

Thực tiễn tốt nhất và cân nhắc khi viết email HTML

Trả lời

Các vấn đề liên quan