Công nghệ

Cơ bản về Email HTML

email-marketing

Trong bài viết tham khảo này giả định bạn là một nhà thiết kế giao diện web có kiến thức làm việc về HTML và CSS. Bạn có thể thoải mái mã hóa và sử dụng các bảng HTML cho cấu trúc và làm việc theo các tiêu chuẩn mã hóa hiện đại vào năm 1999.

Thiết kế

Có một số điều cần lưu ý khi thiết kế các chiến dịch email HTML.

  • Email nên có chiều rộng tối đa 600-800 pixel. Điều này sẽ làm cho chúng hoạt động tốt hơn trong kích thước khung xem trước được cung cấp bởi nhiều khách hàng.
  • Thiết kế đơn giản. Sử dụng các lớp dựa trên lưới và tránh các yếu tố phức tạp yêu cầu nổi hoặc định vị HTML.
  • Giả sử hình ảnh ban đầu sẽ bị chặn bởi các ứng dụng email, hoặc một số hình ảnh nhất định Hình ảnh nền, ví dụ, sẽ hoàn toàn không tải được.
  • Đừng thiết kế một email mà về cơ bản là một hình ảnh lớn, được cắt lát. Mặc dù các loại email này trông khá đẹp, nhưng chúng hoạt động kém.
  • Sử dụng các phông chữ cơ bản, đa nền tảng như Arial, Verdana, Georgia và Times New Roman.
  • Tránh các yếu tố yêu cầu Flash hoặc JavaScript. Nếu bạn cần chuyển động trong email, .gif là lựa chọn tốt nhất của bạn.
  • Đừng quên trải nghiệm di động! Email của bạn có thể đọc được ở độ dài trên màn hình nhỏ không? Hình ảnh có làm chậm thời gian tải trên thiết bị di động không? Liên kết của bạn có dễ bấm bằng ngón tay cái không?

Phát triển

Giống như với thiết kế, có những cách tốt nhất để làm theo khi mã hóa email HTML.

  • Mã tất cả các cấu trúc bằng cách sử dụng phần tử bảng. Đối với các bố cục phức tạp hơn, bạn nên lồng các bảng để xây dựng các cấu trúc phức tạp.
  • Sử dụng các thuộc tính phần tử (chẳng hạn như cellpadding, valign và width) để đặt kích thước bảng. Điều này buộc một cấu trúc mô hình hộp.
  • Giữ CSS của bạn đơn giản. Tránh khai báo kiểu hỗn hợp (font: #000 12px Arial, Helvetica, sans-serif;), mã tốc ký (#000 thay vì #000000), thuộc tính bố cục CSS (slot, position, clear, visibility, v.v.), các bộ chọn phức tạp (descendant, child hoặc sibling và các phần tử sử dụng chung).
  • Nội tuyến tất cả CSS trước khi gửi.
  • Chỉ sử dụng các liên kết tuyệt đối cho hình ảnh và lưu trữ những hình ảnh đó trên một máy chủ tin cậy.
  • Đừng bận tâm với JavaScript hoặc Flash, những công nghệ này phần lớn không được hỗ trợ bởi các ứng dụng email.
  • Thân thiện với thiết bị di động nếu có thể. Sử dụng truy vấn @media để tăng kích thước văn bản trên màn hình nhỏ, cung cấp các vùng nhấn kích thước ngón tay cái (~ 46x46px) cho các liên kết. Tạo một email đáp ứng nếu thiết kế cho phép nó.
  • Thử nghiệm, thử nghiệm, thử nghiệm. Tạo tài khoản email trên các dịch vụ khác nhau và gửi email cho chính bạn. Làm điều này kết hợp với các dịch vụ như Litmus.

Comment here