※ 9 CLOUDS에 기고된 「Can They Read It? 7 Email Design Tips For Readability」을 번역한 글입니다.
고객들에게 이메일을 보낼 때, 당신은 다양한 디자인을 선택할 수 있습니다. 색상, 글꼴, 이미지, 버튼 등은 당신이 선택할 수 있는 옵션들 중 일부에 불과합니다. 어떤 요소가 이메일을 창의적으로 보이도록 만드는 것일까요?
이번 글에서는 이메일을 최대한 가독성 있고 기능적으로(그리고 예쁘게) 보이도록 만드는 7가지 이메일 디자인 사례를 살펴보도록 하겠습니다.
1. 이메일을 이미지만 있고 텍스트는 없는 디자인으로 만들지 마세요.
구독자들이 가장 싫어하는 이메일 디자인 1위는 하나의 큰 이미지, 혹은 여러 개의 작은 이미지들로만 구성된 디자인입니다. 이미지를 사용하는 것이 더 쉽거나 디자인 요소를 많이 가미할 수 있는 것은 맞습니다. 하지만 모든 콘텐츠를 이미지 형식으로 사용한다면 메시지가 로드되지 않거나 수신자가 이메일 리더를 사용하는 경우(시각 장애가 있는 경우에도) 메시지를 읽을 수 없게 됩니다.
반면 이메일에 메시지가 텍스트로 포함되어 있으면 다양한 능력을 가진 더 많은 사람들이 메시지를 읽을 가능성이 높습니다. (그리고 로딩 속도도 빨라집니다!)
가장 좋은 방법은 텍스트와 이미지 및 시각적 요소들의 균형을 맞추는 것입니다. 이에 대해서는 나중에 자세히 설명하겠습니다.
2. 이메일을 간결하게 유지하세요.
많은 색상, 많은 이미지, 제안 또는 제품으로 채워야 한다고 생각할 수 있습니다. 사람들의 시선을 사로잡고 싶을 테니까요. 하지만 그럴 필요가 없습니다. 이메일 디자인은 단순하게 유지하는 것이 가장 좋습니다.
- - 강조할 용도로 사용할 브랜드 색상을 한두 가지 선택하세요. 이를 헤더 이미지와 링크, CTA 버튼에 사용해 보세요.
- - 간단한 형식으로는 전체 너비 헤더 이미지 1개/메일 제목(H1이라고도 함)/일부 문구/헤더 이미지에 가깝거나 메인 콘텐츠 아래에 있는 버튼이 포함됩니다.
- - 제안이나 제품은 하나씩만 포함하세요.
여기서 더 단순해지는 것도 좋습니다. 단순해질수록 모든 디바이스에서 동일하게 표시될 가능성이 높아지므로, 임의의 브라우저나 아웃룩 등에서 문제가 발생하지 않을 것입니다.
3. 이메일은 모바일 친화적으로 만드세요.
휴대폰으로 이메일을 얼마나 자주 확인하시나요? 연구에 따르면 85%의 사용자가 스마트폰을 사용하여 이메일을 확인한다고 합니다. 독자들이 노트북에서와 마찬가지로 휴대폰에서도 이메일을 선명하게 읽고 상호 작용할 수 있도록 하세요!
손가락으로 쉽게 탭할 수 있도록 CTA를 크게 만들고, 내용 작성 시 단일 열 형식을 사용해야 합니다. 모바일 디바이스에서는 대부분의 이메일 서식이 이 방식이며, 로딩 속도도 더 빠릅니다.
대부분의 이메일 도구에는 모바일에서 이메일을 미리 볼 수 있는 기능이 있거나, 자신에게 미리 보기 기능을 이용하여 휴대폰에서 확인할 수 있습니다. 이메일을 대중에게 보내기 전에 이 작업을 수행하는 것을 잊지 마세요.
4. 모든 사람이 이메일에 액세스할 수 있도록 설정합니다.
중요한 접근성 관련 팁이 더 있습니다! 신체적 또는 정신적 제약에 관계없이 모든 사람이 메시지를 이해하고 이메일과 상호 작용할 수 있도록 하려면 여러 가지 사항을 염두에 두어야 합니다. 여기서는 디자인과 관련하여 강조하는 몇 가지 사항을 소개합니다.
- 1. 글꼴 크기를 충분히 크게 유지하세요. 14pt 미만의 글꼴은 특히 시력이 약한 독자에게는 너무 작습니다. 메인 카피에는 14~16pt를 사용하는 것이 좋습니다.
- 2. 색맹이 있거나 밝은 햇빛 아래에서도 화면의 내용을 쉽게 볼 수 있도록 색상 대비를 잘 활용하세요.
- 3. CTA를 명확하고 눈에 잘 띄게 만드세요. 사람들이 링크의 위치를 정확히 알 수 있도록 버튼이나 CTA 주위에 충분한 공간을 확보하고 텍스트를 설명적으로 작성하세요.
5. 비주얼과 텍스트의 균형을 맞추세요.
이미지, 동영상 및 GIF는 이메일에 독자의 참여를 유도하는 좋은 방법이지만 텍스트와의 균형을 유지해야 한다는 점을 잊지 마세요. 텍스트만 있는 이메일은 클릭 수가 많지 않다는 단점이 있고, 이미지만 있는 이메일은 이미지를 끄거나 소프트웨어가 이메일을 읽어주는 경우(1번 팁에서 언급했듯이) 읽을 수 없습니다.
이메일에 이미지를 너무 많이 넣지 말아야 하는 또 다른 (매우 중요한) 이유는 이메일 서버가 스팸메일이라고 생각하지 않도록 하기 위해서입니다.
" 주요 팁: 비주얼을 추가할 때 alt 텍스트를 포함하세요. 이 텍스트는 이미지가 로드되지 않거나 보이지 않는 경우 사람들에게 이미지가 무엇인지 알려줍니다.
6. 전체적으로 공백을 넣습니다.
텍스트와 이미지가 공백 없이 한데 뭉쳐져 있는 이메일을 받은 적이 있으신가요? 아니면 20줄이나 되는 긴 단락이 끊어질 틈 없이 길게 이어져 있는 이메일을 받은 적이 있나요? 보기에도 좋지 않고 가독성도 떨어집니다.
여백을 두세요. 문구와 이미지에 약간의 여백을 두어 깔끔하고 수신자가 이해하기 쉽도록 하세요. 대부분의 이메일 도구에는 텍스트나 이미지 사이에 공백을 추가하는 스페이서 타입 인서트(spacer-type insert)가 있습니다. 기본 텍스트에 두 줄 서식을 사용할 필요는 없지만, 한 줄로 된 텍스트는 모바일에서 읽기가 더 어려울 수 있습니다.
7. 적합한 글꼴을 선택합니다.
적합한 글꼴은 이메일에서 중요한 디자인 선택 사항입니다. 상대방이 텍스트를 읽을 수 있도록 간결한 글꼴을 선택하는 것이 중요합니다. 모두가 쉽게 읽을 수 있는 더 많은 글꼴을 찾아 적용하세요.
다른 사람이 내가 쓴 글을 읽을 수 있어야 합니다. 상대방이 텍스트를 읽을 수 있어야 합니다(저 위에 뭐라고 쓰여 있는지 알아차리기 어렵습니다
).
※ 보너스: 디자인 선택을 A/B 테스트하세요.
이메일 A/B 테스트는 동일한 이메일의 두 가지 버전을 만들되 두 버전 사이에 한두 가지를 다르게 만드는 것입니다. 대부분의 이메일 도구에는 이 기능이 있습니다.
자세한 방법은 이렇습니다. 발송 리스트를 반으로 분할하여 한쪽에는 버전 A를, 다른 쪽에는 버전 B를 보냅니다. 그러면 어떤 버전이 더 많은 클릭을 받았는지, 구독자들이 어떤 버전을 선호하는지 확인할 수 있습니다. 테스트할 수 있는 몇 가지 디자인 요소는 다음과 같습니다.
- 4. CTA 배치 또는 크기
- 5. 링크 색상
- 6. 이미지와 GIF 비교
- 7. 더 많은 문구 vs. 더 적은 문구
명확한 결과를 얻으려면 여러 개의 다른 이메일을 발송하여 테스트를 몇 번 실행하는 것이 좋습니다.
원문: Digital Marketing Curation
이 필자의 다른 글 읽기
Copyright ⓒ ㅍㅍㅅㅅ 무단 전재 및 재배포 금지
본 콘텐츠는 뉴스픽 파트너스에서 공유된 콘텐츠입니다.
