이메일 이미지 모범 사례 소개

예상 4분 읽기

업데이트 2026년 2월 12일 AM 12:00 EST

Klaviyo 이메일에서 이미지를 사용할 때의 모범 사례(권장 크기, 이미지 추가 방법 포함)를 알아보세요.

이메일에서 이미지를 사용할 때의 모범 사례

이메일에 사용할 이미지를 만들 때 다음 사항을 고려해 주세요:

Klaviyo는 JPEG, PNG, GIF 이미지 파일을 지원해요. WebP 파일도 업로드할 수 있으며, Klaviyo가 자동으로 PNG 파일로 변환하도록 선택할 수도 있어요. 일반적으로 PNG 파일이 기기 전반에서 가장 잘 표시되며, 특히 텍스트가 포함된 이미지에 적합해요.
Klaviyo에서 지원하는 이미지의 최대 파일 크기는 10MB예요. 하지만 더 큰 이미지는 로딩 속도가 느려 수신자 경험이 좋지 않을 수 있으므로, 1MB 이하의 이미지를 사용하는 것을 권장해요. Klaviyo의 기본 제공 이미지 압축 도구를 사용하면 품질을 크게 손상시키지 않으면서 업로드한 이미지의 파일 크기를 줄이는 데 도움이 돼요.
웹 전반에서 72dpi 해상도를 사용하는 것이 모범 사례예요. 이미지 품질과 로딩 속도의 균형을 맞추기 위해, 전체 너비 이미지의 경우 가로 폭은 600~1,000px, 세로 높이는 2,000px 미만으로 유지해 보세요. 이메일의 전체 너비보다 작은 이미지는 600px보다 작아도 괜찮아요.
72dpi에서 전체 너비 이미지(full-width image)는 1MB를 초과하는 경우가 많으며, 이미지 크기를 줄이면 눈에 띄게 흐리거나 품질이 낮아 보이는 이미지가 될 수 있어요. 메시지에 사용할 이미지를 선택할 때는 이미지 품질과 로드 시간 간의 균형을 고려해 보세요. 큰 이미지는 특히 인터넷 연결이 느린 경우 이메일을 열었을 때 바로 표시되지 않을 수 있어요.
항상 이미지에 대체 텍스트를 추가해 주세요. Outlook 및 Apple Mail을 포함한 일부 받은편지함에서는 수신자가 보기를 선택하기 전까지 이미지가 표시되지 않아요. 대체 텍스트를 포함하면 이러한 받은편지함을 사용하는 수신자가 이미지가 전달하려는 내용을 이해하는 데 도움이 되고, 접근성도 지원해요.

이미지 블록 삽입

템플릿에 이미지를 추가하려면:

이미지 블록을 미리보기 캔버스로 드래그한 다음 포함할 이미지를 선택해 주세요.

이미지 블록을 배치하면 다음 방법으로 이미지를 추가하라는 안내가 표시돼요:

블록에 이미지 한 개 이상을 끌어다 놓으면 즉시 업로드돼요.
컴퓨터에서 하나 이상의 이미지를 찾아 업로드하기
URL에서 가져오기
이미지 라이브러리에서 이미지 선택하기
전자상거래 플랫폼과 통합되어 있거나 맞춤 카탈로그를 동기화한 경우) 제품 카탈로그에서 이미지를 선택하기
이미지가 동적으로 채워지도록 하려면 placeholder URL 또는 변수 시퀀스를 삽입 하세요(플로우에만 해당).

이미지를 업로드하는 경우, 업로드할 수 있는 최대 이미지 크기는 10MB예요.

자동 이미지 파일 압축

Klaviyo는 이미지 선명도와 빠른 로드 시간을 균형 있게 맞출 수 있도록 이미지 업로드 과정의 일부로 자동 이미지 압축 도구를 제공해요. 이 기능은 GIF에서는 지원되지 않아요.

이미지를 업로드하면 Review 단계에서 비교할 수 있도록 원본 파일과 압축 버전이 표시돼요. 각 미리보기에는 파일 크기와 함께 두 버전 간의 차이를 백분율로 표시해요. 이미지 위의 토글에서 업로드할 버전을 선택할 수 있으며, Klaviyo는 권장하는 선택지에 Recommended 배지를 추가해요. 하지만 압축 버전에서 선명도가 떨어진 것이 보이면 이를 무시하고 다른 버전을 선택할 수 있어요. 이는 원본 파일이 더 작은 경우에 발생할 수 있어요.

원본 이미지가 권장되는 경우, 이미지 비교 패널은 기본적으로 닫혀 있습니다. 여러 이미지를 한 번에 업로드했다면, 각 이미지별로 원하는 옵션을 개별적으로 검토하고 선택해 주세요.

업로드 설정

이미지를 업로드할 때 검토 단계를 건너뛰고 싶다면 업로드 설정을 조정해 주세요. 이미지를 업로드하면 업로드 설정 버튼이 표시돼요.

여기에서 선택한 내용은 이후 업로드 시에도 저장돼요. 선택할 수 있어요:

비교 (기본값): 원본 버전과 압축 버전을 검토하고 선택해 주세요.
원본 사용: 항상 원본 파일을 업로드하세요, 검토 단계가 필요하지 않아요.
압축본 사용: 항상 Klaviyo의 자동 압축 버전을 업로드해 주세요. 검토 단계는 없어요.

이미지 자르기

이미지 블록, 분할 블록, 테이블 블록에 있는 이미지는 쉽게 잘릴 수 있어요.

이미지 블록을 클릭해 주세요.
왼쪽의 이미지 아이콘 아래에 있는 자르기를 클릭해 주세요.

이미지를 원형, 정사각형 또는 사용자 지정 너비와 높이의 직사각형으로 자르도록 선택할 수 있어요. 편집기에서 이미지를 자르더라도 전체 이미지는 그대로 유지되므로, 언제든지 자르기를 조정하거나 제거할 수 있어요.

자르기를 마쳤으면 뒤로 화살표를 클릭해 변경 사항을 적용해 주세요.

이미지 크기 조정

이미지 크기를 조정하려면 캔버스에서 크기 조정 슬라이더를 사용하세요.

업로드된 HTML 템플릿의 이미지

Klaviyo에 복사해 넣는 HTML 템플릿(메일침프 템플릿 제외)의 경우, 가져오기 과정에서 이미지가 포함된 zip 파일을 업로드하게 돼요.

MailChimp 템플릿의 경우, MailChimp에 이미 로드된 이미지가 포함된 템플릿을 업로드하면 Klaviyo가 이러한 이미지를 모두 자동으로 복사해요.

이미지를 업로드한 후에는 이미지 삽입 버튼을 사용해 해당 템플릿에 새 이미지를 업로드할 수 있어요:

이미지 품질

템플릿에서 이미지가 원하는 만큼 깔끔하거나 선명하게 렌더링되지 않는 것 같아 걱정된다면, 이미지 품질을 개선하기 위한 조치를 취할 수 있어요.

이메일에서 렌더링된 이미지의 선명도를 높이기 위한 일반적인 표준 중 하나는 원하는 크기의 2배인 이미지를 삽입한 다음 템플릿에서 이미지 크기를 줄이는 거예요. 이를 접근하는 방법은 두 가지가 있어요:

선명한 대형 버전의 이미지를 템플릿에 삽입한 다음 편집을 클릭하고 원하는 크기로 조정해 주세요.
기본적으로 더 큰 이미지를 삽입하고(예: 가로 600px) 더 작은 크기로 표시하세요(예: CSS로 너비를 300px로 설정하는 방식이에요. 이 방법을 사용하려면 전용 HTML 블록에 이미지를 삽입한 다음 CSS를 직접 조정해야 해요.