Nhúng hình ảnh vào email HTML Outlook

Nhúng hình ảnh vào email là rất quan trọng để tiếp thị qua email. Cái nào bạn nghĩ sẽ hoạt động tốt hơn. một tin nhắn văn bản đơn giản hay một mẫu HTML với hình ảnh hấp dẫn đầy màu sắc?

Khoảng 90% tất cả thông tin mà chúng tôi cảm nhận được là hình ảnh và được xử lý nhanh hơn 60.000 lần so với văn bản thông thường. Ngoài ra, nội dung trực quan làm tăng sự tương tác của khách hàng. Đó là lý do tại sao hơn 70% chiến dịch email hàng loạt ngày nay được đóng khung trong một mẫu đẹp, có thương hiệu ở định dạng HTML. HTML cho phép nhúng hình ảnh vào email

Có những cách nào để nhúng hình ảnh vào email, khó khăn nào có thể phát sinh và bạn giải quyết chúng như thế nào?

Nhúng hình ảnh vào email có nghĩa là gì?

Nhúng cho phép bạn thêm các yếu tố đa phương tiện vào mẫu email của mình. Lý tưởng nhất là sau khi nhúng, bạn sẽ có một phần tử đầy đủ chức năng mà bạn có thể tương tác, giống như trên trang web mà phần tử đó được lấy từ

Tuy nhiên, không phải lúc nào cũng dễ dàng nhúng hình ảnh vào email. kênh email (cụ thể là ứng dụng email, khi chúng hiển thị email của chúng tôi cho người dùng) thêm rất nhiều hạn chế đối với những gì bạn có thể sử dụng về mặt HTML. Ngoài ra, nếu bạn cố gắng nhúng một video hoặc một đối tượng tương tác vào email, điều đó sẽ không hoạt động trong tất cả hoặc hầu hết các ứng dụng email. Vì vậy, về mặt nhúng các đối tượng đa phương tiện vào email, điều duy nhất chúng tôi có thể chắc chắn 100% về việc hiển thị chính xác là hình ảnh

Những điều cần xem xét khi bạn nhúng hình ảnh vào email

Lưu ý rằng bạn không thể nhúng bất kỳ hình ảnh nào vào email. bạn phải tính đến kích thước, kích thước, định dạng và đặc thù của ứng dụng email. Hãy thảo luận chi tiết về từng yếu tố

Chọn định dạng hình ảnh nào để nhúng vào email?

Ngày nay, các định dạng phổ biến nhất để nhúng hình ảnh vào email là JPEG, GIF và PNG. Mỗi người trong số họ đều có ưu và nhược điểm, vì vậy bạn nên được hướng dẫn bởi nhiệm vụ bạn đặt cho bức tranh khi chọn.  

1. Ảnh JPEG

Hình ảnh JPEG là hoàn hảo cho các email HTML về kích thước. chúng nhỏ và sẽ nhanh chóng tải xuống trong một chiến dịch email. Ngoài ra, hình ảnh JPEG thực hiện rất tốt việc hiển thị màu sắc trong ảnh của bạn. Nếu bạn muốn hình ảnh không làm chậm quá trình tải nội dung email và có kích thước nhỏ, hình ảnh JPEG là lựa chọn hàng đầu của bạn.  

Nhược điểm chính của định dạng JPEG là nó chứa ít dữ liệu hơn về hình ảnh và không hiển thị hiệu ứng trong suốt. Nếu bạn cần nhúng hình ảnh chất lượng cao vào email của mình, chúng tôi khuyên bạn nên thử PNG.  

2. Hình ảnh PNG

Định dạng PNG truyền tải văn bản và độ trong suốt ngay cả khi được nén. Đó là lý do tại sao PNG hoàn hảo cho logo hoặc các trường hợp khác khi bạn cần nhúng hình ảnh chất lượng cao vào email của mình. Định dạng PNG lưu thêm thông tin về hình ảnh và hiển thị các chi tiết nhỏ nhất. Lưu ý rằng hình ảnh PNG lớn hơn JPEG và tải xuống chậm hơn.  

Chọn định dạng tùy thuộc vào mục tiêu của bạn. nếu chất lượng cao của hình ảnh là quan trọng, có thể tốt hơn là hy sinh tốc độ tải xuống và chọn PNG.  

3. Ảnh GIF

GIF truyền hình ảnh động, nén mà không làm giảm chất lượng, truyền văn bản tốt và cho phép bạn tạo các vùng trong suốt. Nhưng bảng màu bị hạn chế, tệp GIF lớn và hiển thị ảnh kém.  

Ngoài ra, không phải tất cả ứng dụng email đều hiển thị ảnh GIF tốt, vì vậy hãy cẩn thận nếu bạn quyết định nhúng ảnh GIF vào email. Luôn kiểm tra email của bạn trước khi gửi để tránh lỗi hiển thị.  

‍

Kích thước và kích thước hình ảnh tốt nhất cho email

Lý tưởng nhất là ảnh được tải lên hoặc nhúng vào email phải có kích thước phù hợp. Sau đó, nếu hình ảnh không được hiển thị, nó sẽ được thay thế bằng một hình chữ nhật trống màu trắng có cùng định dạng, điều đó có nghĩa là bố cục của văn bản và email nói chung sẽ không bị ảnh hưởng

Đôi khi, khi bạn mở email quảng cáo trên iPhone hoặc Mac, hình ảnh có thể hơi mờ. Không phải lúc nào chúng cũng có nghĩa là ảnh chất lượng thấp. Có lẽ, nhà thiết kế không nghĩ rằng bạn sẽ thấy nó trên thiết bị màn hình Retina

Bạn nên chọn kích thước hình ảnh cho bố cục HTML dựa trên những cân nhắc sau

Hình ảnh càng nhỏ càng tốt. Nhưng nếu điều chính trong email này là một tệp gif tuyệt vời, thì nó có thể là 10 hoặc thậm chí 15 Mb. Tuy nhiên, cố gắng không sử dụng hình ảnh lớn hơn 5 MB vì ​​kích thước ảnh hưởng đến tốc độ tải hình ảnh. Điều này rất quan trọng vì nhiều người sử dụng Internet di động, có thể không ổn định ở một số khu vực. Bạn có thể sử dụng dịch vụ TinyPNG để nén ảnh PNG và JPEG

Kích thước của biểu ngữ (có hoạt ảnh hoặc không) phải vừa với chiều rộng trong mẫu (đối với mẫu rộng 600px, nó phải là 600x300 hoặc 600x400px)

Để các nút dễ bấm, kích thước của chúng nên nằm trong khoảng 35-50px

Cần phải thụt lề xung quanh các nút hoặc hình ảnh có thể nhấp cho cả phiên bản dành cho máy tính để bàn và thiết bị di động

Đối với màn hình Retina, để bố cục không bị mờ, chúng tôi tăng gấp đôi kích thước của nó, làm cho chiều rộng nội dung không phải là 600px mà là 1200 và văn bản không phải là 16px mà là 32

Các ứng dụng email khác nhau xử lý hình ảnh như thế nào?

Chặn hình ảnh là một trong những vấn đề nổi bật nhất mà các nhà tiếp thị gặp phải khi chạy các chiến dịch email. Thông thường, nguyên nhân nằm ở cài đặt mặc định hoặc sở thích cá nhân của người nhận. Do đó, nhiều hình ảnh của người đăng ký sẽ tự động bị chặn và email không nhận được thông báo chính ngay lập tức hoặc thậm chí trông có vẻ bị hỏng

Quan điểm. com hơi lạ khi chặn hình ảnh. Theo mặc định, nó vô hiệu hóa hình ảnh không phải trong tất cả các email mà chỉ trong những email được gửi bởi người dùng "đáng ngờ"

Đồng thời, không rõ người gửi được chia thành đáng ngờ và đã xác minh theo nguyên tắc nào. Ngoài ra, người dùng Outlook có thể cấm hiển thị ảnh trong tất cả các email đến từ những người gửi không có trong danh sách liên hệ. Dịch vụ thư xử lý hai loại lọc này khác nhau

Trong các email từ các địa chỉ đáng ngờ, nó không hiển thị ảnh nhưng hiển thị văn bản thay thế;

Đối với người dùng có cài đặt chặn nội dung chặt chẽ hơn, Outlook. com sử dụng các trường màu xám. Họ chặn những hình ảnh không mong muốn và thay thế chúng bằng nền màu xám

Gmail đã không chặn hình ảnh nhúng trong email kể từ tháng 12 năm 2013. Có vẻ như các nhà tiếp thị và nhà thiết kế nên vui mừng - email sẽ xuất hiện như bình thường và theo dõi mở sẽ trở nên đáng tin cậy hơn. Tuy nhiên, sự thay đổi này cũng không hề suôn sẻ. Không có gì lạ khi hình ảnh bị hỏng hoặc biến dạng do sự cố bộ nhớ đệm

Cũng cần phải xem xét kích thước của toàn bộ trang (i. e. , mã HTML) không mạo hiểm với sự xuất hiện của nó. Hãy nhớ rằng Gmail cắt bớt các email dài hơn 102 KB và trong trường hợp này, người đăng ký sẽ chỉ thấy một phần của thư được thiết kế đẹp mắt của bạn

Mặc dù tất cả các trình gửi thư dựa trên web đều hỗ trợ văn bản thay thế, hoạt động của phiên bản cách điệu của nó phụ thuộc vào trình duyệt mà người đăng ký sử dụng. Văn bản thay thế cách điệu được hiển thị trong các phiên bản hiện tại của Chrome và Firefox nhưng không hiển thị trong Internet Explorer. Bạn có thể thấy màu của nó trong trình duyệt này nhưng không thấy các thuộc tính như phông chữ, kích thước, kiểu dáng và độ bão hòa

Một điều quan trọng hơn cần đề cập về ứng dụng email là một số bộ đệm (tạo bản sao) hình ảnh của bạn trên máy chủ của họ và đã hiển thị chúng. Đây là những gì Apple sẽ triển khai vào mùa thu năm 2021 như một phần của Bảo vệ quyền riêng tư qua thư của họ. Đối với một nhà tiếp thị email, điều này có thể dẫn đến hai điều

Khi bạn nhận thấy một lỗi đánh máy hoặc lỗi trên biểu ngữ của mình, hãy sửa nó và thay thế hình ảnh trên FTP của bạn càng sớm càng tốt, hãy sẵn sàng rằng một số người đăng ký của bạn sẽ thấy phiên bản cũ

Các dịch vụ tạo nội dung trực tiếp cho email như Movable Ink, LiveClicker hoặc Zembula, có thể không nhận dạng được địa lý, múi giờ và thời tiết của người đăng ký. Ngoài ra, bộ hẹn giờ có thể hoạt động không chính xác

Làm cách nào để bạn nhúng HTML vào email?

Hình ảnh là yếu tố cần thiết của một bức thư email marketing vì nó làm cho văn bản sinh động và hấp dẫn hơn. Có một số cách nhúng hình ảnh vào email – chúng ta hãy xem ba cách trong số đó

1. Nhúng hình ảnh CID

Content-ID (CID) là một cách để đính kèm ảnh vào email mà không cần bất kỳ mã HTML nào. Quá trình này như sau. một hình ảnh và một liên kết đến nó được đính kèm vào email dưới dạng mẫu. Khi bạn mở một email, hình ảnh sẽ tự động được nhúng vào đó. Nhưng hãy nhớ rằng tùy chọn này làm tăng kích thước của email kết quả

2. Nhúng nội tuyến

Một cách khác để chèn hình ảnh vào email là nhúng base64 vào HTML. Base64 là một nhóm các sơ đồ mã hóa nhị phân tương tự. Với phương pháp này, bạn cần mã hóa hình ảnh của mình trong base64 - và hình ảnh sẽ được lưu trữ bên trong HTML dưới dạng một tệp. Tuy nhiên, vấn đề là mọi hình ảnh đều tăng kích thước của email này, dẫn đến việc tải xuống bị chậm lại và bị cắt bởi Gmail

3. Liên kết đến hình ảnh

Liên kết đến một hình ảnh trong email của bạn hoạt động giống như cách hình ảnh xuất hiện trên bất kỳ trang web nào. Bạn phải thêm một dòng có URL vào mã HTML của mình để xác định nguồn của hình ảnh sẽ hiển thị

Ưu điểm của phương pháp này là rõ ràng - thứ nhất, việc có một hình ảnh không ảnh hưởng đến kích thước của email theo bất kỳ cách nào và việc chèn liên kết tới hình ảnh rất nhanh chóng và dễ dàng. Bên cạnh đó, bạn có thể thay đổi hình ảnh trên máy chủ, và nó sẽ thay đổi về chữ, và kích thước của hình ảnh (chiều rộng, chiều cao) mà các dịch vụ email sẽ không thay đổi

Tuy nhiên cũng có nhược điểm. Ví dụ: một số ứng dụng email, chẳng hạn như Outlook, có thể chặn hình ảnh do liên kết gây ra. Ngoài ra, nếu xem mà không có kết nối internet, hình ảnh sẽ không tải được

Cách kiểm tra hình ảnh trong email HTML

Một bước khá tầm thường mà nhiều người bỏ qua khi nhúng hình ảnh vào email - kiểm tra thư của bạn. Hình ảnh trong email có thể không được hiển thị trong ứng dụng email của người nhận hoặc có thể vượt quá kích thước của ô bảng HTML, khiến hình ảnh bị cắt hoặc toàn bộ email bị "tắt" trong một số trình duyệt

Do đó, trước khi gửi thư đến toàn bộ cơ sở dữ liệu, tốt hơn hết bạn nên gửi một số email kiểm tra và mở chúng trong các hệ thống thư khác nhau. Gửi email tùy chỉnh tới danh sách kiểm tra địa chỉ của các nhà cung cấp email khác nhau. Kiểm tra phiên bản web và di động trên các thiết bị và bưu phẩm khác. Sử dụng EmailOnAcid hoặc Litmus thực sự giúp quá trình kiểm tra nhanh hơn, nhưng đôi khi chúng tôi, EmailSoldiers, cũng thực hiện kiểm tra trên thiết bị thực

Phải làm gì với hình ảnh bị chặn trong email

Đôi khi một email HTML đến, nhưng hình ảnh trong đó hiển thị không chính xác hoặc hoàn toàn không hiển thị. Trong trường hợp này, sẽ chẳng ích gì khi sử dụng HTML, trả thêm băng thông và công việc thiết kế nếu người nhận của bạn không nhìn thấy những gì họ phải xem

Để giữ cho những hình ảnh trong email không đánh lừa bạn, điều cần thiết là phải nghiên cứu hành vi của những người đăng ký tích cực liên quan đến danh sách gửi thư của bạn. Bạn cần biết họ sử dụng ứng dụng email nào và loại hình ảnh nào họ chọn thường xuyên hơn

Tại sao hình ảnh bị chặn trong email

Đôi khi, người dùng không thể mở hình ảnh trong thư. Hầu hết các ứng dụng thư trên máy tính để bàn (Mozilla Thunderbird, Outlook 2007-2016) chặn tải xuống hình ảnh theo mặc định. Giao diện web của Yahoo, Outlook. com và Gmail cũng làm như vậy nếu họ cho rằng người gửi không đáng tin cậy hoặc nội dung của email có vấn đề. Cả hai đều yêu cầu bằng chứng tải lên để hiển thị hình ảnh

Cách sử dụng văn bản ALT có thể trợ giúp

ALT-text (Văn bản thay thế) là một cách tuyệt vời để xử lý việc chặn hình ảnh và nhúng hình ảnh vào email thành công. ALT-text là thông tin để người dùng mô tả nội dung của hình ảnh mà họ không thể nhìn thấy do hình ảnh bị chặn

Tùy thuộc vào mức độ chi tiết mà bạn muốn mô tả hình ảnh trong văn bản thay thế. Chỉ cần nhìn vào email đã hoàn thành;

Lời khuyên từ các nhà tiếp thị qua email về chủ đề này rất đơn giản và hợp lý

• Đừng viết thông tin quan trọng trong hình ảnh, nếu không có nó bạn sẽ không hiểu ý nghĩa của việc gửi thư
• Không gửi toàn bộ bức thư trong một bức ảnh hoặc một vài bức ảnh mà không có văn bản
• Không sử dụng hình nền lớn. một số người nhận sẽ không nhìn thấy nền như vậy, những người khác sẽ lặp lại chiều rộng và chiều cao của chữ cái
• Bạn có thể thêm link phiên bản web vào header hoặc footer của email phòng trường hợp email mở sai

Tóm lược

Tất nhiên, hình ảnh cải thiện giao diện và hiệu suất của bản tin nếu được sử dụng đúng cách. Tóm tắt vài điều về chèn ảnh vào email

Đầu tiên, bố cục của bạn phải thích ứng để trang được hiển thị trên màn hình của thiết bị di động (không có bất kỳ nén bổ sung nào). Định dạng của hình ảnh được sử dụng phải phù hợp với tác vụ (chủ yếu là PNG hoặc JPEG). Bản thân hình ảnh phải có cùng kích thước với mẫu (rộng tối đa 1200px)

Khi sử dụng hình ảnh làm nền, cần xem xét khả năng hiển thị của văn bản trên đó và cung cấp màu tô thay thế. Ngoài ra, hãy nhớ chỉ định văn bản thay thế (kích thước nhỏ) trong thẻ ALT. Cuối cùng, bạn nên tính đến các chi tiết cụ thể về thiết kế kiểu trong Gmail và Hotmail

Nếu bạn làm theo các đề xuất này, các bản tin của bạn sẽ hiệu quả và có lợi hơn. Chúng tôi hy vọng rằng bài viết của chúng tôi đã trả lời tất cả các câu hỏi mà bạn có thể có về việc nhúng hình ảnh vào email

Bạn có thể nhúng HTML vào email Outlook không?

Outlook có hỗ trợ hình ảnh nhúng không?