내보낸 이메일 이미지 호스팅하기

내보낸 이미지 파일을 직접 호스팅하거나, Emailify가 자체 CDN에 자동으로 업로드하게 할 수 있어요.

Emailify 이미지 호스팅 CDN 사용하기(기본값) ​

HTML 내보내기의 경우, 기본적으로 Emailify는 이미지를 .html 파일 옆에 함께 저장해 HTML 이메일을 내보내요. 그래서 원하는 곳에 이미지를 업로드할 수 있어요.

하지만 Emailify CDN(콘텐츠 전송 네트워크)으로 이미지를 호스팅하고 싶다면 Upload Hosted Image URLs 토글을 켜세요. 그러면 이미지가 업로드되고, HTML 이메일의 URL이 업로드된 파일을 가리키도록 자동으로 바뀌어요.

내장된 이메일 마케팅 플랫폼 연동을 사용한다면 이미지가 Emailify CDN에 자동으로 업로드돼요.

호스팅된 이미지가 원본 파일보다 클 수 있는 이유 ​

Emailify는 내보내는 이메일에 사용할 이미지 바이트를 렌더링하고, 생성된 PNG나 JPG를 최적화한 다음 같은 파일을 내보내기에 넣고, 업로드가 켜져 있으면 업로드해요. 호스팅으로 바뀌는 것은 URL뿐이고, 별도의 압축 과정이 추가로 적용되지는 않아요.

Figma는 원래 업로드된 파일이 아니라 렌더링된 내보내기 바이트를 제공하기 때문에, 호스팅된 파일은 원본 JPG나 PNG와 바이트 단위로 같은 사본이 아니에요. 크기가 달라질 수 있고, 더 커질 수도 있어요. 결과물 크기를 줄이려면 내보내기 전에 적절한 크기의 원본 레이어와 알맞은 이미지 형식을 사용하세요. 이 워크플로에서는 Emailify가 원본 파일의 압축 바이트를 그대로 보존할 수 없어요.

직접 운영하는 클라우드 스토리지 버킷에 이미지 에셋 업로드하기 ​

기본적으로 Emailify는 Emailify CDN(콘텐츠 전송 네트워크)으로 이미지를 호스팅하지만, 원한다면 대신 직접 운영하는 클라우드 스토리지 서비스 버킷(예: AWS S3나 Backblaze B2)을 사용하도록 바꿀 수 있어요.

사용할 이미지 호스팅 서비스를 선택한 다음 아래에 버킷 자격 증명과 세부 정보를 입력하세요. 그러면 내보내기 과정에서 이미지 에셋이 버킷에 자동으로 업로드되고, HTML <img> 태그의 src 속성에 버킷 이미지 경로가 사용돼요.

  • Region(예: us-east-1)
  • Access Key(예: 003g8...)
  • Secret Access Key(예: K454q...)
  • Bucket Name(예: my-emailify-bucket)
  • Bucket URL(예: https://my-emailify-bucket.s3.us-east-1.amazonaws.com/)

만드는 버킷은 모두 Public 접근 보기 권한으로 설정해야 해요. 그렇지 않으면 HTML 이메일을 발송했을 때 업로드된 이미지 URL에 접근할 수 없어요.

Cloudflare R2 주소 ​

R2는 서로 다른 주소 두 개를 사용해요. 이미지 호스팅 설정에 둘 다 입력하세요.

  • S3 API endpoint: Cloudflare 계정에서 https://accountid.r2.cloudflarestorage.com 같은 엔드포인트를 복사하세요. Cloudflare에 .eu 같은 관할 구역 부분이 표시된다면 그대로 두세요. 버킷 이름은 R2 Bucket Name에 입력하세요.
  • Public image URL: https://images.example.com/처럼 버킷에 연결된 사용자 지정 도메인이나, 활성화된 공개 r2.dev URL을 사용하세요. S3 API 엔드포인트는 인증이 필요하기 때문에 이메일의 공개 이미지 URL로 쓸 수 없어요.

이전에 URL 필드에 S3 API 엔드포인트를 저장했다면 Emailify가 이를 S3 API endpoint로 옮겨요. 다시 내보내기 전에 공개 이미지 URL을 추가하세요. 이미 공개 도메인을 저장했다면 그대로 유지되니, 별도의 API 엔드포인트가 없으면 추가하세요. 액세스 키와 버킷 이름은 그대로 유지돼요.

Cloudflare의 S3 API 엔드포인트 가이드(영어)와 공개 버킷 접근 가이드(영어)를 참고하세요.

Mailchimp 이미지 호스팅 오류 ​

Mailchimp로 바로 내보낼 때 Emailify는 이미지 폴더, 기존 파일, 업로드된 이미지 URL을 확인해요. Mailchimp가 이미지 요청을 거부하면 내보내기에서 오류를 보고하고, 확인되지 않은 이미지 URL로는 템플릿을 만들지 않아요. Mailchimp 연결과 API 키를 확인한 다음 다시 내보내세요.

Emailify에서 지원하는 직접 호스팅 클라우드 스토리지 서비스 ​

Emailify에서 내보낸 이미지는 아래의 S3 호환 오브젝트 스토리지 서비스 중 어디에서든 직접 호스팅할 수 있어요.

내 서버나 CDN에서 내보낸 이메일 이미지를 호스팅하도록 사용자 지정 기본 URL 설정하기 ​

기본적으로 Emailify가 내보낸 HTML의 모든 이미지 src는 상대 경로인 img/ 경로예요(예: img/ceb3f891b78815897e04299f93eef255.jpg). 그래서 이메일을 검토하고, 이미지를 자동으로 업로드하고 src URL을 업데이트해 주는 MailChimp 같은 플랫폼에 zip 파일을 업로드할 수 있어요.

하지만 이 기능을 지원하지 않는 플랫폼을 사용하거나 직접 운영하는 서버에 이미지를 호스팅한다면, 사용자 지정 기본 URL을 설정하는 것이 좋아요.

이메일별 사용자 지정 기본 URL ​

기본 이메일 Figma 프레임을 선택하고 플러그인 헤더의 Settings 버튼을 클릭한 다음 Override "img/" Base Path 토글을 켜고, 이미지를 호스팅할 기본 URL 경로를 붙여 넣으면 이메일마다 사용자 지정 기본 URL을 설정할 수 있어요. 사용자 지정 기본 URL을 켜면 모든 이미지의 src 속성 앞에 이 경로가 자동으로 붙어요(예: 내보낸 HTML 파일에서 img/가 https://your-custom-server.com/image/path/here/로 바뀌어요).

이메일별 설정은 특정 캠페인에 서로 다른 기본 URL이 필요하거나, 개별 이메일에서 전역 CDN 설정을 재정의하고 싶을 때 적합해요.

전역 사용자 지정 CDN 기본 URL ​

모든 이메일에서 항상 같은 사용자 지정 CDN이나 서버에 이미지를 호스팅한다면, 이메일마다 따로 설정하는 대신 전역 사용자 지정 기본 URL을 설정할 수 있어요.

  1. 내보내기 설정 패널에서 CDN 드롭다운 메뉴를 찾으세요.
  2. CDN 옵션 목록에서 Custom Base Image Path URL을 선택하세요.
  3. 나타나는 입력 필드에 사용자 지정 기본 URL을 입력하세요(예: https://cdn.example.com/images/).
  4. 이제 내보내는 모든 이메일의 이미지 경로에 기본적으로 이 기본 URL이 사용돼요.

전역 사용자 지정 CDN 설정을 사용하면 이메일 캠페인 전체의 이미지 호스팅을 간편하게 통일할 수 있어요. 전역 사용자 지정 기본 URL과 이메일별 사용자 지정 기본 URL이 모두 설정되어 있으면 이메일별 설정이 우선 적용돼요. 그래서 특정 캠페인에 필요할 때 전역 CDN을 유연하게 재정의할 수 있어요.

전역 설정이든 이메일별 설정이든, 사용자 지정 기본 URL에 누구나 접근할 수 있는지, 필요하다면 CORS 설정이 올바르게 구성되어 있는지 확인하세요. URL 끝에 슬래시가 있든 없든 Emailify가 두 형식 모두 올바르게 처리해요.

내보낸 HTML 이메일에서 이미지가 렌더링되지 않는 이유는 뭔가요? ​

발송 후 이메일 이미지가 렌더링되지 않는 경우는 보통 이미지 파일이 공개 온라인 URL에 호스팅되지 않았거나, HTML을 다시 작성하는 도구로 이메일을 보냈거나, 수신자의 이메일 클라이언트가 원격 이미지를 차단했기 때문이에요.

로컬 img/ 경로로 HTML을 내보내면 이미지가 .html 파일 옆에 저장되므로, 이메일 템플릿과 함께 업로드하거나 따로 호스팅해야 해요. Upload Hosted Image URLs를 켜면 Emailify가 이미지를 업로드하고 HTML의 이미지 URL을 호스팅된 링크로 자동으로 바꿔 줘요.

로컬에서는 이미지가 보이는데 발송 후에는 보이지 않는 이유는 뭔가요? ​

로컬 HTML 미리보기는 컴퓨터에 있는 내보낸 img/ 폴더에서 이미지를 불러올 수 있어요. 하지만 이메일이 발송되면 수신자는 내 컴퓨터의 파일에 접근할 수 없으니, 이미지를 온라인에 호스팅하거나 ESP를 통해 업로드해야 해요.

Gmail과 Outlook은 마크업을 바꿀 수 있고, 대량 HTML 이메일 워크플로에 맞는 이미지 호스팅을 처리하지 않기 때문에 내보낸 사용자 지정 HTML을 보내는 데 적합하지 않아요. 대신 ESP나 Emailify의 내장 연동 기능을 사용하세요.

내보낸 이미지가 깨지면 무엇부터 확인해야 하나요? ​

  • 이미지가 공개 https:// URL에 호스팅되어 있는지 확인하거나, 내보낸 img/ 폴더를 ESP를 통해 업로드하세요.
  • Emailify가 이미지 에셋을 대신 업로드하게 하려면 Upload Hosted Image URLs를 켜세요.
  • 사용자 지정 버킷이나 CDN을 사용한다면 업로드된 이미지 URL에 대한 공개 읽기 접근이 버킷에서 허용되는지 확인하세요.
  • 업로드에 실패하면 VPN, 방화벽, 프록시, 회사 네트워크가 업로드 요청을 차단하고 있지 않은지 확인하세요.
  • 내보내기 전에 파일에서 Figma 이미지가 모두 로드될 때까지 기다리세요.
  • 일부 이메일 클라이언트는 수신자가 표시를 선택하기 전까지 원격 이미지를 차단한다는 점을 기억하세요.

사용자 지정 호스팅 연결 오류 ​

Amazon S3의 경우 Emailify는 선택한 Region과 Bucket Name으로 업로드 엔드포인트를 구성해요. Bucket URL은 내보낸 이메일의 이미지에 사용되는 공개 기본 URL이며, 이 값을 바꿔도 업로드 엔드포인트는 바뀌지 않아요.

계정 ID와 리전 접미사를 포함한 전체 버킷 이름을 입력하세요. 예를 들어 my-email-images-123456789012-ap-southeast-2-an이라는 계정 리전 버킷은 리전 ap-southeast-2와 버킷 URL https://my-email-images-123456789012-ap-southeast-2-an.s3.ap-southeast-2.amazonaws.com/을 사용해요. AWS는 전역 버킷 이름과 계정 리전 버킷 이름을 모두 지원해요(영어).

이미지를 업로드하려면 액세스 키에 연결된 IAM 자격 증명에 arn:aws:s3:::YOUR-BUCKET-NAME/*에 대한 s3:PutObject 권한이 있어야 해요. Emailify에는 공개 쓰기 권한이나 버킷 생성·삭제 권한이 필요하지 않아요. 하지만 AWS 정책이나 암호화 설정에 다른 제한이 있으면 업로드가 막힐 수 있어요. AWS 권한 가이드(영어)를 참고하세요.

내보낸 이미지 URL은 로그인하지 않아도 읽을 수 있어야 해요. 공개 이미지 버킷이나 버킷을 기반으로 하는 공개 CDN을 사용하고, 업로드된 이미지 URL 하나를 브라우저의 비공개 창에서 열어 확인하세요. 관련 없는 비공개 파일은 별도 스토리지에 보관하고, 이메일 이미지를 위해 공개로 바꾸지 마세요.

내보내기에서 Image hosting failed가 표시되면 연결이나 권한을 고친 다음 다시 내보내 보세요. 이메일 템플릿 업로드에 성공했다고 해서 이미지까지 성공적으로 업로드된 것은 아니에요. 오류가 계속되면 액세스 키나 시크릿 키를 빼고 오류 메시지나 스크린샷을 지원팀에 보내 주세요.