Làm thế nào để thiết kế email marketing đúng chuẩn HTML?

Published by Nguyễn Hà on

Có hai loại email thường dùng trong các chiến dịch email marketing: HTML và văn bản thuần túy. Email văn bản thuần túy cung cấp văn bản thông thường không có hình ảnh hoặc thiết kế lạ mắt. Định dạng này tương thích với hầu hết các ứng dụng và dịch vụ email. Mặt khác, thiết kế email marketing sử dụng HTML cho phép kết hợp tất cả các hình ảnh, phông chữ và bố cục, giống như một website. Nó không có độ tương thích cao như email văn bản thuần túy. Tuy nhiên, email html thường mang lại kết quả vượt trội.

Thiết kế email HTML cho phép bạn tạo ra các email trông tuyệt vời với nhiều hình ảnh hấp dẫn. Thậm chí, bạn có thể thiết kế email trông giống như một trang trên website, sử dụng cùng đồ họa, màu sắc và sơ đồ thiết kế.

Nhưng làm thế nào để thiết kế email marketing đúng chuẩn html? Hãy theo dõi bài viết này của Top Marketing, các bạn sẽ tìm ra giải pháp cho riêng mình chỉ trong 3 phút.

Mục lục nội dung


Lợi ích của việc thiết kế email marketing đúng chuẩn html

1. Loại bỏ những yếu tố thường bị nhận diện là spam của các hệ thống chặn thư rác

Các ESP – Email Service Provider (nhà cung cấp dịch vụ email) rất quan tâm đến vấn đề thư rác. Họ luôn không ngừng cải tiến kỹ thuật và đặt ra nhiều thuật toán khác nhau để ngăn chặn spam. Chính vì lẽ đó, thiết kế template email marketing đúng chuẩn html đang được nhiều nhà tiếp thị quan tâm hơn. Bởi không ai muốn thông điệp của mình rơi vào mục spam của khách hàng cả.

Hầu hết các nhà tiếp thị đều muốn nội dung quảng cáo email hiển thị thật hấp dẫn với người nhận. Vậy nên, họ thường sử dụng nhiều hình ảnh sinh động, ấn tượng thu hút sự chú ý. Cách thiết kế này rất phổ biến dù là hình thức quảng cáo online hay offline.

Tuy nhiên ESP thì có luật riêng của họ. Bạn cần biết rằng “Nếu ESP không hiểu được nội dung của email là gì thì email đó sẽ được xem là email spam“. Hình ảnh là một dạng dữ liệu mà hệ thống lọc spam tự động rất khó nắm bắt nội dung. Do đó, những mẫu thiết kế email chỉ bằng một hình ảnh lớn thường hay bị bắt gặp trong hộp thư rác.

2. Thiết kế email marketing html giúp tối ưu hiển thị trên mọi thiết bị di động

Hầu hết người dùng hiện nay không chỉ truy cập email trên máy tính. Họ còn thường đăng nhập trên điện thoại hoặc máy tính bảng để làm việc. Dễ dàng nhận thấy, kích thước màn hình của các thiết bị này không giống nhau. Điện thoại di động có màn hình nhỏ nhất. Do đó, mẫu email của bạn không chỉ hoạt động tốt trên máy tính mà còn phải đáp ứng với các thiết bị di động nữa. Và thiết kế email marketing html giúp bạn giải quyết nhanh chóng tiêu chí này.

3. Tăng tính tương tác với người nhận

Với thiết kế email HTML, bạn có quyền tự do sáng tạo để giúp truyền tải thông điệp của mình hiệu quả hơn. Thay vì sử dụng văn bản thuần túy, bạn có thể làm cho email đa dạng hơn về màu sắc, hình ảnh, nền và phông chữ. Điều này giúp tăng sự thu hút với khán giả. Qua đó, cải thiện tỷ lệ tương tác cho các chiến dịch tiếp thị.

Trên đây là 3 lợi ích hàng đầu bạn cần biết của việc thiết kế email html mang lại cho chiến dịch.

Đối với các nhà tiếp thị đã rành về viết mã html, có những điểm cần lưu ý khi bạn thiết kế email marketing. Bởi nó không giống như thiết kế web. Email có những chuẩn riêng về kiểu dáng, hình ảnh và kích thước.

Nếu bạn quan tâm về chuẩn W3C, sử dụng công nghệ mới nhất trong CSS,…bạn nên quên tất cả chúng đi khi bắt đầu thiết kế Email.

Làm cách nào để thiết kế email marketing html?

Thiết kế email HTML cũng giống như thiết kế HTML cho các trang web. Ngày nay, hầu hết mã hóa HTML được thực hiện đơn giản thông qua các dịch vụ, phần mềm email marketing. Những công cụ này giúp bạn nhanh chóng thiết kế các email trực quan mà không cần nhập mã lập trình phức tạp theo cách thủ công.

Tại Việt Nam, bạn có thể tham khảo phần mềm Top Email. Đây là công cụ gửi email marketing được rất nhiều nhà tiếp thị, các doanh nghiệp vừa và nhỏ trong nước sử dụng bởi tính đơn giản của nó.

Thiết kế email html bằng phần mềm Top Email

thiet-ke-email-html-bang-phan-mem-top-email-marketing

Top Email được cài đặt miễn phí. Chỉ cần có máy tính hệ điều hành Windows, bạn có thể nhanh chóng sở hữu kho template sẵn có của nó. Download phần mềm Top Email.

thu-vien-template-email-marketing-phan-mem-top

Tạo email HTML trên phần mềm Top được tùy chỉnh kết hợp nhiều yếu tố khác nhau, bao gồm:

  • Văn bản và tiêu đề được định dạng đặc biệt, với nhiều loại phông chữ, kích thước và màu sắc khác nhau.
  • Ảnh minh họa và các đồ họa khác.
  • Nền tùy chỉnh màu sắc.
  • Ưu đãi nổi bật và lời kêu gọi hành động.
  • Logo cùng các yếu tố thương hiệu khác…v.v.

Một số lưu ý để tạo mẫu email marketing đúng chuẩn html

luu-y-thiet-ke-email-marketing-html

1. Về layout (bố cục)

Cấu trúc template email rất quan trọng. Các ESP luôn quét template theo trật tự từ trên xuống. Do đó, cấu trúc và nội dung phần đầu sẽ quyết định rất nhiều đến chất lượng của mẫu email. Bạn cần thiết kế phần này sao cho đơn giản và rõ ràng nhất với các thuật toán.

Để thiết kế template email đúng chuẩn chúng ta cũng cần tối giản các thẻ HTML. Nếu dùng quá nhiều thẻ, template email của bạn sẽ càng phức tạp. Mặc dù có nhiều nhà cung cấp hộp thư khác nhau những hầu hết các ESP đều hướng tới sự đơn giản nhất. Email là một công cụ trao đổi thông tin giữa người và người. Bạn hãy để ý xem, phần lớn các email liên lạc đều có kết cấu rất đơn giản. Do đó khi bạn thiết kế email marketing html, hãy xây dựng chúng tự nhiên như email trao đổi thông thường.

Ngoài ra, cần chú ý quy tắc chung cho chiều rộng email chỉ nên ở mức 650px hoặc ngắn hơn. Điều này cho phép email hiển thị đúng bố cục trong hầu hết các chương trình đọc email. Ví dụ như các ứng dụng Outlook, IncrediMail, Lotus.. hoặc webmail như Gmail, Hotmail, Yahoo…v.v.

2. Lưu ý về thiết kế hình ảnh

luu-y-thiet-ke-hinh-anh-email-marketing

Tỷ lệ ảnh so với văn bản

Nhiệm vụ của chúng ta cần đảm bảo luôn duy trì tỷ lệ văn bản và hình tối thiểu 70:30. Một mẫu thiết kế hoạt động tốt khi đáp ứng tỷ lệ 80 text với 20 ảnh.

Lưu ý về src của hình ảnh

Khi chèn hình ảnh, nên sử dụng ảnh với Src là URL tuyệt đối. Tức là thay vì chèn ảnh ảnh như <img src=”/img.gif“>,
bạn phải sử dụng <img src=”http://site.com/img.gif“>

Luôn sử dụng thẻ alt

<img src=”http://site.com/img.gif” alt=“Company ABC”>

Hầu hết các ứng dụng email không hiển thị ảnh theo mặc định. Nếu bạn không sử dụng thẻ alt-text, vị trí hình ảnh sẽ trở thành khung trống, không hiển thị gì cả. Như vậy sẽ rất mất thẩm mỹ, đồng thời cũng thể hiện sự kém chuyên nghiệp.

Không nhúng Flash hay Video

Không phải là ý tưởng tốt nếu nhúng video hay flash trực tiếp vào email. Vì một số email client không hỗ trợ code nhúng của bạn.

Vậy nên, thay vì nhúng video, flash, bạn nên chèn ảnh chụp video/flash đó. Tiếp theo, chỉ cần thêm một liên kết (hyperlink) tới nguồn phát video, người đọc click vào sẽ được chuyển hướng tới trình phát.

Không phải email client nào cũng hỗ trợ ảnh Gif động

Hãy cân nhắc việc sử dụng ảnh gif động. Trong khi phần lớn hỗ trợ gif động thì Outlook 2007 không hỗ trợ. Thậm chí, nó có thể chỉ hiển thị khung viền của ảnh gif.

3. Lưu ý về thiết kế background cho email marketing chuẩn html

thiet-ke-html-email-marketing

Không nên sử dụng hình ảnh làm backgrounds

Nếu bạn đang sử dụng ảnh làm background thì hãy để ý là một số email client sẽ không hiển thị chúng. Nếu bạn vẫn muốn sử dụng thì hãy dùng thẻ HTML thay vì sử dụng CSS.

Màu sắc background

Một số email client (như Gmail) không hiển thị background color mà bạn đặt ở thẻ. Nếu bạn đang cấu hình màu nền cho background thì nên dùng một thẻ div bao với màu nền. Vì nếu body background color không hiển thị thì bạn sẽ vẫn hiển thị được một màu tương tự.

4. Một số chú ý khác

Xem xét kích thước file của bạn

Email hay ảnh càng nhẹ thì càng dễ tải về. Nếu bạn không muốn người nhận phải chờ 30 giây để đọc được email thì hãy xem xét lại kích thước ảnh của bạn.

Tránh sử dụng Microsoft Office để tạo email html

Mã HTML được tạo ra bởi MS Office sẽ có rất nhiều vấn đề khi hiển thị trên email client. Nếu bạn có ý định copy từ MS Office thì có thể sử dụng Dreamweaver để đơn giản hóa thẻ html của bạn.

Cách đo lường sự thành công của thiết kế email HTML

Để xác định thiết kế email marketing html đã đúng chuẩn hay chưa thì bạn nên gửi thử mẫu sau khi đã hoàn thành. Nếu tỷ lệ email vào inbox trên 70% cũng đồng nghĩa với mẫu thiết kế html này hoạt động tốt.

Thực tế, email văn bản thuần túy hứa hẹn khả năng gửi gần như 100%. Tuy nhiên, hầu hết các nghiên cứu cho thấy rằng email bao gồm hình ảnh có tỷ lệ nhấp cao hơn so với email văn bản thuần túy.

Ngoài ra, thiết kế email HTML là một phương tiện tốt hơn để xây dựng thương hiệu. Nó kết hợp tất cả các yếu tố hình ảnh của thương hiệu và sản phẩm. Còn email văn bản thuần túy không có gì khác ngoài từ ngữ.

Khi bắt tay vào thực tế, hãy luôn theo dõi các số liệu về khả năng gửi, tỷ lệ mở, tỷ lệ nhấp…v.v. Lợi thế của việc sử dụng thiết kế email HTML là bạn có thể theo dõi nhiều dữ liệu hơn – như tỷ lệ mở và click – so với những phiên bản văn bản thuần túy.

Chúc bạn thành công!

5/5 - (2 bình chọn)

Nguyễn Hà

"Không có phần mềm marketing tốt nhất, chỉ có phần mềm marketing phù hợp nhất" - Ha Nguyen

Chat Zalo Telegram Facebook YouTube