HTML 이메일 뉴스레터 템플릿에 필요한 것

짧은 안내라면 텍스트 이메일로 충분하지만, 뉴스레터나 할인 안내, 환영 이메일에는 보통 더 많은 것이 필요합니다. 로고, 이미지, 눈에 띄는 버튼. 그것이 HTML 이메일입니다. 작은 웹페이지처럼 보이지만 전혀 다른 규칙으로 만들어집니다. 이메일 프로그램은 브라우저보다 훨씬 까다롭기 때문입니다. 좋은 템플릿에 무엇이 들어가고 어떻게 준비하는지 알려 드립니다.

HTML 이메일 뉴스레터 템플릿

이메일은 웹페이지가 아닙니다

Gmail, Outlook, Apple Mail, 휴대폰 앱은 HTML을 저마다 조금씩 다르게 보여 주고, 상당수는 최신 웹 코드를 무시합니다. 그래서 이메일은 옛날 방식으로 만듭니다.

레이아웃은 테이블로, 최신 웹 레이아웃이 아니라.
스타일은 각 요소에 직접, 많은 프로그램이 스타일 영역을 지워 버리기 때문입니다.
시스템 글꼴, 웹 글꼴은 불러오지 못하는 경우가 많습니다.
스크립트, 폼, 동영상은 넣지 않습니다. 이메일 프로그램은 이를 실행하지 않습니다. 대신 동영상이나 폼으로 연결되는 이미지나 버튼을 쓰세요.

좋은 이메일의 구성

미리 보기 문구: 받은편지함에서 제목 옆에 보이는 짧은 텍스트. 두 번째 제목이나 마찬가지이니 “브라우저에서 보기”로 낭비하지 마세요.
헤더: 작은 로고, 내 사이트로 연결.
헤드라인과 메인 이미지: 이메일이 무엇에 관한 것인지 한눈에.
짧은 본문: 많아야 두세 문단.
메인 버튼 하나: “컬렉션 보기”, “자리 예약하기”. 링크로 만든 버튼은 어디서나 작동합니다.
푸터: 회사명, 주소, 연락처, 수신 거부 링크.

너비와 휴대폰

표준 너비는 약 600픽셀로, 컴퓨터 화면과 대부분의 프로그램 읽기 창에 맞습니다. 휴대폰에서는 레이아웃이 한 열로 바뀌고, 글자는 읽기 충분히 크고, 버튼은 누르기 충분히 커야 합니다. 이메일의 절반 이상이 휴대폰에서 열리니 휴대폰 버전부터 확인하세요.

이미지와 대체 텍스트

일부 프로그램은 읽는 사람이 허용하기 전까지 이미지를 차단합니다. 모든 이미지에 대체 텍스트를 써서 이미지 없이도 이메일 내용이 이해되게 하고, 중요한 텍스트를 이미지 안에만 넣지 마세요. 사용할 권리가 있는 이미지만 쓰세요. 이미지는 메일 발송 서비스나 내 사이트에 업로드하고, 이메일은 그 주소를 가리킵니다.

수신 거부 링크

메일 발송 서비스와 많은 나라의 규정은 모든 마케팅 이메일에 쉬운 수신 거부 방법을 요구합니다. 템플릿에는 보통 자리 표시자가 들어 있어, 이를 내 서비스의 수신 거부 링크나 태그로 바꾸면 됩니다.

내용 준비하는 법

이메일이 무엇에 관한 것인지, 누가 받는지.
사실 정보: 가격, 날짜, 프로모션 코드를 정확히 그대로.
각 버튼이 연결될 곳: 페이지 전체 주소.
푸터 정보: 보여야 하는 그대로.
색상과 스타일, 또는 힌트가 될 마음에 드는 이메일.

발송 전에 테스트하세요

Gmail, Outlook, 휴대폰에서 나에게 이메일을 보내 보세요. 모든 링크와 버튼을 눌러 보고, 미리 보기 문구를 확인하고, 이미지를 끈 상태로도 이메일을 살펴보세요.

정리

좋은 HTML 이메일은 테이블과 인라인 스타일을 쓰고, 너비가 약 600픽셀이며, 휴대폰에서는 한 열로 바뀌고, 분명한 버튼 하나와 제대로 된 푸터를 갖추고 있습니다. 직접 만들고 싶지 않다면 HTML 이메일을 주문하세요. 이메일 내용, 제안, 버튼이 연결될 곳을 설명하면 완성된 HTML과 이 이메일을 위해 그린 이미지가 담긴 압축 파일을 받아 Mailchimp, Brevo 등 메일 발송 서비스로 가져올 수 있습니다. 대금은 작업을 승인한 후에만 지급됩니다.