이메일 이미지 차단: 무엇을, 왜, 어디서, 누가, 어떻게 응답

게시 됨: 2021-08-17

이메일 마케팅에 종사하고 있다면 전체 이미지 이메일을 보내면 안 된다는 말을 들어본 적이 있을 것입니다. 이에 대한 많은 이유가 주어졌습니다. 귀하의 이메일은 스팸메일로 이동합니다. 시청자가 볼 수 없습니다. 접근성이 안좋습니다. 모두 좋은 이유였습니다. 그러나 이메일이 발전하면서 풍경이 바뀌었습니다. 변화하는 환경이 이메일의 이미지에 어떤 영향을 미쳤는지 살펴보고 2021년 이후에 몇 가지 모범 사례를 업데이트해 보겠습니다.

다음을 안내해 드리겠습니다.

  • 이메일 이미지 차단이란
  • 이미지가 표시되지 않는 이유
  • 기본적으로 꺼져 있는 위치
  • 누가 이메일 이미지를 차단할까요?
  • 이미지 끄기 최적화 방법

그게 뭐야?

이메일 이미지 차단은 이미지가 이메일에서 차단되거나 이메일 클라이언트 또는 회사 서버에서 표시되지 않는 관행입니다. 그 결과 이미지 ALT 텍스트가 거의 없는 다음과 같이 이메일에 이미지가 표시되지 않습니다.

이미지가 차단된 Blueland 이메일
2개의 이미지로 구성된 이메일: 설명이 불가능한 제한된 ALT 텍스트 제공

또는 더 나은 이미지 ALT 텍스트가 있는 이 것(그래도 여전히 좋아 보이지 않습니까?):

이메일 이미지 차단 기능이 있는 DSW 이메일
여러 이미지로 생성된 이메일: 제공된 ALT 텍스트는 위치를 좀 더 설명합니다.

왜 그런 일이 발생합니까?

이메일 클라이언트가 이미지를 차단하거나 기본적으로 해제하는 데에는 몇 가지 이유가 있습니다. 가장 큰 이유는 보안입니다. Microsoft는 독자가 잠재적으로 공격적인 콘텐츠를 보지 않고 악성 코드로부터 보호할 수 있도록 이미지를 차단한다고 주장합니다. 또한 기본적으로 이미지를 차단하면 대역폭이 낮은 사람들이 이미지 다운로드에 해당 대역폭을 사용할지 여부를 선택할 수 있다는 점을 제공합니다.

기본적으로 켜져 이미지가 이메일 클라이언트의 경우, 그들 중 많은 사람들이 대신 이미지가 외부 호스트에서 직접 가지고있는 이미지를 호스팅하는 이미지 프록시 서버를 사용합니다. 이를 통해 이메일 클라이언트는 이미지가 받은 편지함에 도달하기 전에 바이러스 및 맬웨어를 확인할 수 있으므로 보안 기능으로 이미지 차단의 필요성이 줄어듭니다.

대역폭 인수는 여전히 이미지 차단을 켜야 하는 좋은 이유이지만 테스트한 모든 모바일 이메일 클라이언트는 기본적으로 이미지를 허용합니다. 가입자는 모바일 장치에서 이미지를 끄는 방법을 알아내기 위해 정말로 파고들어야 합니다. 따라서 이메일 마케팅 담당자는 사용 중인 이미지가 최적화되었는지 확인하는 것이 훨씬 더 중요합니다.

이메일 이미지는 어디에서 차단되나요?

과거에는 많은 이메일 클라이언트가 기본적으로 이미지를 차단했습니다. 요즘 가장 큰 원인은 Outlook 데스크톱 클라이언트입니다. AOL을 제외한 대부분의 다른 이메일 클라이언트는 기본적으로 이미지를 표시합니다.

웹메일 클라이언트

이메일 클라이언트 기본 이미지 상태 ALT 텍스트를 렌더링합니다. 스타일이 지정된 ALT 텍스트를 렌더링합니다.
지메일 ✓에 네 ✓ 네 ✓
AOL 메일 꺼짐 ✘ 네 ✓ 예* ✓
야후! 우편 ✓에 아니 ✘ 아니 ✘
아웃룩닷컴 ✓에 네 ✓ 네 ✓
오피스 365 ✓에 네 ✓ 네 ✓

*ALT 텍스트에는 여전히 밑줄이 있습니다.

데스크탑 클라이언트

이메일 클라이언트 기본 이미지 상태 ALT 텍스트를 렌더링합니다. 스타일이 지정된 ALT 텍스트를 렌더링합니다.
전망 2007-2019 꺼짐* ✘ 예** ✓ 아니 ✘
아웃룩(맥) 꺼짐* ✘ 네 ✓ 네 ✓
애플 메일 ✓에 네 ✓ 네 ✓
오피스 365 꺼짐 ✘ 예** ✓ 아니 ✘
오피스 365(맥) 꺼짐 ✘ 네 ✓ 네 ✓
윈도우 10 메일 ✓에 아니 ✘ 아니 ✘

*이 기능은 Outlook 2016부터 해제되었지만 여전히 유효한지 테스트할 수 없습니다.
**이것은 경고 메시지가 표시된 후 이미지가 꺼져 있는 경우에만 렌더링됩니다. 이미지가 깨지면 ALT 텍스트가 렌더링되지 않습니다.

모바일 클라이언트

이메일 클라이언트 기본 이미지 상태 ALT 텍스트를 렌더링합니다. 스타일이 지정된 ALT 텍스트를 렌더링합니다.
지메일 ✓에 네 ✓ 네 ✓
AOL 메일 ✓에 네 ✓ 네 ✓
야후! 우편 ✓에 네 ✓ 네 ✓
아이폰(iOS 메일) ✓에 네 ✓ 네 ✓
삼성 메일 켜짐* ✓ 네 ✓ 네 ✓
시야 ✓에 네 ✓ 네 ✓

*이것은 우리가 마지막으로 확인할 때 였지만 여전히 이것이 사실인지 테스트 할 수 없었습니다.

이미지 전용 이메일이 당신의 이메일에 사형 선고를 내리나요? 이메일 클라이언트 시장 점유율에 따르면 Outlook은 4번째로 인기 있는 이메일 클라이언트이지만 이메일 열기의 6%만 차지합니다. 그러나 Outlook은 기본적으로 이미지(따라서 열린 추적 픽셀)를 차단하므로 이것이 얼마나 정확한지는 모릅니다.

그래서 괜찮을 가능성이 있습니다. 그러나 모든 이메일과 마찬가지로 청중이 누구인지에 따라 다릅니다. 평균보다 많은 Outlook 구독자가 있는 경우(B2B인 경우 귀하일 가능성이 높음) 문제가 발생할 수 있습니다.

녹색 체크 표시가 있는 이메일이 있는 받은 편지함의 그림

더 이상 깨진 이메일이 없습니다.

100개 이상의 이메일 클라이언트, 앱 및 장치에서 이메일을 미리 보고 이미지가 켜져 있거나 켜져 있지 않은 상태에서 브랜드와 오류 없는 구독자 경험을 보장합니다.

방법 알아보기 →

누가 이메일에서 이미지를 로드하지 못하도록 차단합니까?

개방률은 이미지 픽셀 로드를 통해 측정되므로 이미지 차단으로 인해 얼마나 많은 청중이 영향을 받는지 알 수 있는 실제 방법은 없습니다. 이미지 로드가 없다는 것은 열려 있는 항목이 추적되지 않는다는 의미입니다.

2013년 Gmail이 기본적으로 이미지를 켜기 시작한 이후의 이전 연구에 따르면 Gmail 사용자의 43%가 이미지가 꺼진 상태로 이메일을 보았습니다. Outlook 사용자가 하는 일을 나타내는 것입니까? 그럴 수도 있지만 우리는 알 방법이 없습니다.

얼마나 많은 청중이 이미지가 꺼진 상태로 이메일을 여는지 정확히 알 수 없으므로 모든 사람에게 최상의 경험을 제공하기 위해 이미지 차단을 염두에 두고 이메일을 만드는 것이 가장 좋습니다.

이미지 꺼짐에 대해 이메일을 어떻게 최적화할 수 있습니까?

이미지가 차단된 클라이언트에서도 훌륭한 경험을 제공하기 위해 이메일을 코딩할 수 있는 몇 가지 방법이 있습니다. 여기에서 자세히 살펴보겠습니다.

가능한 한 라이브 HTML을 사용하십시오.

최대한의 접근성을 보장하기 위해 이메일을 코딩하는 가장 좋은 방법은 라이브 HTML로 이메일을 코딩하는 것입니다. 이는 이미지에 텍스트(특히 핵심 정보)를 넣지 않는다는 의미입니다. 버튼과 텍스트를 그래픽으로 만드는 대신 HTML을 사용하여 코딩하도록 합니다. 특히 이미지에는 이미지를 사용하십시오.

라이브 텍스트

단락 및 헤더 태그에 텍스트를 유지하십시오. 브랜드 스타일도 중요하지만 구독자의 경험을 생각하는 것보다 더 중요한 것은 아닙니다.

Magic Spoon은 이미지에 적절한 ALT 텍스트를 포함하는 작업을 훌륭하게 수행하지만 Ace Hardware가 한 것과 같이 훨씬 더 영향력 있는 이미지 없는 버전을 위해 <p> 태그에 라이브 텍스트로 이미지를 포함하는 것이 매우 간단합니다.

이미지가 꺼진 Magic Spoon 이메일 이미지가 꺼져 있는 Ace 하드웨어 이메일
이미지가 꺼진 Magic Spoon 이메일이미지가 꺼져 있는 Ace 하드웨어 이메일

방탄 버튼

클릭 유도문안(CTA)에서 라이브 텍스트를 사용하는 것은 필수적입니다. 이메일의 주요 동인은 구독자가 사용하는 경험에 관계없이 CTA가 표시되도록 하려고 합니다. 방탄 버튼을 사용하여 이 작업을 수행하고 CTA가 항상 표시되도록 하세요.

차단된 이미지가 포함된 jewel-osco 이메일
이미지가 꺼진 이메일: 버튼이 여전히 표시되도록 라이브 HTML로 완료되었습니다(출처: 내 받은 편지함).

배경 이미지

이미지에 텍스트를 가두지 마십시오. 하지만 그렇다고 해서 아름다운 디자인을 가질 수 없는 것은 아닙니다. 두 세계를 최대한 활용하려면 상단에 라이브 텍스트가 있는 배경 이미지를 사용하세요. 이렇게 하면 이미지가 꺼져 있는 경우에도 메시지가 전달됩니다.

그리고 배경 이미지에 배경색을 포함하여 이메일이 여전히 흥미롭고 브랜드에 맞는지 확인하십시오(원하는 모양이 아닌 한 거대한 공백을 원하지 않음). 배경색 대체에 표시되고 손실되지 않도록 ALT 텍스트의 스타일을 지정하십시오. 이 예와 같이:

에 이미지 이미지 꺼짐
Oregon College Savings Plan 이메일이미지가 표시되지 않는 Oregon College Savings Plan 이메일

라이브 코딩 이메일은 "이미지 삽입"보다 까다로울 수 있지만 이메일이 코딩되면 텍스트를 변경하는 것이 이미지를 변경하고 다시 업로드하는 것보다 훨씬 쉽고 빠릅니다. 요즘 나오는 모든 도구(예: Litmus의 Visual Editor)로 이미지만 사용하지 않고 이메일을 만드는 것이 그 어느 때보다 쉬워졌습니다.

ALT 텍스트 또는 스타일화된 ALT 텍스트 사용

ALT 텍스트는 이미지가 표시되지 않을 때 표시되거나 구독자가 스크린 리더를 사용할 때 소리내어 읽어주는 텍스트입니다. 앞서 지원 표에서 보듯이 ALT 텍스트는 거의 모든 곳에서 지원됩니다. 그리고 어떤 곳에서는 ALT 텍스트의 스타일을 지정하여 이미지의 실제 텍스트와 비슷하게 보이도록 할 수도 있습니다.

ALT 텍스트를 사용하면 이미지 차단이 켜져 있는 사람(및 스크린 리더를 사용하는 사람)이 이미지에 있는 내용을 알 수 있습니다. 이미지의 ALT 텍스트에 무엇을 쓸지 고민하는 경우가 많다는 것을 알고 있으므로 여기 네 가지 유용한 팁이 있습니다.

ALT 텍스트는 건조할 필요가 없습니다.

ALT 텍스트 설명에 감정을 추가하여 이미지에 활기를 불어넣습니다. 예를 들어 다음 이미지를 보십시오.

테일러 데이비스, 예상치 못한 순간에 큰 소리로 웃다 잡혔다.

"Taylor Davis' Headshot"대신 "Taylor Davis, 예기치 않은 순간에 큰 소리로 웃었습니다."를 사용하십시오.

이미지의 맥락을 염두에 두십시오.

예, 설명적이어야 하지만 컨텍스트가 핵심입니다. 예를 들어 이 이미지를 살펴보겠습니다.

매력적인 제목을 보여주는 팝업 경고

"휴대전화를 보고 이메일 알림을 보여주는 화면을 클로즈업한 사람"은 괜찮은 ALT 텍스트입니다. 그러나 기사가 제목 줄 팁에 관한 것이라면 "강력한 제목 줄을 보여주는 팝업 경고"가 더 관련성 있고 유용한 ALT 텍스트입니다.

장식 이미지의 경우 ALT 텍스트를 비워 둡니다.

이미지 기반 글머리 기호 또는 가로 규칙에는 ALT 텍스트가 필요하지 않습니다. 이미지가 기능적이지 않고 순전히 장식적인 경우 ALT 텍스트를 추가하면 독자가 메시지에서 주의를 분산시킬 뿐입니다.

사람들에게 이미지를 다운로드하라고 말하지 마십시오.

다운로드한 이미지가 열린 데이터를 가져오는 것을 의미했기 때문에 나는 이와 같은 것이 천재적이라고 생각하곤 했습니다.

ALT 텍스트가 제공되지만 설명이 아닙니다.
ALT 텍스트가 제공되지만 설명이 아닙니다.

이것은 사람들이 이미지를 다운로드하도록 하는 재미있고 영리한 방법처럼 보이지만 스크린 리더를 사용하는 사람은 누구나 소외감을 느낄 수 있습니다. ALT 텍스트는 모든 구독자의 경험을 개선하는 데 사용해야 합니다.

ALT 텍스트를 코딩하는 방법

이미지에 ALT 텍스트를 추가하는 것은 이미지 태그에 ALT 속성을 추가하는 것만큼 쉽습니다: