Computer >> 컴퓨터 >  >> 프로그래밍 >> HTML

HTML로 이메일 작성 후 Gmail로 전송하는 방법 완벽 가이드

HTML 이메일이란?

HTML 이메일 역시 이메일의 한 종류지만, 웹페이지와 비슷한 방식으로 그래픽, 색상, 링크, 표 등을 활용해 디자인된 이메일입니다. 뉴스레터 구독 시 받아본 화려한 메일을 떠올리면 쉽게 이해할 수 있습니다. 반면 일반 텍스트(Plain Text) 이메일은 사무실 내부에서 오가는 평범한 업무 메일처럼 텍스트만으로 구성된 이메일을 말합니다.

일반적으로 이메일 마케터들은 어느 형식이 더 우수한지 크게 논쟁하지 않습니다. 마케팅 테스트에서는 HTML 이메일이 항상 더 좋은 전환율을 보여주기 때문입니다. 다만 어떤 이메일 형식을 선택할지 결정하기 전에 몇 가지 요소를 고려해야 하며, 두 형식의 장점을 모두 살릴 수 있는 해결책도 존재합니다.

HTML로 이메일을 작성하는 방법

HTML 메일 앱을 사용하면 Gmail API를 통해 이메일을 작성하고 전송할 수 있습니다. Gmail 계정으로 로그인한 뒤 WYSIWYG(위지윅) 편집기로 이메일을 작성하거나, 코딩에 익숙하다면 HTML 모드로 전환해 CSS와 HTML로 직접 메시지를 작성할 수도 있습니다.

HTML로 이메일 작성 후 Gmail로 전송하는 방법 완벽 가이드


이 HTML 메일 앱은 기존 버전과 달리 Gmail 계정으로 이메일을 보낼 수 있으면서도 Google 계정에 대한 전체 액세스 권한이 필요하지 않습니다. 대신 내 대신 메시지를 작성하고 보내는 권한만 요청하며, 그 외의 메일함 내용은 읽을 수 없습니다. 이 앱은 오픈소스로 공개되어 있으며, 언제든지 Google 계정 설정 페이지에서 액세스 권한을 철회할 수 있습니다.

Gmail에서 HTML 이메일을 보내는 방법은? HTML 삽입이 가능한가?

Gmail 역시 다른 이메일 서비스 제공업체들과 마찬가지로 HTML 이메일 전송을 지원합니다. 간단한 도구를 제공하여 텍스트를 굵게 또는 기울임꼴로 만들거나, 원하는 스타일에 맞춰 다양한 색상을 적용할 수 있습니다. 다만 HTML 이메일을 보낼 때는 여러 가지를 고려해야 합니다. HTML 디자인을 검사하는 스팸 필터를 통과해야 할 뿐만 아니라, 수백 가지에 달하는 서로 다른 이메일 클라이언트 간의 HTML 표준 부재와 호환성 문제도 신경 써야 하기 때문입니다.

이메일 클라이언트의 종류

많은 사람들이 다양한 이메일 클라이언트를 사용합니다. Thunderbird나 Outlook 같은 데스크톱 클라이언트일 수도 있고, Yahoo, Hotmail, Gmail 같은 웹 기반 클라이언트일 수도 있습니다. 일부 클라이언트는 비즈니스 사용자에게 특화되어 있고, 또 다른 클라이언트는 개인 소비자를 위한 서비스에 집중합니다. 그중에서도 최고의 서비스를 제공하는 클라이언트는 많지 않습니다.

뉴스레터용 HTML 이메일을 디자인할 때는 반드시 지켜야 할 사항들이 있습니다. 간과하기 쉬운 요소들을 미리 숙지하지 않으면 나중에 상당히 번거로운 상황에 직면할 수 있습니다.

HTML 이메일에 배경 이미지를 사용하지 마세요

웹 기반 이메일 클라이언트가 늘어나고 Outlook 2007이 등장하면서 배경 이미지에 대한 지원이 제거되었습니다. 연락처 대부분이 아직 배경 이미지를 지원하는 이메일 클라이언트만 사용한다는 것을 확실히 알고 있다면 사용해도 무방하지만, 기본 원칙은 배경 이미지를 피하는 것입니다.

외부 링크 CSS는 피하세요

일부 이메일 클라이언트는 여전히 외부 CSS를 지원하지만, 대부분의 웹 기반 클라이언트는 외부 CSS 링크를 무시하거나 아예 제거해 버립니다.

마찬가지로 HTML 이메일 헤더에 정의된 CSS를 사용하는 것도 좋지 않습니다. 웹 기반 이메일 클라이언트가 이를 무시하거나 제거할 수 있기 때문입니다.

전체 메시지를 하나의 이미지로 만들지 마세요

안티스팸 필터는 이런 트릭을 잘 알아차립니다. 게다가 이렇게 하면 메시지 용량이 불필요하게 커질 수 있습니다.

HTML 이메일 디자인을 웹페이지처럼 만들지 마세요

HTML 렌더링 측면에서 웹 브라우저는 이메일 클라이언트보다 훨씬 발전되어 있습니다. DIV 태그로 HTML 이메일 페이지의 레이아웃을 정의했다면, 수신자가 메일을 열었을 때 레이아웃이 깨져 있는 모습을 보고 놀라지 마세요.

웹사이트용 HTML 코드를 작성할 때는 위에서 언급한 내용들이 모두 좋은 HTML 설계 관행에 해당하지만, 동일한 방식이 이메일 클라이언트 환경에서는 오히려 문제를 일으킬 수 있습니다.

왜 HTML 메일을 선택해야 할까?

Gmail은 훌륭한 시각 편집기를 제공하지만, Gmail과 HTML 메일 앱의 가장 큰 차이점은 후자가 HTML로 직접 이메일을 작성하고 스타일을 지정할 수 있다는 점입니다. 현재 Gmail에서는 표를 삽입할 방법이 없지만, HTML 메일 앱에서는 손쉽게 가능합니다. 도구 모음의 표 도구를 사용하거나 코드 보기로 전환해 직접 table 태그를 추가하면 됩니다.

Google이 다운되어도 HTML 메일 앱으로 메일을 보낼 수 있습니다

Gmail.com 웹사이트가 잠시 중단되는 경우도 종종 발생하는데, 이럴 때에도 HTML 메일 앱을 사용하면 최소한 Gmail 계정을 통해 메시지를 보낼 수 있습니다.

소셜 미디어 아이콘 또는 임베디드 이미지

HTML로 이메일 작성 후 Gmail로 전송하는 방법 완벽 가이드


이메일 메시지에 이미지를 삽입하거나 소셜 미디어 아이콘을 넣고 싶다면, imgur.com 같은 사이트에 이미지를 업로드한 뒤 업로드된 이미지의 URL을 '이미지 삽입' 입력란에 붙여넣으면 됩니다.

전송 한도는 Gmail과 동일합니다

HTML 메일 앱에서 이메일 작성을 마친 뒤 제목과 수신자 이메일 주소를 입력하고 전송 버튼을 누르면 됩니다. 하루에 보낼 수 있는 이메일 수는 Gmail과 동일하며, 전송 한도 역시 Gmail과 HTML 메일 앱이 같습니다.

전체 화면 모드

HTML 메일 앱에는 전체 화면 모드가 있어 방해받지 않는 환경에서 이메일을 작성할 수 있습니다. 시각 편집기는 내부적으로 TinyMCE를 기반으로 하며, 몇 가지 CSS 조정이 더해진 형태입니다.

판매 전환을 목표로 한다면 HTML 이메일이 더 유리합니다. 또한 제공하는 정보를 시각적으로 잘 정리하고 싶다면 HTML 이메일을 선택하는 것이 좋습니다. 성공적인 이메일 템플릿을 만들 수 있는 인력이 사내에 있다면 과감하게 HTML 이메일을 선택하세요.